Difference between revisions of "Team:TCFSH Taiwan/HP/Silver"

(Prototype team page)
 
Line 1: Line 1:
 
{{TCFSH_Taiwan}}
 
{{TCFSH_Taiwan}}
 +
{{TCFSH_Taiwan/Navigation}}
 
<html>
 
<html>
−
<div class="column full_size judges-will-not-evaluate">
+
<head>
−
<h3>★  ALERT! </h3>
+
<meta charset="UTF-8">
−
<p>This page is used by the judges to evaluate your team for the <a href="https://2017.igem.org/Judging/Medals">medal criterion</a> or <a href="https://2017.igem.org/Judging/Awards"> award listed above</a>. </p>
+
−
<p> Delete this box in order to be evaluated for this medal criterion and/or award. See more information at <a href="https://2017.igem.org/Judging/Pages_for_Awards"> Instructions for Pages for awards</a>.</p>
+
−
</div>
+
−
<div class="clear"></div>
+
  
 +
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
  
−
<div class="column full_size">
+
<link href="https://2016.igem.org/Team:NCTU_Formosa/wiki_reset?action=raw&ctype=text/css" rel="stylesheet">
 +
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400" rel="stylesheet">
  
−
<h1>Silver Medal Human Practices</h1>
 
−
<p>iGEM teams are leading in the area of Human Practices because they conduct their projects within a social/environmental context, to better understand issues that might influence the design and use of their technologies.</p>
 
−
<p>Teams work with students and advisors from the humanities and social sciences to explore topics concerning ethical, legal, social, economic, safety or security issues related to their work. Consideration of these Human Practices is crucial for building safe and sustainable projects that serve the public interest. </p>
 
−
<p>For more information, please see the <a href="https://2017.igem.org/Competition/Human_Practices">Human Practices page</a>.</p>
 
−
</div>
 
  
−
<div class="clear"></div>
+
<style type="text/css">
 +
#sideMenu, #top_title {display:none;}
 +
#content { padding:0px; width:100%; margin-top:-7px; margin-left:0px;}
 +
body {background-color:white; }
 +
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
 +
#top_menu_inside {margin-left: 20px; margin-bottom: 0px;}
  
−
<div class="column half_size">
 
−
<h3>Silver Medal Criterion #3</h3>
 
−
<p>Convince the judges you have thought carefully and creatively about whether your work is safe, responsible and good for the world. You could accomplish this through engaging with your local, national and/or international communities or other approaches. Please note that standard surveys will not fulfill this criteria.</p>
 
−
</div>
 
  
−
<div class="column half_size">
+
html, body, div, span, applet, object, iframe,
−
<h5>Some Human Practices topic areas </h5>
+
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
−
<ul>
+
a, abbr, acronym, address, big, cite, code,
−
<li>Philosophy</li>
+
del, dfn, em, font, img, ins, kbd, q, s, samp,
−
<li>Public Engagement / Dialogue</li>
+
small, strike, strong, sub, tt, var,
−
<li>Education</li>
+
b, u, i, center,
−
<li>Product Design</li>
+
dl, dt, dd, ol, ul, li,
−
<li>Scale-Up and Deployment Issues</li>
+
fieldset, form, label, legend,
−
<li>Environmental Impact</li>
+
table, caption, tbody, tfoot, thead, tr, th, td {
−
<li>Ethics</li>
+
    margin: 0;
−
<li>Safety</li>
+
    padding: 0;
−
<li>Security</li>
+
    border: 0;
−
<li>Public Policy</li>
+
    outline: 0;
−
<li>Law and Regulation</li>
+
−
<li>Risk Assessment</li>
+
−
</ul>
+
−
</div>
+
  
 +
}
  
−
<div class="column half_size">
 
−
<h5>What should we write about on this page?</h5>
 
−
<p>On this page, you should write about the Human Practices topics you considered in your project, and document any special activities you did (such as visiting experts, talking to lawmakers, or doing public engagement). This should include all of the work done for the Silver Medal Criterion #3. Details for your Gold medal work and/or work for the two Human Practices special prizes should be put on those specified pages.</p>
 
−
</div>
 
  
 +
* {
 +
  font-family: 'Open Sans', sans-serif;
 +
    font-weight: 300;
 +
}
 +
body{
 +
    background-color:rgb(51,51,51) !important;
 +
    line-height:1;
 +
}
  
−
<div class="column half_size">
+
h1{
−
<h5>Inspiration</h5>
+
background-image:url('https://static.igem.org/mediawiki/2017/a/a9/Tcfshtaiwan_background.jpeg');
−
<p>Read what other teams have done:</p>
+
}
−
<ul>
+
−
<li><a href="https://2014.igem.org/Team:Dundee/policypractice/experts">2014 Dundee </a></li>
+
−
<li><a href="https://2014.igem.org/Team:UC_Davis/Policy_Practices_Overview">2014 UC Davis </a></li>
+
−
<li><a href="https://2013.igem.org/Team:Manchester/HumanPractices">2013 Manchester </a></li>
+
−
<li><a href="https://2013.igem.org/Team:Cornell/outreach">2013 Cornell </a></li>
+
−
</ul>
+
−
</div>
+
  
 +
/*大圖*/
 +
@media screen and (min-width: 768px) {
 +
  .img-container{
 +
    height:100vh ;
 +
    overflow:hidden ;
 +
    width:100%;
 +
  }
 +
  .main-img{
 +
    top: 0;
 +
    bottom: 0;
 +
    left: 0;
 +
    right: 0;
 +
    width: 100%;
 +
    margin: auto;
 +
    z-index:999;
 +
    }
 +
}
 +
@media screen and (orientation: portrait) {
 +
    .img-container{
 +
        height:auto;
 +
        overflow:none;
 +
        width:100%;
 +
    }
 +
    .main-img{
 +
        top: 0;
 +
        bottom: 0;
 +
        left: 0;
 +
        right: 0;
 +
        width: 100%;
 +
        margin: auto;
 +
        z-index:999;
 +
    }
 +
}
 +
/*scroll navigaiton*/
 +
nav {
 +
  padding: 18px;
 +
  position: fixed;
 +
  height: auto;
 +
  left:0.5vw;
 +
  width: auto;
 +
  z-index: 9999;
 +
  top:25%;
 +
  margin: auto;
 +
}
  
 +
nav .wrapper {
 +
  padding: 0;
 +
  width:100%;
 +
  height: 785px;
 +
}
  
 +
nav .nodes {
 +
  position: relative;
 +
  margin-top: 1px;
 +
  margin-left: 1px;
 +
 +
}
 +
 +
.line {
 +
  position: absolute;
 +
  width:1px;
 +
  height:705px;
 +
  top: 13px;
 +
}
 +
.line .red {
 +
  width:1px;    /*調line長度*/
 +
  height:47%; /*line寬度*/
 +
  position:relative;
 +
 +
}
 +
 +
.line .blue {
 +
  width: 1px;  /*line寬度*/
 +
  height: 15%;  /*調line長度*/
 +
  position:relative;
 +
  left:51px;
 +
 +
}
 +
.line .red-container {
 +
  position:relative;
 +
  width: 4px;
 +
}
 +
.line .red {
 +
  background-color:#00D6FF;/*cover line color*/
 +
  *zoom: 1;
 +
  background-size: 100%;
 +
}
 +
.line .blue {
 +
  background-color: white;/*line color*/
 +
  *zoom: 1;
 +
  background-size: 100%;
 +
 +
}
 +
 +
.node {
 +
  margin-left: 40px;/*調node間距*/
 +
  width: 20px;
 +
  height: 20px;
 +
  margin-top: 30px;
 +
  position: relative;
 +
}
 +
.node .splash {
 +
  box-shadow: 0px 0px 8px 2px rgba(69, 174, 233, 0.53);
 +
  transform: translateZ(0px) scale(1);
 +
  position: absolute;
 +
  width: 20px;
 +
  height: 20px;
 +
  border-radius: 100%;
 +
  pointer-events: none;
 +
  opacity: 1;
 +
}
 +
.node.active .active-circle {
 +
  transform: scale(1);
 +
  opacity: 1;
 +
  background:white;/*active circle color*/
 +
  left:1.6px; 
 +
}
 +
.node.active .splash {
 +
  transition: transform 1200ms, opacity 1500ms;
 +
  transform: translateZ(0px) scale(2.5);
 +
  opacity: 0 !important;
 +
 +
}
 +
.node.active .inactive-circle {
 +
  transition: opacity 200ms;
 +
  opacity: 0;
 +
}
 +
.node .active-circle {
 +
  transition: all 300ms cubic-bezier(0.63, 0.62, 0.48, 1.84);
 +
  transform: scale(0.7);
 +
  position: absolute;
 +
  opacity: 0;
 +
  width: 20px;
 +
  height: 20px;
 +
  border-radius: 100%;
 +
  background-color: #4b1202;
 +
  *zoom: 1;
 +
  background-size: 100%;
 +
 +
}
 +
.node .active-circle .cover {
 +
  transform: translateZ(0px);
 +
  width: 16px;
 +
  height: 16px;
 +
  background:#00D6FF;/*active circle color */
 +
  border-radius: 100%;
 +
  position: absolute;
 +
  top: 2px;
 +
  left: 2px;
 +
}
 +
 +
.node .inactive-circle {
 +
  transition: all 300ms cubic-bezier(0.63, 0.62, 0.48, 1.84);
 +
  width: 14px;
 +
  height: 14px;
 +
  display: block;
 +
  background: #000;
 +
  position: absolute;
 +
  border-radius: 100%;
 +
  border: 2px solid white;
 +
  top: 3px;
 +
  left: 3px;
 +
}
 +
.node:hover {
 +
  cursor: pointer;
 +
}
 +
.node:hover .active-circle {
 +
  transition: all 200ms cubic-bezier(0.63, 0.62, 0.48, 1.84);
 +
  transform: scale(0.84);
 +
}
 +
 +
.node:hover .inactive-circle {
 +
  transition: all 200ms cubic-bezier(0.63, 0.62, 0.48, 1.84);
 +
  transform: scale(0.85);
 +
}
 +
 +
/*left-topic*/
 +
 +
.topic{
 +
    position:relative;
 +
    margin-top:0vh !important;
 +
    width:200px;
 +
    height:auto;
 +
    left:210px;
 +
    float:right;
 +
    color:#F3F7F7;
 +
}
 +
.text_color{
 +
    color:#F3F7F7;
 +
    font-size:12pt !important;
 +
}
 +
/*content*/
 +
.content_container{
 +
    position:relative;
 +
    left:6.5vw;
 +
    right:6.5vw;
 +
    margin:0 auto;
 +
    width:60vw;
 +
    height:auto;
 +
}
 +
.title{
 +
    font-size:25pt !important;
 +
    color:rgb(0, 206, 255);
 +
    text-shadow:1px 1px 10px rgb(0, 206, 255);
 +
    border-left:3px solid rgb(0, 206, 255);
 +
    padding-left:10px !important; 
 +
    margin-top:20px;
 +
    margin-bottom:10px;
 +
    font-weight:bold;
 +
}
 +
.content{
 +
    font-size:15pt !important;
 +
    text-align:justify;
 +
    text-indent:2em;
 +
    color:#F3F7F7;
 +
    padding-left:40px;
 +
    padding-top:15px;
 +
    padding-bottom:15px;
 +
}
 +
/*second title*/
 +
.content-1{
 +
    font-size:19pt !important;
 +
    text-align:justify;
 +
    color:#F3F7F7;
 +
    font-weight: bold !important;
 +
    padding-top:30px;
 +
    padding-bottom:10px
 +
}
 +
 +
.content-image{
 +
    color:#F3F7F7 !important;
 +
    font-size:11pt !important;
 +
    padding-top:10px;
 +
    padding-bottom:50px;
 +
    width:50vw;
 +
    margin:auto;
 +
    padding-left:60px;
 +
}
 +
 +
.appear{
 +
    display:none;
 +
   
 +
}
 +
.list{
 +
    font-size:15pt !important;
 +
    text-align:justify;
 +
    color:#F3F7F7;
 +
}
 +
.quote{
 +
    font-size:17pt !important;
 +
    text-align:justify;
 +
    color:#F3F7F7;
 +
    text-indent:2em !important;
 +
   
 +
}
 +
 +
 +
/*image*/
 +
.web{
 +
    position:fixed !important;
 +
    left:0%;
 +
    bottom:0%;
 +
    display:block;
 +
    margin: auto;
 +
}
 +
.right{
 +
    position:fixed !important;
 +
    bottom:-15px;
 +
    right:0vw;
 +
    margin: auto;
 +
}
 +
 +
 +
 +
 +
.img-position{
 +
    position:absolute;
 +
    z-index:-1;
 +
}
 +
.box{
 +
    width:auto;
 +
    padding-top:20px;
 +
    padding-bottom:20px;
 +
}
 +
.picture{
 +
    position:relative;
 +
    left:8vw;
 +
    width:80%;
 +
    padding-bottom:10px;
 +
}
 +
 +
.picture-1{
 +
    position:relative;
 +
    left:17vw;
 +
    width:50%;
 +
    padding-bottom:10px;
 +
}
 +
 +
</style>
 +
</head>
 +
<body>
 +
<nav id="scroll">
 +
    <div class="wrapper">
 +
     
 +
  <div class="nodes">
 +
            <div class="line">
 +
                <div class="blue">
 +
                    <div class="red-container">
 +
                        <div class="red"></div>
 +
                    </div>
 +
                </div>
 +
          </div>
 +
 
 +
          <div class="node">
 +
          <div class="topic"><p class="text_color">The Problem & Solution</p></div>
 +
            <div class="active-circle">
 +
              <div class="splash"></div>
 +
              <div class="cover">   
 +
              </div>
 +
            </div>
 +
            <div class="inactive-circle">
 +
              <div class="small-cover">
 +
              </div>
 +
            </div>
 +
          </div>
 +
 
 +
          <div class="node">
 +
          <div class="topic"><p class="text_color">Overview</p></div>
 +
            <div class="active-circle">
 +
              <div class="splash"></div>
 +
              <div class="cover">   
 +
              </div>
 +
            </div>
 +
            <div class="inactive-circle">
 +
              <div class="small-cover">
 +
              </div>
 +
            </div>
 +
          </div>
 +
 
 +
         
 +
          <div class="node">
 +
          <div class="topic"><p class="text_color">Improvement of Previoius BioBrick</p></div>
 +
            <div class="active-circle">
 +
              <div class="splash"></div>
 +
              <div class="cover">   
 +
              </div>
 +
            </div>
 +
            <div class="inactive-circle">
 +
              <div class="small-cover">
 +
              </div>
 +
            </div>
 +
          </div> 
 +
           
 +
    </nav>
 +
 +
 +
<h1>
 +
<!--圖片-->
 +
  <div class="img-container">
 +
        <img src="https://static.igem.org/mediawiki/2017/6/60/Silverjptcfsh.jpeg" class="main-img" width="100%">
 +
  </div>
 +
 +
 +
<!--wiki content-->
 +
<section class="content_container">
 +
  <div>
 +
    <p class="title">The Problem & Solution<p>
 +
    <p class="content">Effective pest control has long been a pivotal issue in modern agriculture. With the escalating growth of world population and the change in diet, high levels of agricultural production are required to meet the demand for food production. To date, a vast majority of farmers uses chemical pesticide to kill the pest worldwide<sup>[1]</sup>, it is by far the most convenient and effective way of pesticide control. However, the increased production chemical pesticides brought entails multiple negative costs that are usually overlooked, sacrificing human health and the environment. Thus, problems of chemical pesticide involving food safety, farmers’ health, soil & water pollution, and the existence of drug-resistant insects are looming. An alternative solution of pest control is urgently needed, necessitating the nascence of our project.</p>
 +
   
 +
 +
   
 +
    <p class="title">Overview</p>
 +
    <p class="content">We designed a nature-inspired system to offer farmers a safe, environmentally-friendly, accurate, and automatic style of farming. Inspired by the spiders using web and venom to achieve the predation, the system also contains two concept-resembling parts—“Device and PANTIDE.” As engineering, internet of things (IoT), and synthetic biology collide, the transference of knowledge to state-of-the-art system helps farmers no longer need to do laborious farm works and spray hazardous chemical poisons. It is a revolutionary system that not only guarantees the safety of the farmers and customers worldwide but also safeguards the sustainability of the environment and ecosystem. (see <a href="https://2016.igem.org/Team:NCTU_Formosa/Design" style="color:#44E287;">Design</a> & <a href="https://2016.igem.org/Team:NCTU_Formosa/Demonstrate" style="color:#44E287;">Device</a>)</p>
 +
 +
 +
    <p class="title">Improvement of Previous BioBrick</p>
 +
    <p class="content">This year, we have designed fusion proteins of spider toxin in conjunction with snowdrop lectin by the three-alanine linker. Through the reference searching, we found that the previous research all used the three-alanine linker. In the experiment, we hypothesized that an elongated linker would enhance the function of the fusion protein for the original linker is too short for the proper folding of the two domains. So we went to the linker library in iGEM part registry website to search for a longer linker. At first, we planned to use the Flexible Peptide GS Linker(<a href="http://parts.igem.org/Part:BBa_K416001" style="color:#44E287;">BBa_K416001</a>) from 2010 NYU iGEM team. However, we found no result in the previous history using this linker. Therefore, we modified the sequence and added three more amino acids into the linker in case it was still too short for proper protein folding. In the experiment(See the <a href="https://2016.igem.org/Team:NCTU_Formosa/Proof#GS_Linker" style="color:#44E287;">Link</a>), the fusion protein with the elongated GS linker did show the enhanced repellent effect. Observed from the phenomenon, we did prove the enhanced function of the fusion proteins, so we speculate that the fusion protein has a better secondary structure than the original ones. As a result, we have submitted a basic part for the improved elongated GS linker.(See the <a href="http://parts.igem.org/wiki/index.php?title=Part:BBa_K1974030" style="color:#44E287;">Link</a>)</p>
 +
  </div>
 +
</section>
 +
</h1>
 +
 +
<!--JS-->
 +
 +
<script>
 +
 +
var $document = $( document.body );
 +
var $revealBar = $( '.red-container' );
 +
var wrapperHeight = $document.height();
 +
var stepDistance = 101;
 +
var documentHeight = window.innerHeight;
 +
var positions = [];
 +
var heights = [];
 +
var elements = $( '.title' );
 +
 +
// Cache heights and positions
 +
for( var i = 0; i < elements.length; i++ ) {
 +
  var $element = $(elements[i]);
 +
  var height = $element.offset().top + documentHeight;
 +
  if (height > wrapperHeight) {
 +
    height = wrapperHeight;
 +
  }
 +
  positions.push(height);
 +
  heights.push($element.height());
 +
}
 +
 +
var $nodes =  $( '.node' );
 +
 +
// Should totally be debounced /w animation frame. I know,
 +
// this whole thing is slightly inefficient.
 +
// And magic numbers too!
 +
$( document ).scroll( function() {
 +
 +
  nodeTop = $document.scrollTop() + documentHeight + 1;
 +
  var current = 0;
 +
 
 +
  // Active/non active states
 +
  for( var i = 0; i < positions.length; i++ ) {
 +
    if(nodeTop >= positions[i]-80) {
 +
      current = i;
 +
      $nodes.eq( i ).addClass( 'active' );
 +
    } else {
 +
      $nodes.eq( i ).removeClass( 'active' );
 +
    }
 +
  }
 +
 
 +
 
 +
  if ( current < elements.length ) {
 +
    var nextStep = (nodeTop - positions[current]) / (positions[current + 1] - positions[current]);
 +
    var totalWidth = ( current * stepDistance ) + (nextStep * stepDistance);
 +
$revealBar.height( totalWidth+25 );
 +
  }
 +
 +
})
 +
 +
// Clicking the nodes... again, nothing special ;)
 +
$nodes.each( function( index ) {
 +
  var $node = $( this );
 +
  $node.click( function() {
 +
    $('html, body').animate({ scrollTop: (positions[ index ]-documentHeight)-70}, 1000 );
 +
  });
 +
})
 +
//scroll_relocate
 +
function sticky_relocate() {
 +
    var window_top = $(window).scrollTop();
 +
    var div_top = $('.main-img').offset().top;;
 +
    if (window_top > div_top+500) {
 +
        $('#scroll').removeClass('appear');
 +
    } else {
 +
        $('#scroll').addClass('appear');
 +
    };
 +
    if(window_top > div_top+500) {
 +
        $('#web').fadeIn(200);
 +
        $('#right').fadeIn(200);
 +
    } else {
 +
        $('#web').fadeOut(200);
 +
        $('#right').fadeOut(200);
 +
    }
 +
}
 +
 +
$(function () {
 +
    $(window).scroll(sticky_relocate);
 +
    sticky_relocate();
 +
});
 +
 +
 +
 +
$(document).ready(function(
 +
 +
){})
 +
 +
</script>
 +
</body>-->
 
</html>
 
</html>
 +
{{TCFSH_Taiwan_footer}}

Revision as of 08:27, 26 October 2017

HOME
TEAM
PROJECT
Description
Design
Experiments
Notebook
InterLab
Contribution
Model
Results
Demonstrate
Improve
Attributions
PARTS
Parts
Basic Parts
Composite Parts
Part Collection
SAFETY
HUMAN PRACTICES
Silver HP
Integrated and Gold
Public Engagement
AWARDS
Applied Design
Entrepreneurship
Hardware
Measurement
Model
Plant
Software
JUDGING FORM

The Problem & Solution

Effective pest control has long been a pivotal issue in modern agriculture. With the escalating growth of world population and the change in diet, high levels of agricultural production are required to meet the demand for food production. To date, a vast majority of farmers uses chemical pesticide to kill the pest worldwide[1], it is by far the most convenient and effective way of pesticide control. However, the increased production chemical pesticides brought entails multiple negative costs that are usually overlooked, sacrificing human health and the environment. Thus, problems of chemical pesticide involving food safety, farmers’ health, soil & water pollution, and the existence of drug-resistant insects are looming. An alternative solution of pest control is urgently needed, necessitating the nascence of our project.

Overview

We designed a nature-inspired system to offer farmers a safe, environmentally-friendly, accurate, and automatic style of farming. Inspired by the spiders using web and venom to achieve the predation, the system also contains two concept-resembling parts—“Device and PANTIDE.” As engineering, internet of things (IoT), and synthetic biology collide, the transference of knowledge to state-of-the-art system helps farmers no longer need to do laborious farm works and spray hazardous chemical poisons. It is a revolutionary system that not only guarantees the safety of the farmers and customers worldwide but also safeguards the sustainability of the environment and ecosystem. (see Design & Device)

Improvement of Previous BioBrick

This year, we have designed fusion proteins of spider toxin in conjunction with snowdrop lectin by the three-alanine linker. Through the reference searching, we found that the previous research all used the three-alanine linker. In the experiment, we hypothesized that an elongated linker would enhance the function of the fusion protein for the original linker is too short for the proper folding of the two domains. So we went to the linker library in iGEM part registry website to search for a longer linker. At first, we planned to use the Flexible Peptide GS Linker(BBa_K416001) from 2010 NYU iGEM team. However, we found no result in the previous history using this linker. Therefore, we modified the sequence and added three more amino acids into the linker in case it was still too short for proper protein folding. In the experiment(See the Link), the fusion protein with the elongated GS linker did show the enhanced repellent effect. Observed from the phenomenon, we did prove the enhanced function of the fusion proteins, so we speculate that the fusion protein has a better secondary structure than the original ones. As a result, we have submitted a basic part for the improved elongated GS linker.(See the Link)

-->