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

Line 2: Line 2:
 
<html>
 
<html>
 
<head>
 
<head>
 +
<meta name="viewport" content="width=device-width, initial-scale=1">
 
<style>
 
<style>
 +
  
 
section {
 
section {
Line 10: Line 12:
 
   height: auto;
 
   height: auto;
 
background-color:#fff;
 
background-color:#fff;
 +
}
  
−
}
+
.adjust1{
−
.slider {
+
  margin:auto;width:100%; margin-bottom:0;  
−
width: 550px;
+
}  
−
margin: 2em auto;
+
.adjust2{
−
+
margin:0;  
−
}
+
}  
−
 
+
−
.slider-wrapper {
+
−
width: 100%;
+
−
height: 400px;
+
−
position: relative;
+
−
}
+
−
 
+
−
.slide {
+
−
float: left;
+
−
position: absolute;
+
−
width: 100%;
+
−
height: 100%;
+
−
opacity: 0;
+
−
transition: opacity 3s linear;
+
−
}
+
  
−
.slider-wrapper > .slide:first-child {
+
.carousel-control{
−
opacity: 1;
+
color:#000000; width:5%;
−
}
+
}
 +
.carousel-control:hover,
 +
.carousel-control:focus{  
 +
color:#31708f;
 +
}
 +
.carousel-control.left,
 +
.carousel-control.right{
 +
background-image: none;  
 +
}  
  
−
#images {
 
−
    width: 100%;
 
−
}
 
−
#images img {
 
−
  width: 300px;
 
−
  height: 200px;
 
−
  float: left;
 
−
margin:10px 30px;
 
−
}
 
 
</style>
 
</style>
 
</head>
 
</head>
  
 
<script>
 
<script>
−
(function() {
 
−
 
−
function Slideshow( element ) {
 
−
this.el = document.querySelector( element );
 
−
this.init();
 
−
}
 
−
 
−
Slideshow.prototype = {
 
−
init: function() {
 
−
this.wrapper = this.el.querySelector( ".slider-wrapper" );
 
−
this.slides = this.el.querySelectorAll( ".slide" );
 
−
this.previous = this.el.querySelector( ".slider-previous" );
 
−
this.next = this.el.querySelector( ".slider-next" );
 
−
this.index = 0;
 
−
this.total = this.slides.length;
 
−
this.timer = null;
 
−
 
−
this.action();
 
−
this.stopStart();
 
−
},
 
−
_slideTo: function( slide ) {
 
−
var currentSlide = this.slides[slide];
 
−
currentSlide.style.opacity = 1;
 
−
 
−
for( var i = 0; i < this.slides.length; i++ ) {
 
−
var slide = this.slides[i];
 
−
if( slide !== currentSlide ) {
 
−
slide.style.opacity = 0;
 
−
}
 
−
}
 
−
},
 
−
action: function() {
 
−
var self = this;
 
−
self.timer = setInterval(function() {
 
−
self.index++;
 
−
if( self.index == self.slides.length ) {
 
−
self.index = 0;
 
−
}
 
−
self._slideTo( self.index );
 
−
 
−
}, 3000);
 
−
},
 
−
stopStart: function() {
 
−
var self = this;
 
−
self.el.addEventListener( "mouseover", function() {
 
−
clearInterval( self.timer );
 
−
self.timer = null;
 
−
 
−
}, false);
 
−
self.el.addEventListener( "mouseout", function() {
 
−
self.action();
 
−
 
−
}, false);
 
−
}
 
−
 
−
 
−
};
 
−
 
−
document.addEventListener( "DOMContentLoaded", function() {
 
−
 
−
var slider = new Slideshow( "#main-slider" );
 
−
 
−
});
 
−
 
−
 
−
})();
 
−
 
  
 +
$('#mycarousel1').carousel({
 +
  interval: 500,
 +
  keyboard: true
 +
});
 +
$('#mycarousel').carousel({
 +
  interval: 500,
 +
  keyboard: true
 +
});
 +
$('#mycarousel2').carousel({
 +
  interval: 500,
 +
  keyboard: true
 +
});
 
</script>
 
</script>
 
</style>
 
</style>
 
<body>
 
<body>
 +
  
  
Line 152: Line 85:
 
</ul>
 
</ul>
  
−
</div>
+
 
−
<div id="images">
+
</div>
−
     <img src="https://static.igem.org/mediawiki/2017/7/79/CuhkDIYBio.PNG"/>
+
 
−
     <img src="https://static.igem.org/mediawiki/2017/a/a7/CuhkDIYBio1.PNG"/>
+
<div id="myCarousel" class="carousel slide" data-ride="carousel">
−
<img src="https://static.igem.org/mediawiki/2017/5/57/CuhkDIYBio2.PNG"/>
+
  <!-- Indicators -->
 +
  <ol class="carousel-indicators">
 +
     <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
 +
    <li data-target="#myCarousel" data-slide-to="1"></li>
 +
     <li data-target="#myCarousel" data-slide-to="2"></li>
 +
  </ol>
 +
 
 +
  <!-- Wrapper for slides -->
 +
  <div class="carousel-inner">
 +
    <div class="item active">
 +
        <img src="https://static.igem.org/mediawiki/2017/8/8e/Daycamp1.png" >
 
     </div>
 
     </div>
  
−
<br>
+
    <div class="item">
−
<br>
+
        <img src="https://static.igem.org/mediawiki/2017/9/91/Daycamp2.png"  >
−
<br>
+
    </div>
−
<br>
+
 
−
<br>
+
<div class="item">
−
<br>
+
        <img src="https://static.igem.org/mediawiki/2017/1/14/Daycamp3.png"  >
−
<br>
+
    </div>
−
<br>
+
 
−
<br>
+
  </div>
−
<br>
+
 
−
<br>
+
  <!-- Left and right controls -->
−
<br>
+
  <a class="left carousel-control" href="#myCarousel" data-slide="prev">
−
<br>
+
    <span class="glyphicon glyphicon-chevron-left"></span>
−
<br>
+
    <span class="sr-only">Previous</span>
−
<br>
+
  </a>
−
<br>
+
  <a class="right carousel-control" href="#myCarousel" data-slide="next">
 +
    <span class="glyphicon glyphicon-chevron-right"></span>
 +
    <span class="sr-only">Next</span>
 +
  </a>
 +
</div>
 +
</section>
 +
 
 +
<section id="section02">
 +
<div class="splash" id="mainsplash">
 +
 
 
<br>
 
<br>
 
<br>
 
<br>
Line 199: Line 151:
 
<br>
 
<br>
 
<div id="images">
 
<div id="images">
−
    <img src="https://static.igem.org/mediawiki/2017/6/65/Cuhkigemworkshop.PNG"/ width="40%" >
 
−
    <img src="https://static.igem.org/mediawiki/2017/3/3d/Cuhkigemworkshop1.PNG"/ width="40%">
 
  
 +
<div id="myCarousel1" class="carousel slide" data-ride="carousel">
 +
  <!-- Indicators -->
 +
  <ol class="carousel-indicators">
 +
    <li data-target="#myCarousel1" data-slide-to="0" class="active"></li>
 +
    <li data-target="#myCarousel1" data-slide-to="1"></li>
 +
  </ol>
 +
 +
  <!-- Wrapper for slides -->
 +
  <div class="carousel-inner">
 +
    <div class="item active">
 +
        <img src="https://static.igem.org/mediawiki/2017/8/85/Diybio1.png" >
 
     </div>
 
     </div>
−
<br>
+
 
−
<br>
+
    <div class="item">
−
<br>
+
        <img src="https://static.igem.org/mediawiki/2017/f/f5/Diybio2.png"  >
−
<br>
+
    </div>
−
<br>
+
 
−
<br>
+
  </div>
−
<br>
+
 
−
<br>
+
  <!-- Left and right controls -->
−
<br>
+
  <a class="left carousel-control" href="#myCarousel1" data-slide="prev">
−
<br>
+
    <span class="glyphicon glyphicon-chevron-left"></span>
 +
    <span class="sr-only">Previous</span>
 +
  </a>
 +
  <a class="right carousel-control" href="#myCarousel1" data-slide="next">
 +
    <span class="glyphicon glyphicon-chevron-right"></span>
 +
    <span class="sr-only">Next</span>
 +
  </a>
 +
</div>
 +
 
 +
    </div>
 +
 
 
<br>
 
<br>
  

Revision as of 18:08, 28 October 2017

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.

One day Synthetic Biocheimst workshop (4 FEB 2017)
There were around 30 students from 12 different high schools (as listed below) participated in the workshop for hand-on experience about synthetic biology experiments under our guidance.The day camp consisted 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 surveys before and after the workshop. It shows that students have increased understanding of synthetic biology after this workshop! Through this activity, we would like to inspire high school students’ interest in synthetic biology.
  • Diocesan Boys' School
  • HKU SPACE Po Leung Kuk Stanley Ho Community College
  • N.L.S.I. Lui Kwok Pat Fong College
  • Pentecostal Lam Hon Kwong School
  • Qualied College
  • St. Paul's Convent School
  • Hong Kong Chinese Women's Club College
  • Ma On Shan Tsung Tsin Secondary School
  • Queen's College Old Boys' Association Secondary
  • St.Clare's Girls' School
  • Tsuen Wan Government Secondary School




CUHK Art fair (14-15 SEP 2016)
We introduced students about synthetic biology and our project in CUHK Art fair, which is an annual carnival held in our university. We organised DIY Liquid Nitrogen Ice-cream for participants to experience science in daily life . By raising the synbio- vanilla ice cream issue to students, it allowed them to understand how science and synthetic biology is related to our everyday life. Our booth successfully aroused students’ interest in synthetic biology, many non-science students got new insights and better attitude towards synthetic biology.

CUHK Information day (22 OCT 2017)
Through outreach activities, we collected opinions from the public about our project and concerns related to synthetic biology. This was precious chance for us to go out of laboratory, and get our project and synthetic biology connected to the community.

Visiting local community lab: DIYBio (12,19 JAN 2017)
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.

Vibrant Science Academy – Summer Science Party @Hong Kong Science & Technology Parks （Sundays in JUL and AUG 2017）
We invited iGEM HKUST Team to collaborate with us. 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, kids learn simple and basic biology. We taught children to build origami model to allow kids understand the basic structure of DNA. 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.

International public engagement


Due to the high population, East and South East Asia is the global source of influenza. In addition, rapid spread of Influenza is more serious in undeveloped country due to less developed system. Therefore, our project and the idea of synthetic biology should also be introduced to the publics in those countries. However, most underdeveloped countries don’t have the concept of synthetic biology. Among the region, Bangladesh is country affected by influenza and without the concept of synbio. Therefore, we first choose Bangladesh as the first targeted country.

First ever synthetic biology event in Bangladesh (16 JUN 2017)
We cooperated with Bio Bangla, a community lab in Dhaka, to hold the first ever synthetic biology event in Bangladesh. We gave presentation about synthetic biology and our projects. About 40 students from 6 universities joined the event. The chairman of Microbiology department at Noakhali Science and Technology University- Firoz Ahmed and Prime minister a2i project consultant- Iran Khan also joined the event. After the event, we are very glad to notice that they will form the first iGEM team in Bangladesh in 2018. We therefore also provided advices in establishment of first iGEM team in Bangladesh.





















Skype meeting with Biohacking space Peshawar (11 JAN 2017) Biohacking space Peshawar is the first Bio-Hacking space in Pakistan.We had a quality video conference with Biohacking space Peshawar. We came up with vast possible collaborations opportunities that we could complement each other's technical limitations. This skype meeting achieved a step towards Synthetic Biology in Pakistan.

iGEM Conference


The 4th iGEM Asia- Pacific Conference (8 - 14 AUG 2016)
We joined the iGEM Asia- Pacific Conference conducted in Tainan in August 2016, we have gained deep insights into perspectives of synthetic biology, from ethics to big data processing, via in-depth discussions with fellow iGEMers. The experience workshop and presentations with the 20 Asian iGEM teams also gives us inspirations in operating an iGEM team and conducting human practice. We had got valuable advice in connecting ourselves to the public from Ana Sifuentes from iGEM headquarters. Professors gave us precious advice on our future planning and orientation and pointed out the practical difficulties and problems hiding inside our project.

Pan-Pearl iGEM Teams Meeting (5 AUG 2017)
We attended and presented our project in the conference. We had exchanged ideas with other iGEM teams as well. Supervisors from other iGEM teams gave helpful advices for improvement of our project. We also gain more experience in presenting and answering questions, it was like a small rehearsal for Jamboree.


DIYBio Biosafety Sharing (11 AUG 2017)
DIYBio HK shared with us their safety protocol, biosafety practice in their lab as well as the recent situation and regulations on genetically modified organisms in Hong Kong. We gain precious inspirations from the talk on biosafety and we realized that regulations in Hong Kong need to be improved. Meeting with all other local iGEM teams, we had nice communications on difficulties we are facing respectively and gave each other suggestions.
First Second Third
     

Email: igemcuhk1617@gmail.com