Difference between revisions of "Team:Hong Kong-CUHK/Engagement"

Line 1: Line 1:
−
{{Hong_Kong-CUHK}}
+
<!DOCTYPE html>
−
 
+
 
<html>
 
<html>
−
  <head>
+
<title>W3.CSS</title>
−
<meta name="viewport" content="width=device-width, initial-scale=1">
+
−
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+
−
  <style>
+
−
{{Hong_Kong-CUHK}}
+
−
 
+
−
<html>
+
−
<head>
+
−
<style>  
+
−
 
+
−
section {
+
−
  margin:auto;
+
−
  position: relative;
+
−
  width: 85%;
+
−
  height: auto;
+
−
}
+
−
 
+
−
li {
+
−
    color: black;
+
−
font-family: roboto;
+
−
}
+
−
p{
+
−
    color: black;
+
−
}
+
−
 
+
  
 +
<style>
 +
.mySlides {display:none}
 
</style>
 
</style>
−
 
−
<script>
 
−
$('.carousel').carousel({
 
−
interval: 3000
 
−
})
 
−
</script>
 
−
</head>
 
−
 
  
 
<body>
 
<body>
−
 
 
<section id="Engage"> <!-- Outreach -->
 
<section id="Engage"> <!-- Outreach -->
 
<div class="col-lg-16">
 
<div class="col-lg-16">
Line 48: Line 16:
 
</div>
 
</div>
  
−
<div class="container">
+
<div class="w3-container">
−
        <div class="col-lg-6">
+
  <h2>Local Public Engagement</h2>
−
          <specialh3 > Local Pblic Engagement</specialh3>
+
  <p>In order to gain acceptance of our project, we need to allow the publics in Hong Kong to know about our project and synthetic biology. We achieved youth education on synthetic biology by our workshop, introduced participants to what synthetic biology is and induced their deeper thought on ethical issues connected to synthetic biology. Through in-campus activities, we promoted synthetic biology to our schoolmates of different majors and specialties, aroused attention to this topic. Holding outreach activities, we made our project more connected to the public, we gained opinions and so we could make improvements for the real-life practice of our project. </p>
 +
</div>
  
−
<br> In order to gain acceptance of our project, we need to allow the publics in Hong Kong to know about our project and synthetic biology. We achieved youth education on synthetic biology by our workshop, introduced participants to what synthetic biology is and induced their deeper thought on ethical issues connected to synthetic biology. Through in-campus activities, we promoted synthetic biology to our schoolmates of different majors and specialties, aroused attention to this topic. Holding outreach activities, we made our project more connected to the public, we gained opinions and so we could make improvements for the real-life practice of our project.
+
<div class="w3-content" style="max-width:800px">
 +
  <img class="mySlides" src="img_nature_wide.jpg" style="width:100%">
 +
  <img class="mySlides" src="img_fjords_wide.jpg" style="width:100%">
 +
  <img class="mySlides" src="img_mountains_wide.jpg" style="width:100%">
 +
</div>
  
−
<br><br>
+
<div class="w3-center">
−
<u>High School</u>
+
  <div class="w3-section">
−
<br>
+
    <button class="w3-button w3-light-grey" onclick="plusDivs(-1)">❮ Prev</button>
−
<i>One day Synthetic Biologist workshop (4 FEB 2017)</i>  
+
    <button class="w3-button w3-light-grey" onclick="plusDivs(1)">Next ❯</button>
−
<br>About 30 Students from 12 different high schools participated in this workshop and had hand-on experience about synthetic biology experiments under our guidance.The day camp consists of lab experiments, lectures of basics of synthetic biology and genetics as well as sharing of our project. We also discussed synthetic biology-related ethical issues. We conducted survey before and after the workshop. According to the survey result, students have increased understanding of synthetic biology after this workshop! We hope that this activity can inspire high school students’ interest in synthetic biology.
+
  </div>
−
<br><br>
+
  <button class="w3-button demo" onclick="currentDiv(1)">1</button>  
−
<u>University</u>
+
  <button class="w3-button demo" onclick="currentDiv(2)">2</button>  
−
<br>
+
  <button class="w3-button demo" onclick="currentDiv(3)">3</button>  
−
<i>CUHK Art fair (14-15 SEP 2016)</i>
+
</div>
−
<br>
+
−
CUHK Art fair is a carnival held in our university. We used this opportunity to introduce students about synthetic biology and our project. Through DIY Liquid Nitrogen Ice-cream, participants got a taste of what synthetic biology is like. We raised up the synbio- vanilla ice cream issue to students, allowing them to know what synthetic biology is and synthetic biology is actually around us in everyday life. Our booth successful aroused students’ interest in synthetic biology, many non-science students got new insights and better attitude towards synthetic biology.
+
−
<br><br>
+
−
<i>CUHK Information day (22 OCT 2017)</i>
+
  
−
<br>
+
<script>
−
Promote synthetic biology to high school audience. Though survey, we gain opinions and views of the high school audience on synthetic biology as well as our project.
+
var slideIndex = 1;
−
<br>
+
showDivs(slideIndex);
−
<u>General Public</u>
+
−
Through outreach activities, we hear voices from the public about our project and concerns about synthetic biology. This was precious chance for us to go out of laboratory, get our project and synthetic biology connected to the community.
+
  
−
<i>Visiting local community lab: DIYBio (12,19 JAN 2017)</i>
+
function plusDivs(n) {
−
DIYBio is the first growing biotechnological social movement in Hong Kong initiated in 2016. Through this platform, we hosted one public sharing session, presented our project to the audience and discussed safety issue with them. We also attended a talk given by HKU iGEM 2016 Team organized by DIYBIO Hong Kong and they shared with us their experience in iGEM.
+
  showDivs(slideIndex += n);
 +
}
  
−
<i>
+
function currentDiv(n) {
−
Vibrant Science Academy – Summer Science Party @Hong Kong Science & Technology Parks （Sundays in JUL and AUG 2017）</i>
+
  showDivs(slideIndex = n);
−
We collaborate with iGEM HKUST Team hold this event. Holding a booth in this public science carnaval, we aim to arouse general public’s interest in biology and our project. Through fun interactive activities, families and kids learn simple and basic biology. We taught children and their parents to build origami model to allow understanding of the basic DNA structure. We had another game “Who is the criminal?” focused on DNA application, allowing kids and their parents to know that DNA is closely connected to daily life. We promoted basic knowledge of synthetic biology to their parents as well. We encountered some talented kids with special interest in molecular biology and we met a few professionals in the field as well, they gave us rewardful advices and comments on our project.
+
}
  
 +
function showDivs(n) {
 +
  var i;
 +
  var x = document.getElementsByClassName("mySlides");
 +
  var dots = document.getElementsByClassName("demo");
 +
  if (n > x.length) {slideIndex = 1}   
 +
  if (n < 1) {slideIndex = x.length}
 +
  for (i = 0; i < x.length; i++) {
 +
    x[i].style.display = "none"; 
 +
  }
 +
  for (i = 0; i < dots.length; i++) {
 +
    dots[i].className = dots[i].className.replace(" w3-red", "");
 +
  }
 +
  x[slideIndex-1].style.display = "block"; 
 +
  dots[slideIndex-1].className += " w3-red";
 +
}
 +
</script>
  
−
Facebook Page
+
</body>
−
We created a facebook page to promote our team and project, we updated our progress with the public from time to time, we also share news and interesting facts about synthetic biology on this platform.
+
</html>
−
 
+
−
 
+
−
</div>
+
−
<br>
+
−
<p>
+
−
 
+
−
 
+
−
<div class="col-lg-6">
+
−
<!-- Carousel -->
+
−
    <div id="carousel-outreach" class="carousel slide" data-ride="carousel">
+
−
<!-- Indicators -->
+
−
<ol class="carousel-indicators">
+
−
  <li data-target="#carousel-outreach" data-slide-to="0" class="active"></li>
+
−
    <li data-target="#carousel-outreach" data-slide-to="1"></li>
+
−
    <li data-target="#carousel-outreach" data-slide-to="2"></li>
+
−
                            <li data-target="#carousel-outreach" data-slide-to="3"></li>
+
−
    <li data-target="#carousel-outreach" data-slide-to="4"></li>
+
−
    <li data-target="#carousel-outreach" data-slide-to="5"></li>
+
−
                            <li data-target="#carousel-outreach" data-slide-to="6"></li>
+
−
    <li data-target="#carousel-outreach" data-slide-to="7"></li>
+
−
    <li data-target="#carousel-outreach" data-slide-to="9"></li>
+
−
</ol>
+
−
<!-- Wrapper for slides -->
+
−
<div class="carousel-inner">
+
−
    <div class="item active">
+
−
    <img src="https://static.igem.org/mediawiki/2016/4/46/T--Imperial_College--NS1.jpg" alt="First slide">
+
−
                   
+
−
    </div>
+
−
    <div class="item">
+
−
    <img src="https://static.igem.org/mediawiki/2016/5/53/T--Imperial_College--NS2.jpg" alt="Second slide">
+
−
   
+
−
    </div>
+
−
    <div class="item">
+
−
    <img src="https://static.igem.org/mediawiki/2016/4/4f/T--Imperial_College--NS3.jpg" alt="Third slide">
+
−
    </div>
+
−
<div class="item">
+
−
    <img src="https://static.igem.org/mediawiki/2016/3/30/T--Imperial_College--NS4.jpg" alt="Fourth slide">
+
−
    </div>
+
−
<div class="item">
+
−
    <img src="https://static.igem.org/mediawiki/2016/3/34/T--Imperial_College--NS5.jpg" alt="Fifth slide">
+
−
    </div>
+
−
<div class="item">
+
−
    <img src="https://static.igem.org/mediawiki/2016/c/c4/T--Imperial_College--NS6.jpg" alt="Sixth slide">
+
−
    </div>
+
−
<div class="item">
+
−
    <img src="https://static.igem.org/mediawiki/2016/8/87/T--Imperial_College--NS7.jpg" alt="Seventh slide">
+
−
    </div>
+
−
<div class="item">
+
−
    <img src="https://static.igem.org/mediawiki/2016/4/4b/T--Imperial_College--NS8.jpg" alt="Eighth slide">
+
−
    </div>
+
−
<div class="item">
+
−
    <img src="https://static.igem.org/mediawiki/2016/4/48/T--Imperial_College--NS9.jpg" alt="Ninth slide">
+
−
    </div>
+
−
<div class="item">
+
−
    <img src="https://static.igem.org/mediawiki/2016/9/9d/T--Imperial_College--NS10.jpg" alt="Tenth slide">
+
−
    </div>
+
−
 
+
−
</div>
+
−
<!-- Controls -->
+
−
<a class="left carousel-control" href="#carousel-outreach" data-slide="prev">
+
−
    <i class="fa fa-arrow-left fa-3x" aria-hidden="true"></i>
+
−
</a>
+
−
<a class="right carousel-control" href="#carousel-outreach" data-slide="next">
+
−
    <i class="fa fa-arrow-right fa-3x" aria-hidden="true"></i>
+
−
</a>
+
−
</div><!-- /carousel -->
+
−
</div>
+
−
</div>
+
−
<div class="col-lg-10 text-justify col-centered">
+

Revision as of 09:09, 3 October 2017

<!DOCTYPE html> W3.CSS

Local Public Engagement

In order to gain acceptance of our project, we need to allow the publics in Hong Kong to know about our project and synthetic biology. We achieved youth education on synthetic biology by our workshop, introduced participants to what synthetic biology is and induced their deeper thought on ethical issues connected to synthetic biology. Through in-campus activities, we promoted synthetic biology to our schoolmates of different majors and specialties, aroused attention to this topic. Holding outreach activities, we made our project more connected to the public, we gained opinions and so we could make improvements for the real-life practice of our project.