Difference between revisions of "Team:HZAU-China/Demonstrate"

Line 1: Line 1:
 
{{HZAU-China}}
 
{{HZAU-China}}
−
<html>
 
 
<html lang="en">
 
<html lang="en">
 
<head>
 
<head>
 
     <meta charset="UTF-8">
 
     <meta charset="UTF-8">
−
     <title>body</title>
+
     <title>design</title>
 
     <style>
 
     <style>
 
         *{margin: 0;padding: 0;}
 
         *{margin: 0;padding: 0;}
Line 28: Line 27:
 
             background-color: white;
 
             background-color: white;
 
         }
 
         }
−
              .content_part{
+
        .content_part{
 
             width: 20%;
 
             width: 20%;
 
             height: auto;
 
             height: auto;
Line 39: Line 38:
 
             text-decoration: none;
 
             text-decoration: none;
 
             color: white;
 
             color: white;
−
             font-weight: bold;
+
             font-family: Arial;
−
             font-size: 20px;
+
             font-size: 16px;
 
             display: block;
 
             display: block;
 
             padding-left: 10% ;
 
             padding-left: 10% ;
Line 81: Line 80:
 
         .my_submenu a{
 
         .my_submenu a{
 
             display: block;
 
             display: block;
−
            padding-left: 10%;
 
 
             background-image: linear-gradient(white, #efefef);
 
             background-image: linear-gradient(white, #efefef);
 
             text-decoration: none;
 
             text-decoration: none;
 
             background-color:white;
 
             background-color:white;
−
             font-size: 20px;
+
            padding: 5px;
−
             color: #4b4a5e;
+
             font-size: 14px;
 +
            font-family: Arial;
 +
             color: #3d42e8;
 
         }
 
         }
 
         .menutitle:hover {
 
         .menutitle:hover {
Line 134: Line 134:
 
             font-family: Calibri;
 
             font-family: Calibri;
 
             color: #0f9ad6;
 
             color: #0f9ad6;
 +
        }
 +
        .article h5{
 +
            display: block;
 +
            padding-top: 16px;
 +
            background-color: white;
 +
            font-size:18px;
 +
            font-family: Arial;
 +
            color:#3c7ab1;
 
         }
 
         }
 
         .article img{
 
         .article img{
Line 167: Line 175:
 
             z-index: 100;
 
             z-index: 100;
 
         }
 
         }
 +
 +
 
     </style>
 
     </style>
  
−
    <script type="text/javascript"
 
−
            src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
 
−
    </script>
 
  
 
     <script type="text/javascript">
 
     <script type="text/javascript">
Line 196: Line 203:
 
         }
 
         }
 
     </script>
 
     </script>
 +
 +
 +
 
</head>
 
</head>
  
Line 203: Line 213:
  
 
     <div class="content_part" id="masterdiv">
 
     <div class="content_part" id="masterdiv">
−
         <a href="#A1">motility dynamic model</a>
+
         <a href="#A1">Overall Design</a>
 
         <div class="menutitle" onclick="SwitchMenu('sub1')">
 
         <div class="menutitle" onclick="SwitchMenu('sub1')">
−
            <div class="little"></div>
 
 
         </div>
 
         </div>
−
        <ul class="my_submenu" id="sub1" style="display: block">
 
−
            <li><a href="#A11">Optogenetics</a></li>
 
−
            <li><a href="#A12">Motility</a></li>
 
−
            <li><a href="#A13">Riboswitch</a></li>
 
−
            <li><a href="#A14">Gene knockout</a></li>
 
−
        </ul>
 
  
−
         <a href="#A2">Multiply model</a>
+
         <a href="#A2">Design on genetic circuit</a>
 
         <div class="menutitle" onclick="SwitchMenu('sub2')">
 
         <div class="menutitle" onclick="SwitchMenu('sub2')">
 
             <div class="little"></div>
 
             <div class="little"></div>
 
         </div>
 
         </div>
 
         <ul class="my_submenu" id="sub2" style="display: block">
 
         <ul class="my_submenu" id="sub2" style="display: block">
−
             <li><a href="#A21">models</a></li>
+
             <li><a href="#A21">2.1 Light sensing part</a></li>
−
             <li><a href="#A22">Software</a></li>
+
             <li><a href="#A22">2.2 Bacterial motility</a></li>
−
             <li><a href="#A23">Hardware</a></li>
+
             <li><a href="#A23">2.3 Chassis integration</a></li>
 +
            <li><a href="#A24">2.4 Riboswitch</a></li>
 
         </ul>
 
         </ul>
  
−
         <a href="#A3">Human Practice</a>
+
         <a href="#A3">Software</a>
 
         <div class="menutitle" onclick="SwitchMenu('sub3')" >
 
         <div class="menutitle" onclick="SwitchMenu('sub3')" >
−
            <div class="little"></div>
 
 
         </div>
 
         </div>
  
−
 
+
         <a href="#A4"> Hardware</a>
−
         <a href="#A4">Art Designer</a>
+
 
         <div class="menutitle" onclick="SwitchMenu('sub4')">
 
         <div class="menutitle" onclick="SwitchMenu('sub4')">
−
            <div class="little"></div>
 
 
         </div>
 
         </div>
  
  
−
         <a href="#A5">Acknowledgement</a>
+
         <a href="#A5">Reference：</a>
 
         <div class="menutitle" onclick="SwitchMenu('sub5')">
 
         <div class="menutitle" onclick="SwitchMenu('sub5')">
−
            <div class="little"></div>
 
 
         </div>
 
         </div>
 +
  
 
     </div>
 
     </div>
Line 251: Line 252:
  
 
         <div class="article">
 
         <div class="article">
−
              
+
             <h2>Demonstration</h2>
−
    </div>
+
            <p>After proving the validation of our biological devices, to fulfill our feasibility of establishing the AR system for bacteria, we constructed an industrial level device which can create a virtual environment overlapping with the reality, a LB plate. It can mislead the bacteria to form an heterogeneous pattern on the homogeneous swarming plate.
−
</div>
+
                To know more information about our device please watch the video.</p>
  
−
</body>
 
  
 +
            <h5>Highlights:</h5>
 +
            <p>1.Huge bulk</p>
 +
            <p>2.Sterilizing function</p>
 +
            <p>3.Real-time picture capturing</p>
 +
            <p>4.Precise light projecting</p>
 +
            <p>5.Temperature controlling and measuring</p>
 +
            <p>6.Real-time communication between computer and bacteria</p><br/>
  
  
 +
            <p>We shot a video for showing the device work in our real world!</p>
 +
            <video src="#" controls="controls"></video>
 +
        </div>
 +
 +
    </div>
 +
 +
</div>
 +
</body>
  
 
</html>
 
</html>

Revision as of 15:53, 18 October 2016

design
Overall Design
Design on genetic circuit
Software
Hardware
Reference：

Demonstration

After proving the validation of our biological devices, to fulfill our feasibility of establishing the AR system for bacteria, we constructed an industrial level device which can create a virtual environment overlapping with the reality, a LB plate. It can mislead the bacteria to form an heterogeneous pattern on the homogeneous swarming plate. To know more information about our device please watch the video.

Highlights:

1.Huge bulk

2.Sterilizing function

3.Real-time picture capturing

4.Precise light projecting

5.Temperature controlling and measuring

6.Real-time communication between computer and bacteria


We shot a video for showing the device work in our real world!