Difference between revisions of "Team:NCKU Tainan"

 
(233 intermediate revisions by 3 users not shown)
Line 1: Line 1:
−
{{NCKU_Tainan/Header}}
+
{{NCKU_Tainan/Header}} {{NCKU_Tainan/animate_css}}
 
<html>
 
<html>
 +
 +
<head>
 +
  <script src="https://2017.igem.org/wiki/index.php?title=Team:NCKU_Tainan/jquery_min_js&action=raw&ctype=text/javascript"></script>
 +
  <script src="https://2017.igem.org/wiki/index.php?title=Team:NCKU_Tainan/jquery_waypoint_js&action=raw&ctype=text/javascript"></script>
 +
 +
</head>
 
<style>
 
<style>
−
.vertical-container {
+
  .full {
−
   background-attachment: fixed;
+
    width: 100%;
−
}
+
    height: auto;
−
.logo{
+
  }
−
  position:absolute;
+
  #paragraph .imagerow p {
−
  width: 475px;
+
    font-size: 20px;
−
  height: 475px;
+
  }
−
  border-radius: 300px;
+
  #paragraph a:hover {
−
  text-align:center;
+
    text-decoration: none;
−
  z-index:100;
+
   }
−
}
+
 
−
.logo img{
+
  .imagerow {
−
  width: 100%;
+
    background-color: #fbfbfb;
−
   height:100%;
+
  }
−
}
+
 
 +
  .logo {
 +
    position: absolute;
 +
    width: 475px;
 +
    height: 475px;
 +
    border-radius: 300px;
 +
    text-align: center;
 +
    z-index: 100;
 +
  }
 +
 
 +
  @media only screen and (max-width: 768px) {
 +
    .logo {
 +
      width: 150px;
 +
      height: 150px;
 +
    }
 +
   }
 +
 
 +
  .logo img {   
 +
    height: 100%;
 +
    width:auto;
 +
 
 +
  }
  
−
#video-background {
+
  #video-background {
−
     position:absolute;
+
     position: absolute;
−
      
+
     width: 100%;
 
     z-index: 1;
 
     z-index: 1;
 
   }
 
   }
  
 +
  #video-boat {
 +
    position: relative;
 +
    width: 80%;
 +
    z-index: 1;
 +
    margin-left: 10%;
 +
    margin-right: 10%;
 +
  }
 +
 +
  #div-left {
 +
    width: 50%;
 +
    height: 100%;
 +
    margin-left: auto;
 +
    margin-right: auto;
 +
    background-color: #fbfbfb;
 +
    padding-right: 50px;
 +
  }
 +
 +
  #div-left p {
 +
    text-align: right !important;
 +
    font-weight: 500 !important;
 +
    right: 10px;
 +
    margin-top: 15px;
 +
  }
 +
 +
  #div-left h1 {
 +
    color: #93edd4;
 +
    text-align: right !important;
 +
    right: 10px;
 +
  }
 +
 +
  #div-right {
 +
    width: 50%;
 +
    height: 100%;
 +
    margin-left: auto;
 +
    margin-right: auto;
 +
    background-color: #fbfbfb;
 +
    padding-left: 50px;
 +
  }
 +
 +
  #div-right p {
 +
    text-align: left !important;
 +
    font-weight: 500 !important;
 +
    padding-left: 0 !important;
 +
    margin-top: 15px;
 +
  }
 +
 +
  #div-right h1 {
 +
    color: #93edd4;
 +
    text-align: left !important;
 +
  }
 +
 +
  @media only screen and (max-width: 768px) {
 +
    #div-left {
 +
      width: 100%;
 +
    }
 +
 +
    #div-right {
 +
      width: 100%;
 +
    }
 +
  }
 +
 +
  .rightborder {
 +
    position: absolute;
 +
    width: 10px;
 +
    height: 30%;
 +
    border-right: 4px solid #f9cb8f;
 +
    right: 0;
 +
    top: 30%;
 +
    display: block;
 +
  }
 +
 +
  .leftborder {
 +
    position: absolute;
 +
    width: 10px;
 +
    height: 30%;
 +
    border-right: 4px solid #f9cb8f;
 +
    left: 0;
 +
    top: 30%;
 +
    display: block;
 +
  }
 +
 +
  @media only screen and (max-width: 990px) {
 +
    .rightborder {
 +
      display: none;
 +
    }
 +
    .leftborder {
 +
      display: none;
 +
    }
 +
  }
 +
 +
  .imagerow img {
 +
    width: 100%;
 +
  }
 +
 +
  #full img {
 +
    width: 100%;
 +
  }
 +
 +
  #margintop {}
 
</style>
 
</style>
  
 +
<body>
  
−
<div class="container-fluid">
+
  <div class="container-fluid">
−
  <div class="row">
+
    <div class="row">
−
    <div class="col">
+
      <div class="col">
−
      <div id="top">
+
        <div id="top">
−
      </div>
+
        </div>
−
      <div id="category" class="vertical-container">
+
        <div id="category" class="vertical-container">
 
           <div class="logo">
 
           <div class="logo">
−
          <img src="https://static.igem.org/mediawiki/2017/d/dd/NCKU-home-logo.png" />
+
            <img src="https://static.igem.org/mediawiki/2017/1/1a/NCKU-landing_page-logo-2.png">
 
           </div>
 
           </div>
 
           <video autoplay loop id="video-background" muted plays-inline>
 
           <video autoplay loop id="video-background" muted plays-inline>
−
              <source src="https://static.igem.org/mediawiki/2017/f/ff/NCKU-home-background.mp4" type="video/mp4">
+
                <source src="https://static.igem.org/mediawiki/2017/f/ff/NCKU-home-background.mp4" type="video/mp4">
 
           </video>
 
           </video>
 +
        </div>
 
       </div>
 
       </div>
 
     </div>
 
     </div>
 
   </div>
 
   </div>
−
</div>
+
  <div class="container-fluid">
−
<div class="container-fluid">
+
    <div class="row">
−
  <div class="row">
+
      <div id="paragraph" class="paragraph col-md-12  col-xs-12" data-os-animation="fadeIn" data-os-animation-delay="0s">
−
    <div id="paragraph" class="paragraph col-md-8 col-md-offset-1 col-xs-offset-1 col-xs-10">
+
−
      <h2 id="accomplishment">
+
−
        Accomplishment
+
−
      </h2>
+
−
      <hr class="bluehr">
+
−
      <ol class="margin_bottom">
+
−
        <li>
+
−
          Built and characterized two functional and affordable prototypes for respectively sensing the concentration of Nitrate and doing regulation of it.
+
−
        </li>
+
−
        <br>
+
−
        <li>
+
−
          Created an instructional video, a manual and lists of materials.
+
−
        </li>
+
−
        <br>
+
−
        <li>
+
−
          Implemented Bio-Safety to our devices.
+
−
        </li>
+
−
        <br>
+
−
        <li>
+
−
          Integrated with modeling.
+
−
        </li>
+
−
      </ol>
+
−
      <h2 id="introduction">
+
−
        Introduction
+
−
      </h2>
+
−
      <hr class="bluehr">
+
−
      <p class="margin_bottom">
+
−
        Nitrate, one of the most important nutrition for aquatics, but too much nitrate cause eutrophication. The goal of our project is to solve an important problem for fish-farmers, manpower while controlling water quality, by IoT. Therefore, we build 2 devices,
+
−
        a sensing boat and a regulation box.
+
−
      </p>
+
−
      <h2 id="motivation">
+
−
        Motivation
+
−
      </h2>
+
−
      <hr class="bluehr">
+
−
      <p class="margin_bottom">
+
−
        After having a visit to Center of Shrimp Disease Control and Genetic Improvement, and meetups with fish-farmers, we found that there was still space for improvement in aquaculture in Taiwan. One of the important problems is the manpower needed while controlling
+
−
        water quality, and another is that the commercial device are too expensive for fish-farmers to afford.
+
−
        <br>
+
−
        <br> As a result, we build our own devices, which are able to reduce the workload for fish-farmers, to provide an affordable approach to both Nitrate sensing and regulation, and to collect immediate detailed information of the environment for
+
−
        users. We hope to turn traditional aquaculture into a whole new industry connected with hi-tech.
+
−
      </p>
+
−
      <h2 id="measuringprinciple">
+
−
          Measuring Principle
+
−
      </h2>
+
−
      <hr class="bluehr">
+
−
      <p class="margin_bottom">
+
−
        We use 450nm laser to excite our genetically modified <i>E. coli</i>. After that,<i>E. coli</i> will emit 510nm green light to our optical sensor. Then,by analyzing different fluorescence intensity. We can get accurate concentration value of nitrate
+
−
        in the water.
+
−
      </p>
+
−
      <h2 id="devicedesign">
+
−
        Device Design
+
−
      </h2>
+
−
      <hr class="bluehr">
+
  
−
      <h3>
 
−
        Sensing Boat
 
−
      </h3>
 
−
      <p>
 
−
        The structure of sensing device contains 4 parts.
 
−
      </p>
 
−
      <div class="row imagerow">
 
−
        <div class="col-md-12">
 
−
          <img src="https://static.igem.org/mediawiki/2017/4/49/NCKU-hardware-1.png" class="img-responsive">
 
−
        </div>
 
−
      </div>
 
−
      <ol>
 
−
        <li>Sample Collection</li>
 
−
        <p>
 
−
          <br> We constructed a multiple sensing boat to collect fundamental infomation of water in the fish pond. It’s a woody boat with three sensors and two solenoid valve. Firstly the water will enter the boat and flow through two solenoid valves.
 
−
          With the specific controlling, we can gather quantitative water for nitrate sensing. Then,the sample of water will react with our E.coli in a tube fixed in a light absorber.
 
−
        </p>
 
−
        <li>Detection</li>
 
−
        <p>
 
−
          <br> Nitrate, one of the most important nutrition for aquatics, but too much nitrate cause eutrophication. The goal of our project is to solve an important problem for fish-farmers, manpower while controlling water quality, by IoT. Therefore,
 
−
          we build 2 devices, a sensing boat and a regulation box.
 
−
        </p>
 
 
         <div class="row imagerow">
 
         <div class="row imagerow">
−
           <div class="col-md-12">
+
           <div id="div-left" class="col-md-6">
−
             <img src="https://static.igem.org/mediawiki/2017/d/d2/NCKU-measurement-2.png" class="img-responsive">
+
             <a href="https://2017.igem.org/Team:NCKU_Tainan/Demonstrate#sensingboat"><img src="https://static.igem.org/mediawiki/2017/f/f8/T--NCKU_Tainan--boat_transparent.gif"></a>
 +
            <div class="rightborder "></div>
 
           </div>
 
           </div>
 +
 +
          <div id="div-right" class="col-md-6 ">
 +
            <a href="https://2017.igem.org/Team:NCKU_Tainan/Demonstrate#sensingboat"><h1 style="margin-top: 20%">Sensing Boat</h1></a>
 +
            <p>
 +
              With sensors and our <i>E. coli</i>, the boat provides an accurate, immediate and automatic sampling method to nitrate sensing.
 +
            </p>
 +
 +
           
 +
 +
          </div>
 +
 
         </div>
 
         </div>
−
        <br>
+
 
−
        <li>Processing</li>
+
−
        <p>
+
−
          <br> The signal then is sent to the processor. We chose Arduino as the processor, because Arduino is an open-source prototyping platform featuring as easy-to-use hardware and software. We coded our Arduino to initialize our detection, to filter
+
−
          our input signal and to measure the result kinetically.
+
−
        </p>
+
−
        <li>Transmission</li>
+
−
        <p>
+
−
          <br> We change analog digital data to analog. Then combine all the data sensing boat got to a single string and transmit the data via 2.4G radio from boat to remoter. The remoter would send the to our sever. To send data immediately, we choose
+
−
          to use get request which is much faster than post request. And the user can use their mobile app to get the latest data. The mobile app follows the same path our boat did. It can show the data in chart or even the location of the boat.
+
−
        </p>
+
−
        <li>Verification</li>
+
−
        <p>
+
−
          <br> We collected the electrical signals from our device and the fluorescent signals from M2 in pairs. And we assumed that the increase in electrical signals is positive correlated to the increase in fluorescent signals. Since the increase in
+
−
          electrical signals did not follow a normal distribution, we use Spearman rank correlation coefficient to test their relationship.
+
−
        </p>
+
 
         <div class="row imagerow">
 
         <div class="row imagerow">
−
           <div class="col-md-12">
+
 
−
             <img src="https://static.igem.org/mediawiki/2017/2/2a/NCKU-hardware-3.png" class="img-responsive">
+
           <div id="div-right " class="col-md-6 col-md-push-6">
 +
             <div class="leftborder "></div>
 +
            <a href="https://2017.igem.org/Team:NCKU_Tainan/Demonstrate#regulationbox"><img src="https://static.igem.org/mediawiki/2017/9/93/T--NCKU_Tainan--box_transparent.gif" style="padding-left:40px"></a>
 +
          </div>
 +
          <div id="div-left" class="col-md-6 col-md-pull-6">
 +
            <div id="margintop" style="right:20px;">
 +
              <a href="https://2017.igem.org/Team:NCKU_Tainan/Demonstrate#regulationbox"><h1 style="margin-top: 20%">Regulation Box</h1></a>
 +
              <p>
 +
                <i>E. coli</i> in box is able to reduce the nitrate concentration of the pumped-
 +
                in water, achieving nitrate regulation in a biological way.
 +
              </p>
 +
            </div>
 
           </div>
 
           </div>
 
         </div>
 
         </div>
−
        <p>
 
−
          Xi=The increase in electrical signals; Yi=The increase in fluorescent signals <br> Null hypothesis: X and Y are independent <br> Alternative hypothesis: X and Y have a position correlation <br> &alpha; = 0.01 <br> r
 
−
          <sub>s</sub> = 0.5272024 <br> For N = 32 and α = 0.01, the critical value of rs is 0.412.
 
−
        </p>
 
−
        <p>
 
−
          Since rs = 0.5272024 > 0.412 , we reject null hypothesis and conclude that the increase in electrical signals and the increase in fluorescent signals have a position correlation at a significant level = 0.01.
 
−
          <br> It can prove the data which our device senses and the data which M2 senses are positive correlation.
 
−
        </p>
 
−
      </ol>
 
  
−
      <h3>
+
         <div class="row imagerow">
−
         Regulation Box
+
          <div id="div-left" class="col-md-6">
−
      </h3>
+
            <a href="https://2017.igem.org/Team:NCKU_Tainan/Software"><img src="https://static.igem.org/mediawiki/2017/0/0a/T--NCKU_Tainan--test.gif"></a>
−
      <p>
+
            <div class="rightborder "></div>
−
        The structure of regulation box contains 2 parts.
+
          </div>
−
      </p>
+
          <div id="div-right" class="col-md-6 ">
−
      <div class="row imagerow">
+
            <div id="margintop">
−
        <div class="col-md-12">
+
              <a href="https://2017.igem.org/Team:NCKU_Tainan/Software"><h1 style="margin-top: 20%">Application</h1></a>
−
          <img src="https://static.igem.org/mediawiki/2017/6/69/NCKU-hardware-4.png" class="img-responsive">
+
              <p>
 +
                Our own app sends a notice to users while nitrate concentration reaching a certain level, making aquaculture less manpower-required.</p>
 +
            </div>
 +
          </div>
 
         </div>
 
         </div>
 
       </div>
 
       </div>
−
      <ol class="margin_bottom">
 
−
        <li>Boat’s Notifying</li>
 
−
        <p>
 
−
          <br> Nitrate, is one of the most important nutrition for aquatics, but too much nitrate will cause severe problems. So, we create a purifier that can take action immediately, if our sensing boat notify us a high nitrate concentration level.
 
−
          That is our regulation box. Originally, fish farmers would change water frequently to keep nitrate concentration low enough for aquatics to live when facing nitrate excess problem. However, our regulation box will prevent this situation. First,
 
−
          sensing boat will send data to server. Then, our App can get information after data analyzed by server. Moreover, it can notify users and they can push some bottoms sending signal to regulation box.
 
−
        </p>
 
−
        <li>Processing</li>
 
−
        <p>
 
−
          <br> When receiving the signal, regulation box will start to work. To achieve our goal, purifying water, the regulation box need to consist of some elements, that is water input hole, output hole, “motor and filter system” and replaceable grooves.
 
−
          When regulation box starting to work, it pumps water into the box by motor system. Then, water flows through filter system for physical water cleaning and goes into grooves to do biological transformation. Consequently, clean water appears and
 
−
          the whole aqua system can stay healthy.
 
−
        </p>
 
−
      </ol>
 
−
      <h2 id="material">
 
−
        Materials
 
−
      </h2>
 
−
      <hr class="bluehr">
 
−
      <h3>
 
−
        Sensing Device
 
−
      </h3>
 
−
      <ul>
 
−
        <li>Arduino Mega</li>
 
−
        <li>Batteries</li>
 
−
        <li>MediaTek LinkIt One</li>
 
−
        <li>pH meter</li>
 
−
        <li>Thermometer</li>
 
−
        <li>Light Sensor</li>
 
−
        <li>Shaft</li>
 
−
        <li>Relay</li>
 
−
        <li>DC Brush Motor</li>
 
−
        <li>Servo Motor</li>
 
−
        <li>Rudder</li>
 
−
        <li>Propeller</li>
 
−
        <li>Wood</li>
 
−
        <li>Nuts and Screw</li>
 
−
        <li>Electromagnetic Valve</li>
 
−
        <li>Jump Wires</li>
 
−
        <li>Tube</li>
 
−
        <li>4.7k Resistor</li>
 
−
        <li>Clay</li>
 
−
        <li>Breadboard</li>
 
−
        <li>Seal Tape</li>
 
−
      </ul>
 
−
      <h3>
 
−
        Regulation Device
 
−
      </h3>
 
−
      <ul>
 
−
        <li>Sink</li>
 
−
        <li>Filters</li>
 
−
        <li>Motors</li>
 
−
        <li>Power Supply</li>
 
−
        <li>Grooves</li>
 
−
        <li>Tubes</li>
 
−
      </ul>
 
 
     </div>
 
     </div>
−
    <div id="sidemenu" class="col-md-2">
+
  </div>
−
      <div class="list-group">
+
  <br><br><br><br>
−
        <a onclick="scrollto('#accomplishment')" class="list-group-item">Accomplishment</a>
+
 
−
        <hr class="dry">
+
  <div class="container-fluid">
−
        <a onclick="scrollto('#introduction')" class="list-group-item">Introduction</a>
+
    <div class="row">
−
        <hr class="dry">
+
      <div class="full">
−
        <a onclick="scrollto('#motivation')" class="list-group-item">Motivation</a>
+
         <video autoplay loop id="video-background" muted plays-inline>
−
         <hr class="dry">
+
                <source src="https://static.igem.org/mediawiki/2017/8/85/T--NCKU_Tainan--all2.mp4" type="video/mp4">
−
        <a onclick="scrollto('#measuringprinciple')" class="list-group-item">Measuring Principle</a>
+
          </video>
−
        <hr class="dry">
+
−
        <a onclick="scrollto('#devicedesign')" class="list-group-item">Device Design</a>
+
−
        <hr class="dry">
+
−
        <a onclick="scrollto('#material')" class="list-group-item">Material</a>
+
−
        <hr class="dry">
+
−
        <a class="list-group-item top"><i onclick="scrollto('#top')" class="fa fa-arrow-up fa-1x dryarrow" aria-hidden="true"></i></a>
+
 
       </div>
 
       </div>
 
     </div>
 
     </div>
 
   </div>
 
   </div>
−
</div>
+
 
 +
  <body>
 +
 
 +
    <script type="text/javascript">
 +
      function onScrollInit(items, trigger) {
 +
        $(items).each(function() {
 +
          var osElement = $(this),
 +
            osAnimationClass = osElement.attr('data-os-animation'),
 +
            osAnimationDelay = osElement.attr('data-os-animation-delay');
 +
          osElement.css({
 +
            '-webkit-animation-delay': osAnimationDelay,
 +
            '-moz-animation-delay': osAnimationDelay,
 +
            'animation-delay': osAnimationDelay,
 +
          });
 +
          var osTrigger = (trigger) ? trigger : osElement;
 +
          var waypoint = new Waypoint({
 +
            element: osTrigger,
 +
            handler: function() {
 +
              osElement.addClass('animated').toggleClass(osAnimationClass);
 +
            },
 +
            triggerOnce: false,
 +
            offset: '100%'
 +
          })
 +
        });
 +
      }
 +
      $(document).ready(function() {
 +
        onScrollInit('.os-animation');
 +
        onScrollInit('.staggered-animation', '.staggered-animation-container');
 +
      });
 +
    </script>
 +
 
 
</html>
 
</html>

Latest revision as of 05:26, 4 December 2017

Sensing Boat

With sensors and our E. coli, the boat provides an accurate, immediate and automatic sampling method to nitrate sensing.

Regulation Box

E. coli in box is able to reduce the nitrate concentration of the pumped- in water, achieving nitrate regulation in a biological way.

Application

Our own app sends a notice to users while nitrate concentration reaching a certain level, making aquaculture less manpower-required.