Difference between revisions of "Team:HFUT-China"

 
(7 intermediate revisions by the same user not shown)
Line 1: Line 1:
−
 
 
<html lang="en">
 
<html lang="en">
  
Line 46: Line 45:
 
         padding: 0px;
 
         padding: 0px;
 
     }
 
     }
−
     #bodyContent {
+
     #bodyContent, #mw-content-text {
 
         width: 100%;
 
         width: 100%;
 
         height: 100%;
 
         height: 100%;
 +
line-height:normal;
 
     }
 
     }
−
      
+
     /*
 
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5, #bodyContent h6 {
 
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5, #bodyContent h6 {
 
border-bottom: none;
 
border-bottom: none;
Line 66: Line 66:
 
#bodyContent a {
 
#bodyContent a {
 
font-size: 100%;
 
font-size: 100%;
−
}
+
}*/
 
     </style>
 
     </style>
 
</head>
 
</head>
Line 81: Line 81:
 
                     </a>
 
                     </a>
 
                 </li>
 
                 </li>
−
                 <li class="gh-tab"><a href="#" class="gh-tab-link">Software</a></li>
+
                 <li class="gh-tab"><a href="https://2015.igem.org/Team:HFUT-China/Software" class="gh-tab-link">Software</a></li>
−
                 <li class="gh-tab"><a href="#" class="gh-tab-link">Design</a></li>
+
                 <li class="gh-tab"><a href="https://2015.igem.org/Team:HFUT-China/Design" class="gh-tab-link">Design</a></li>
 
                 <li class="gh-tab"><a href="https://2015.igem.org/Team:HFUT-China/Description" class="gh-tab-link">Description</a></li>
 
                 <li class="gh-tab"><a href="https://2015.igem.org/Team:HFUT-China/Description" class="gh-tab-link">Description</a></li>
−
                 <li class="gh-tab"><a href="#" class="gh-tab-link">Documents</a></li>
+
                 <li class="gh-tab"><a href="https://2015.igem.org/Team:HFUT-China/Documents" class="gh-tab-link">Documents</a></li>
 
                 <li class="gh-tab"><a href="https://2015.igem.org/Team:HFUT-China/Practices" class="gh-tab-link">Human Practices</a></li>
 
                 <li class="gh-tab"><a href="https://2015.igem.org/Team:HFUT-China/Practices" class="gh-tab-link">Human Practices</a></li>
 
                 <li class="gh-tab"><a href="https://2015.igem.org/Team:HFUT-China/Collaborations" class="gh-tab-link">Collaborations</a></li>
 
                 <li class="gh-tab"><a href="https://2015.igem.org/Team:HFUT-China/Collaborations" class="gh-tab-link">Collaborations</a></li>
Line 97: Line 97:
 
     <div class="container main">
 
     <div class="container main">
 
         <section class="intro brief">
 
         <section class="intro brief">
−
             <figure class="title-logo"></figure>
+
             <figure class="logo-back"></figure>
−
             <div class="title">BioDesigner</div>
+
             <div class="b-title">
−
            <div class="slogn">All you want, right here</div>
+
                 <div class="title">BioDesigner</div>
−
            <div class="presentation box inline-box">
+
                 <div class="slogn">All you want, right here</div>
−
                 <div class="left-trigger">
+
−
                    <button id="left"></button>
+
−
                </div>
+
−
                 <div class="big-img">
+
−
                    <figure class="project">
+
−
                    </figure>
+
−
                </div>
+
−
                <div class="right-trigger">
+
−
                    <button id="right"></button>
+
−
                </div>
+
 
             </div>
 
             </div>
 
         </section>
 
         </section>
Line 116: Line 106:
 
             <div class="desc jumbotron">
 
             <div class="desc jumbotron">
 
                 <div class="desc-title">What is BioDesigner</div>
 
                 <div class="desc-title">What is BioDesigner</div>
−
                 <p class="desc-words">BioDesigner is a smart assistant tool for Synthetic Biology design. Helping Synthetic Biologist make more creative products is BioDesigner's final purpose. With this idea, BioDesigner presents all valuable informations to the user. Also by improving the BioBrick searching process and providing practical BioBrick during the design process, BioDesigner leads Synthetic Biology design to a new level. </p>
+
                 <p class="desc-words">BioDesigner is a smart assistant tool for Synthetic Biology design. Helping Synthetic Biologists to make creative products is BioDesigner's purpose. With this idea, BioDesigner presents all valuable information to users. Also by improving BioBricks’ searching process, recommending practical BioBricks during the design process, and simulating Biobricks’ reaction process, BioDesigner leads Synthetic Biology design to a new level.</p>
 
             </div>
 
             </div>
 
             <div class="img-logo">
 
             <div class="img-logo">
Line 130: Line 120:
 
                 <div class="func-title">Search</div>
 
                 <div class="func-title">Search</div>
 
                 <div class="func-subtitle">Search BioBricks, but more than BioBricks</div>
 
                 <div class="func-subtitle">Search BioBricks, but more than BioBricks</div>
−
                 <p class="func-words">Searching for a part is the most fundamental step in Synthetic Biolody. With BioDesigner's powerful search tool, you can search parts by typing what you what, and the costum-built result will be presented to you. But what BioDesigner can do is more than that. Lots of valuable information will also be presented to the user, like some basic information, and most important one, is a parts' related papers. By collecting lots of information together, user can get more than BioBricks.</p>
+
                 <p class="func-words">Searching for a part is the most fundamental step in Synthetic Biology. With BioDesigner's powerful search tool, users can search parts by typing what they want, and the custom-built result will be presented to them. Besides, what BioDesigner can do is more than that. Lots of valuable information will also be presented to users, like basic information, especially parts quality evaluation score, as well as parts' related papers. By integrating lots of information together, users can get more than a BioBrick.</p>
 
             </div>
 
             </div>
 
         </section>
 
         </section>
Line 141: Line 131:
 
                 <div class="func-title">Recommendation</div>
 
                 <div class="func-title">Recommendation</div>
 
                 <div class="func-subtitle">Select in selection, not Search in ocean</div>
 
                 <div class="func-subtitle">Select in selection, not Search in ocean</div>
−
                 <p class="func-words">The decision of a part is always a pain point to every Synthetic Biology researcher. BioDesigner is the assistant which can help users make that decision. By analyzing users' design with lots of datas, BioDesigner can provide useful parts as a recommendation to the user. Also, by lots of data analyze of part's function, the recommendation will adjust to your design. BioDesigner can also show you relations between different proteins and genes. With lots of hard working, by providing all those valuable informations, the decision of part won't be that hard.</p>
+
                 <p class="func-words">Selecting a part from tons of candidates is always a pain point to every Synthetic Biology researcher. BioDesigner is the assistant that can simplify this task. Based on users' current design, BioDesigner can narrow down the scope and provide useful parts as a recommendation to users. Also, by analyzing part's function, the recommendation will adjust to users’ design according to users’ specific function need. BioDesigner can also providing system level recommendation by showing users the relations between various proteins and genes. With BioDesigner’s fantastic recommendation function, selecting a part won't be that hard.</p>
 
             </div>
 
             </div>
 
         </section>
 
         </section>
Line 149: Line 139:
 
                 </svg>
 
                 </svg>
 
             </div>
 
             </div>
−
             <div class="func-desc jumbotron">
+
             <div class="simu-desc jumbotron">
−
                 <div class="func-title">Simulation</div>
+
                 <div class="simu-title">Simulation</div>
−
                 <div class="func-subtitle">Tell how it works, before you do your works</div>
+
                 <div class="simu-subtitle">Tell how it works, before you do your works</div>
−
                 <p class="func-words">Traditionally, the test of a Synthetic Biology design is by doing lots of experiments, which can be a extremely time-consuming process. By using SSA algorithm, BioDesigner can show a glance of how the design will performed to the user. With BioDesigner's interactive simulator, user can check amount of a certain compound at any time, or during any time period.</p>
+
                 <p class="simu-words">Traditionally, testing a Synthetic Biology design is done by lots of biological experiments, which can be an extremely time-consuming process. By using SSA algorithm, BioDesigner can show users a glance of how the design will perform. With BioDesigner's interactive simulator, user can check the amount of a certain compound at any time, or during any time period.</p>
 
             </div>
 
             </div>
 
         </section>
 
         </section>
Line 236: Line 226:
 
             fill: "none",
 
             fill: "none",
 
             strokeWidth: "1",
 
             strokeWidth: "1",
−
             stroke: "#000",
+
             stroke: "#002FA7",
 
             strokeMiterLimit: "10",
 
             strokeMiterLimit: "10",
 
             strokeDasharray: "9 9",
 
             strokeDasharray: "9 9",
Line 244: Line 234:
 
         var len1 = path1.getTotalLength();
 
         var len1 = path1.getTotalLength();
 
         path1.attr({
 
         path1.attr({
−
             stroke: '#000',
+
             stroke: '#002FA7',
 
             strokeWidth: 1,
 
             strokeWidth: 1,
−
             fill: '#E6E6E6',
+
             fill: 'none',
 
             // Draw Path
 
             // Draw Path
 
             "stroke-dasharray": len1 + " " + len1,
 
             "stroke-dasharray": len1 + " " + len1,
Line 361: Line 351:
 
         var linex = ss.path('M395.667,349.333L416.501,357.666L395.5,366.625L395.5,359.5L73,359.5').attr({
 
         var linex = ss.path('M395.667,349.333L416.501,357.666L395.5,366.625L395.5,359.5L73,359.5').attr({
 
             fill: 'none',
 
             fill: 'none',
−
             stroke: '#FFFFFF',
+
             stroke: '#000000',
 
             strokeWidth: 5,
 
             strokeWidth: 5,
 
             'stroke-linecap': 'round',
 
             'stroke-linecap': 'round',
Line 371: Line 361:
 
         var liney = ss.path('M119.417,164.417L110.959,144.041L102.5,166.5L109.5,166.5L109.5,394').attr({
 
         var liney = ss.path('M119.417,164.417L110.959,144.041L102.5,166.5L109.5,166.5L109.5,394').attr({
 
             fill: 'none',
 
             fill: 'none',
−
             stroke: '#FFFFFF',
+
             stroke: '#000000',
 
             'stroke-width': 5,
 
             'stroke-width': 5,
 
             'stroke-linecap': 'round',
 
             'stroke-linecap': 'round',
Line 413: Line 403:
  
 
         linex.attr({
 
         linex.attr({
−
             stroke: '#fff',
+
             stroke: '#000',
 
             strokeWidth: 5,
 
             strokeWidth: 5,
  
Line 425: Line 415:
 
         });
 
         });
 
         liney.attr({
 
         liney.attr({
−
             stroke: '#fff',
+
             stroke: '#000',
 
             strokeWidth: 5,
 
             strokeWidth: 5,
  

Latest revision as of 00:36, 19 September 2015

HFUT-China

BioDesigner
All you want, right here
What is BioDesigner

BioDesigner is a smart assistant tool for Synthetic Biology design. Helping Synthetic Biologists to make creative products is BioDesigner's purpose. With this idea, BioDesigner presents all valuable information to users. Also by improving BioBricks’ searching process, recommending practical BioBricks during the design process, and simulating Biobricks’ reaction process, BioDesigner leads Synthetic Biology design to a new level.

Search
Search BioBricks, but more than BioBricks

Searching for a part is the most fundamental step in Synthetic Biology. With BioDesigner's powerful search tool, users can search parts by typing what they want, and the custom-built result will be presented to them. Besides, what BioDesigner can do is more than that. Lots of valuable information will also be presented to users, like basic information, especially parts quality evaluation score, as well as parts' related papers. By integrating lots of information together, users can get more than a BioBrick.

Recommendation
Select in selection, not Search in ocean

Selecting a part from tons of candidates is always a pain point to every Synthetic Biology researcher. BioDesigner is the assistant that can simplify this task. Based on users' current design, BioDesigner can narrow down the scope and provide useful parts as a recommendation to users. Also, by analyzing part's function, the recommendation will adjust to users’ design according to users’ specific function need. BioDesigner can also providing system level recommendation by showing users the relations between various proteins and genes. With BioDesigner’s fantastic recommendation function, selecting a part won't be that hard.

Simulation
Tell how it works, before you do your works

Traditionally, testing a Synthetic Biology design is done by lots of biological experiments, which can be an extremely time-consuming process. By using SSA algorithm, BioDesigner can show users a glance of how the design will perform. With BioDesigner's interactive simulator, user can check the amount of a certain compound at any time, or during any time period.