Difference between revisions of "Team:British Columbia/Practices/Booth"

 
(40 intermediate revisions by 4 users not shown)
Line 10: Line 10:
 
<div id="UBCtitle">
 
<div id="UBCtitle">
 
<div id="one" style="width:400px;">&nbsp;</div>
 
<div id="one" style="width:400px;">&nbsp;</div>
−
<div id="three" style="width:400px;"><h3>Activity</h3></div>
+
<div id="three" style="width:400px;"><h3>Science World Booth</h3></div>
 
     <div id="two" style="width:400px;">&nbsp;</div>
 
     <div id="two" style="width:400px;">&nbsp;</div>
 
</div></div></div>
 
</div></div></div>
Line 17: Line 17:
  
 
<div id="UBCbody">
 
<div id="UBCbody">
 +
<p>Through our interviews, we realized there was a large deficiency in the public's awareness of CCD and worked to remedy this through large-scale public events.</p>
 +
 +
<p>Telus World of Science is a charitable organization that engages British Columbians in science and inspires future science and technology leadership throughout our province. We co-hosted an event along with Hives for Humanity at Telus World of Science, attracting constant traffic through the three hour event. It was an excellent opportunity to engage with a lot of the public in partnership with a popular, well-established hub. The demographic of our visitors were mostly children and teenagers along with parents, and we had several different activities including: </p>
 +
<ol style="list-style:none;"><li>- Trivia board with topical, relatively difficult questions to engage both children and adults. Click <a href="https://2015.igem.org/Team:British_Columbia/Practices/Booth/Trivia">here</a> to play Bee Trivia!
 +
</li>
 +
<li>- Input poster for visitors to write their thoughts on bees and draw pictures </li>
 +
<li>- DNA extraction station for introducing basic laboratory concepts to children</li>
 +
<br />
 +
<div id="cf7" class="shadow">
 +
<img class='opaque' src="https://static.igem.org/mediawiki/2015/e/ec/SW-1.jpeg" width="500" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/e/ec/SW-2.jpeg" width="500" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/1/1a/SW-3.jpeg" width="500" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/b/bd/SW-4.jpeg" width="500" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/7/78/SW-5.jpeg" width="500" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/a/a6/SW-6.jpeg" width="500" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/6/62/SW-7.jpeg" height="333px"  style="padding-left:100px;"/>
 +
  <img  src="https://static.igem.org/mediawiki/2015/5/5f/SW-8.jpeg"  height="333px"  style="padding-left:20px;"/>
 +
  <img  src="https://static.igem.org/mediawiki/2015/a/a3/SW-9.jpeg"  height="333px"  style="padding-left:100px;"/>
 +
  <img  src="https://static.igem.org/mediawiki/2015/2/2e/SW-10.jpeg" width="500" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/6/64/SW-11.jpeg" height="333px"  style="padding-left:100px;" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/5/50/SW-12.jpeg" height="333px"  style="padding-left:100px;" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/7/71/SW-13.jpeg" height="333px"  style="padding-left:100px;" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/c/c0/SW-14.jpeg" height="333px"  style="padding-left:100px;" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/6/65/SW-15.jpeg" width="500" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/1/10/SW-16.jpeg" width="500" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/a/a4/SW-17.jpeg" width="500" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/8/81/SW-18.jpeg" width="500" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/f/fc/SW-19.jpeg" width="500" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/1/1c/SW-20.jpeg" height="333px"  style="padding-left:100px;" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/a/a2/SW-21.jpeg" height="333px"  style="padding-left:100px;" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/d/dc/SW-22.jpeg" width="500" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/d/d1/SW-23.jpeg" width="500" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/8/88/SW-24.jpeg" width="500" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/4/4c/SW-25.jpeg" width="500" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/2/27/SW-26.jpeg" width="500" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/1/1f/SW-27.jpeg" width="500" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/c/c2/SW-28.jpeg" height="333px"  style="padding-left:100px;" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/e/ef/SW-29.jpeg" width="500" />
 +
  <img  src="https://static.igem.org/mediawiki/2015/6/64/SW-30.jpeg" width="500" />
  
−
<h4>Click <a href="https://2015.igem.org/Team:British_Columbia/Practices">here</a> to return to the Policy and Practices Timeline</h4>
 
−
<div style="clear:both;"></div>
 
  
−
<div class="section">
+
</div>
−
        <div class="section__content clearfix">
+
<p id="cf7_controls">
−
          <div class="card effect__click">
+
  <span class="selected"><img src="https://static.igem.org/mediawiki/2015/e/ec/SW-1.jpeg" width="100" /></span>
−
            <div class="card__front">
+
  <span><img  src="https://static.igem.org/mediawiki/2015/e/ec/SW-2.jpeg" width="100" /></span>
−
              <span class="card__text">front</span>
+
  <span><img  src="https://static.igem.org/mediawiki/2015/1/1a/SW-3.jpeg" width="100" /></span>
−
            </div>
+
  <span><img  src="https://static.igem.org/mediawiki/2015/b/bd/SW-4.jpeg" width="100" /></span>
−
            <div class="card__back">
+
  <span><img  src="https://static.igem.org/mediawiki/2015/7/78/SW-5.jpeg" width="100" /></span>
−
              <span class="card__text">back</span>
+
  <span><img  src="https://static.igem.org/mediawiki/2015/a/a6/SW-6.jpeg" width="100" /></span>
−
            </div>
+
  <span><img  src="https://static.igem.org/mediawiki/2015/6/62/SW-7.jpeg" width="100" /></span>
−
          </div><!-- /card -->
+
  <span><img  src="https://static.igem.org/mediawiki/2015/5/5f/SW-8.jpeg" width="100" /></span>
−
          <div class="card effect__click">
+
  <span><img  src="https://static.igem.org/mediawiki/2015/a/a3/SW-9.jpeg" width="100" /></span>
−
            <div class="card__front">
+
  <span><img  src="https://static.igem.org/mediawiki/2015/2/2e/SW-10.jpeg" width="100" /></span>
−
              <span class="card__text">front</span>
+
  <span><img  src="https://static.igem.org/mediawiki/2015/6/64/SW-11.jpeg" width="100" /></span>
−
            </div>
+
  <span><img  src="https://static.igem.org/mediawiki/2015/5/50/SW-12.jpeg" width="100" /></span>
−
            <div class="card__back">
+
  <span><img  src="https://static.igem.org/mediawiki/2015/7/71/SW-13.jpeg" width="100" /></span>
−
              <span class="card__text">back</span>
+
  <span><img  src="https://static.igem.org/mediawiki/2015/c/c0/SW-14.jpeg" width="100" /></span>
−
            </div>
+
  <span><img  src="https://static.igem.org/mediawiki/2015/6/65/SW-15.jpeg" width="100" /></span>
−
          </div><!-- /card -->
+
  <span><img  src="https://static.igem.org/mediawiki/2015/1/10/SW-16.jpeg" width="100" /></span>
−
          <div class="card effect__click">
+
  <span><img  src="https://static.igem.org/mediawiki/2015/a/a4/SW-17.jpeg" width="100" /></span>
−
            <div class="card__front">
+
  <span><img  src="https://static.igem.org/mediawiki/2015/8/81/SW-18.jpeg" width="100" /></span>
−
              <span class="card__text">front</span>
+
  <span><img  src="https://static.igem.org/mediawiki/2015/f/fc/SW-19.jpeg" width="100" /></span>
−
            </div>
+
  <span><img  src="https://static.igem.org/mediawiki/2015/1/1c/SW-20.jpeg" width="100" /></span>
−
            <div class="card__back">
+
  <span><img  src="https://static.igem.org/mediawiki/2015/a/a2/SW-21.jpeg" width="100" /></span>
−
              <span class="card__text">back</span>
+
  <span><img  src="https://static.igem.org/mediawiki/2015/d/dc/SW-22.jpeg" width="100" /></span>
−
            </div>
+
  <span><img  src="https://static.igem.org/mediawiki/2015/d/d1/SW-23.jpeg" width="100" /></span>
−
          </div><!-- /card -->
+
  <span><img  src="https://static.igem.org/mediawiki/2015/8/88/SW-24.jpeg" width="100" /></span>
−
          <div class="card effect__click">
+
  <span><img  src="https://static.igem.org/mediawiki/2015/4/4c/SW-25.jpeg" width="100" /></span>
−
            <div class="card__front">
+
  <span><img  src="https://static.igem.org/mediawiki/2015/2/27/SW-26.jpeg" width="100" /></span>
−
              <span class="card__text">front</span>
+
  <span><img  src="https://static.igem.org/mediawiki/2015/1/1f/SW-27.jpeg" width="100" /></span>
−
            </div>
+
  <span><img  src="https://static.igem.org/mediawiki/2015/c/c2/SW-28.jpeg" width="100" /></span>
−
            <div class="card__back">
+
  <span><img  src="https://static.igem.org/mediawiki/2015/e/ef/SW-29.jpeg" width="100" /></span>
−
              <span class="card__text">back</span>
+
  <span><img  src="https://static.igem.org/mediawiki/2015/6/64/SW-30.jpeg" width="100" /></span>
−
            </div>
+
</p>
−
          </div>
+
<div style="clear:both;"></div>
−
        </div><!-- /card -->
+
<h4 style="text-align:center;">Click <a href="https://2015.igem.org/Team:British_Columbia/Practices">here</a> to return to the Policy and Practices Timeline</h4>
−
      </div><!-- /section -->
+
<div style="clear:both;"></div>
 +
</div>
 
</div>
 
</div>
  
 
</div>
 
</div>
−
<style>
 
−
.card {
 
−
  position: relative;
 
−
  float: left;
 
−
width:200px;
 
−
height:150px;
 
−
  text-align: center;
 
−
padding:15px;
 
−
}
 
−
 
−
.card__front,
 
−
.card__back {
 
−
  position: absolute;
 
−
  top: 0;
 
−
  left: 0;
 
−
  width: 100%;
 
−
  height: 100%;
 
−
}
 
−
 
−
.card__front,
 
−
.card__back {
 
−
  -webkit-backface-visibility: hidden;
 
−
          backface-visibility: hidden;
 
−
  -webkit-transition: -webkit-transform 0.3s;
 
−
          transition: transform 0.3s;
 
−
}
 
−
 
−
.card__front {
 
−
  background-color: beige;
 
−
color:black;
 
−
}
 
−
 
−
.card__back {
 
−
  background-color: black;
 
−
  -webkit-transform: rotateY(-180deg);
 
−
          transform: rotateY(-180deg);
 
−
color:white;
 
−
}
 
−
 
−
.card.effect__click.flipped .card__front {
 
−
  -webkit-transform: rotateY(-180deg);
 
−
          transform: rotateY(-180deg);
 
−
}
 
−
 
−
.card.effect__click.flipped .card__back {
 
−
  -webkit-transform: rotateY(0);
 
−
          transform: rotateY(0);
 
−
}
 
−
 
−
</style>
 
−
<script>
 
−
 
−
(function() {
 
−
  var cards = document.querySelectorAll(".card.effect__click");
 
−
  for ( var i  = 0, len = cards.length; i < len; i++ ) {
 
−
    var card = cards[i];
 
−
    clickListener( card );
 
−
  }
 
  
−
  function clickListener(card) {
 
−
    card.addEventListener( "click", function() {
 
−
      var c = this.classList;
 
−
      c.contains("flipped") === true ? c.remove("flipped") : c.add("flipped");
 
−
    });
 
−
  }
 
−
})();
 
−
</script>
 
 
</html>
 
</html>
  
 
{{:Team:British Columbia/Template/Fixedfooter}}
 
{{:Team:British Columbia/Template/Fixedfooter}}

Latest revision as of 23:13, 18 September 2015

UBC iGEM 2015

 

Science World Booth

 

Through our interviews, we realized there was a large deficiency in the public's awareness of CCD and worked to remedy this through large-scale public events.

Telus World of Science is a charitable organization that engages British Columbians in science and inspires future science and technology leadership throughout our province. We co-hosted an event along with Hives for Humanity at Telus World of Science, attracting constant traffic through the three hour event. It was an excellent opportunity to engage with a lot of the public in partnership with a popular, well-established hub. The demographic of our visitors were mostly children and teenagers along with parents, and we had several different activities including:

  1. - Trivia board with topical, relatively difficult questions to engage both children and adults. Click here to play Bee Trivia!
  2. - Input poster for visitors to write their thoughts on bees and draw pictures
  3. - DNA extraction station for introducing basic laboratory concepts to children

    4. Click here to return to the Policy and Practices Timeline