Difference between revisions of "Team:SJTU-Software/Design"
(Prototype team page) |
Ricky chen (Talk | contribs) |
||
(One intermediate revision by the same user not shown) | |||
Line 1: | Line 1: | ||
− | + | <html class="no-js"> | |
− | < | + | <head> |
+ | <meta charset="utf-8"> | ||
+ | <meta http-equiv="X-UA-Compatible" content="IE=edge"> | ||
+ | <meta name="description" content=""> | ||
+ | <meta name="keywords" content=""> | ||
+ | <meta name="viewport" | ||
+ | content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> | ||
+ | <title>Base Wiki</title> | ||
− | < | + | <!-- Set render engine for 360 browser --> |
+ | <meta name="renderer" content="webkit"> | ||
− | < | + | <!-- No Baidu Siteapp--> |
− | + | <meta http-equiv="Cache-Control" content="no-siteapp"/> | |
− | + | ||
− | < | + | <link rel="icon" type="image/png" href="assets/i/favicon.png"> |
− | + | ||
− | + | ||
− | + | ||
− | < | + | <!-- Add to homescreen for Chrome on Android --> |
+ | <meta name="mobile-web-app-capable" content="yes"> | ||
+ | <link rel="icon" sizes="192x192" href="assets/i/app-icon72x72@2x.png"> | ||
− | < | + | <!-- Add to homescreen for Safari on iOS --> |
− | + | <meta name="apple-mobile-web-app-capable" content="yes"> | |
− | </ | + | <meta name="apple-mobile-web-app-status-bar-style" content="black"> |
+ | <meta name="apple-mobile-web-app-title" content="Amaze UI"/> | ||
+ | <link rel="apple-touch-icon-precomposed" href="assets/i/app-icon72x72@2x.png"> | ||
− | </ | + | <!-- Tile icon for Win8 (144x144 + tile color) --> |
+ | <meta name="msapplication-TileImage" content="assets/i/app-icon72x72@2x.png"> | ||
+ | <meta name="msapplication-TileColor" content="#0e90d2"> | ||
+ | <link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:SJTU-Software/amazeuiMinCss?action=raw&ctype=text/css"> | ||
+ | <link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:SJTU-Software/wikiCss?action=raw&ctype=text/css"> | ||
+ | <link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:SJTU-Software/demoCss?action=raw&ctype=text/css"> | ||
+ | <link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:SJTU-Software/mainCss?action=raw&ctype=text/css"> | ||
+ | </head> | ||
+ | <body> | ||
+ | <div class = "ccc" style = "text-align:center;padding-top:300px"> | ||
+ | <p style = "font-size:14px; font-family:helvatica; " ><b>Our software ‘Base’ have four based functions:<br/>Search,Construct,Evaluate and Upload.<br/>This document will use some specific examples<br/> to help you learn how to use our software.</b></p> | ||
+ | </div> | ||
+ | <div class = "demo"> | ||
+ | <h1>Search for device:</h1> | ||
+ | <p>When you want you use our software to search for a device,you may follow such steps:<br/> | ||
+ | Here is the search box in search page:<br/></p> | ||
+ | <img src = "https://static.igem.org/mediawiki/2015/d/d4/SJTU-SOFTWARE.demo1.png"/> | ||
+ | <p>First,enter the keyword, like “protein”<br/> | ||
+ | Then click button ‘Device’<br/> | ||
+ | Button ‘Advanced’ is used to change weight,click it and you will see this page:<br/></p> | ||
+ | <img src = "https://static.igem.org/mediawiki/2015/3/32/SJTU-SOFTWARE.demo2.png"/> | ||
+ | <p>Change weight as you like,<br/> | ||
+ | For example:<br/> | ||
+ | Set Uses to 1<br/> | ||
+ | Set Part Results to 20<br/> | ||
+ | Set Confirmed_times to 1<br/> | ||
+ | Set Number_comments to 1<br/> | ||
+ | </p> | ||
+ | <img src = "https://static.igem.org/mediawiki/2015/c/c1/SJTU-SOFTWARE.demo3.png"/> | ||
+ | <p> | ||
+ | Leave the rest as the defaults and click button ‘Sure’.<br/> | ||
+ | You will see result like this:<br/> | ||
+ | </p> | ||
+ | <img src = "https://static.igem.org/mediawiki/2015/4/49/SJTU-SOFTWARE.demo4.png"/> | ||
+ | <h1>Search for Part:</h1> | ||
+ | <p>Searching for part is a similar process<br/> | ||
+ | For example,<br/> | ||
+ | We enter keyword ”DNA”,click button ‘Part’ and change weight the same as the example of searching for device above<br/> | ||
+ | (Set Uses to 1;set Part Results to 20;set Confirmed_times to 1;set Number_comments to 1).<br/> | ||
+ | Then you will see the result as below:<br/> | ||
+ | </p> | ||
+ | <img src = "https://static.igem.org/mediawiki/2015/2/2d/SJTU-SOFTWARE.demo5.png"/> | ||
+ | <h1>Construct:<br/></h1> | ||
+ | <p>Construct page can help you design a new device intelligently. <br/> | ||
+ | Let us see a simple example:<br/> | ||
+ | Drag the icons from the left of the page and construct a simple device with a regulator,coding area,a reporter and a terminator.<br/> | ||
+ | Now you will see your device in graphical form:<br/> | ||
+ | </p> | ||
+ | <img src = "https://static.igem.org/mediawiki/2015/2/2b/SJTU-SOFTWARE.demo6.png"/> | ||
+ | <p>Click button ‘Advise’ and select biobricks for your device.You can fill in functions if you want.<br/> | ||
+ | History id will show all ID of biobricks in your device.<br/> | ||
+ | </p> | ||
+ | <img src = "https://static.igem.org/mediawiki/2015/1/12/SJTU-SOFTWARE.demo7.png"/> | ||
+ | <p>When you have finished a device, you can click "Next-Evaluate" button on the bottom right corner to evaluate this device.<br/> | ||
+ | </p> | ||
+ | <h1>Evaluate:<br/></h1> | ||
+ | <p>This page can help you evaluate a device,this device can be a existing device or a brand new device you have just designed.<br/> | ||
+ | Continuing with the example of ‘Construct’.When you have clicked button ‘Next-Evaluate’,you will jump to Evaluate page like this:<br/> | ||
+ | </p> | ||
+ | <img src = "https://static.igem.org/mediawiki/2015/f/f4/SJTU-SOFTWARE.demo9.png"/> | ||
+ | <p>You can delete any of these biobricks or insert new biobricks to change this device.<br/> | ||
+ | Of course,you can delete all and refill ID to start the evaluation of a new device.<br/> | ||
+ | Choose Accuracy on the top left of the page,then click "Evaluate"to start the evaluation.<br/> | ||
+ | After a short wait,you may get results as below:<br/> | ||
+ | </p> | ||
+ | <img src = "https://static.igem.org/mediawiki/2015/c/cf/SJTU-SOFTWARE.demo10.png"/> | ||
+ | <p>Here you can see overall score of the device and ‘Optimal ID’.<br/> | ||
+ | ‘Optimal ID’ is a list of biobricks recommended to replace original biobrick,you may choose biobricks from them to optimize this device.<br/> | ||
+ | </p> | ||
+ | <img src = "https://static.igem.org/mediawiki/2015/d/db/SJTU-SOFTWARE.demo11.png"/> | ||
+ | <p>Do not forget use button ‘Upload’ if you want to upload this device to our database. <br/> | ||
+ | </p> | ||
+ | <h1/>Upload:<br/></h1> | ||
+ | <p> | ||
+ | Upload page is very easy to use,<br/> | ||
+ | Continuing with our example,<br/> | ||
+ | </p> | ||
+ | <img src = "https://static.igem.org/mediawiki/2015/c/c5/SJTU-SOFTWARE.demo12.png"/> | ||
+ | <p> | ||
+ | If you want to upload a new biobrick to our database,just fill in all necessary information and click button ‘Submit’.<br/> | ||
+ | When you see<br/> | ||
+ | </p> | ||
+ | <img src = "https://static.igem.org/mediawiki/2015/6/60/SJTU-SOFTWARE.demo13.png"/> | ||
+ | <p>That means you have uploaded successfully .<br/> | ||
+ | </p> | ||
+ | </div> | ||
+ | <footer> | ||
+ | <div class = "am-g"> | ||
+ | |||
+ | <img src = "https://static.igem.org/mediawiki/2015/f/f6/SJTU-SOFTWARE.lifelogo.png" class = "am-u-sm-2"/> | ||
+ | <img src = "https://static.igem.org/mediawiki/2015/1/17/SJTU-SOFTWARE.seieelogo.png" class = "am-u-sm-2"/> | ||
+ | <img src = "https://static.igem.org/mediawiki/2015/d/d6/SJTU-SOFTWARE.syglogo.png" class = "am-u-sm-2"/> | ||
+ | |||
+ | <img src = "https://static.igem.org/mediawiki/2015/6/6b/SJTU-SOFTWARE.sbelogo.png" class = "am-u-sm-2"/> | ||
+ | <img src = "https://static.igem.org/mediawiki/2015/0/0f/SJTU-SOFTWARE.miclogo.png" class = "am-u-sm-2"/> | ||
+ | <img src = "https://static.igem.org/mediawiki/2015/9/95/SJTU-SOFTWARE.medialogo.png" class = "am-u-sm-2 logo"/> | ||
+ | |||
+ | </div> | ||
+ | </footer> | ||
+ | <!--[if (gte IE 9)|!(IE)]><!--> | ||
+ | <script src="https://2015.igem.org/Template:SJTU-Software/jqueryMinJs?action=raw&ctype=text/javascript"></script> | ||
+ | <script src="https://2015.igem.org/Template:SJTU-Software/niceScrollJs?action=raw&ctype=text/javascript"></script> | ||
+ | <!--<![endif]--> | ||
+ | <!--[if lte IE 8 ]> | ||
+ | <script src="http://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script> | ||
+ | <script src="http://cdn.staticfile.org/modernizr/2.8.3/modernizr.js"></script> | ||
+ | <script src="assets/js/amazeui.ie8polyfill.min.js"></script> | ||
+ | <![endif]--> | ||
+ | <script src="https://2015.igem.org/Template:SJTU-Software/amazeuiMinJs?action=raw&ctype=text/javascript"></script> | ||
+ | </body> | ||
</html> | </html> |
Latest revision as of 22:21, 18 September 2015
Our software ‘Base’ have four based functions:
Search,Construct,Evaluate and Upload.
This document will use some specific examples
to help you learn how to use our software.
Search for device:
When you want you use our software to search for a device,you may follow such steps:
Here is the search box in search page:
![](https://static.igem.org/mediawiki/2015/d/d4/SJTU-SOFTWARE.demo1.png)
First,enter the keyword, like “protein”
Then click button ‘Device’
Button ‘Advanced’ is used to change weight,click it and you will see this page:
![](https://static.igem.org/mediawiki/2015/3/32/SJTU-SOFTWARE.demo2.png)
Change weight as you like,
For example:
Set Uses to 1
Set Part Results to 20
Set Confirmed_times to 1
Set Number_comments to 1
![](https://static.igem.org/mediawiki/2015/c/c1/SJTU-SOFTWARE.demo3.png)
Leave the rest as the defaults and click button ‘Sure’.
You will see result like this:
![](https://static.igem.org/mediawiki/2015/4/49/SJTU-SOFTWARE.demo4.png)
Search for Part:
Searching for part is a similar process
For example,
We enter keyword ”DNA”,click button ‘Part’ and change weight the same as the example of searching for device above
(Set Uses to 1;set Part Results to 20;set Confirmed_times to 1;set Number_comments to 1).
Then you will see the result as below:
![](https://static.igem.org/mediawiki/2015/2/2d/SJTU-SOFTWARE.demo5.png)
Construct:
Construct page can help you design a new device intelligently.
Let us see a simple example:
Drag the icons from the left of the page and construct a simple device with a regulator,coding area,a reporter and a terminator.
Now you will see your device in graphical form:
![](https://static.igem.org/mediawiki/2015/2/2b/SJTU-SOFTWARE.demo6.png)
Click button ‘Advise’ and select biobricks for your device.You can fill in functions if you want.
History id will show all ID of biobricks in your device.
![](https://static.igem.org/mediawiki/2015/1/12/SJTU-SOFTWARE.demo7.png)
When you have finished a device, you can click "Next-Evaluate" button on the bottom right corner to evaluate this device.
Evaluate:
This page can help you evaluate a device,this device can be a existing device or a brand new device you have just designed.
Continuing with the example of ‘Construct’.When you have clicked button ‘Next-Evaluate’,you will jump to Evaluate page like this:
![](https://static.igem.org/mediawiki/2015/f/f4/SJTU-SOFTWARE.demo9.png)
You can delete any of these biobricks or insert new biobricks to change this device.
Of course,you can delete all and refill ID to start the evaluation of a new device.
Choose Accuracy on the top left of the page,then click "Evaluate"to start the evaluation.
After a short wait,you may get results as below:
![](https://static.igem.org/mediawiki/2015/c/cf/SJTU-SOFTWARE.demo10.png)
Here you can see overall score of the device and ‘Optimal ID’.
‘Optimal ID’ is a list of biobricks recommended to replace original biobrick,you may choose biobricks from them to optimize this device.
![](https://static.igem.org/mediawiki/2015/d/db/SJTU-SOFTWARE.demo11.png)
Do not forget use button ‘Upload’ if you want to upload this device to our database.
Upload page is very easy to use,
Continuing with our example,
![](https://static.igem.org/mediawiki/2015/c/c5/SJTU-SOFTWARE.demo12.png)
If you want to upload a new biobrick to our database,just fill in all necessary information and click button ‘Submit’.
When you see
![](https://static.igem.org/mediawiki/2015/6/60/SJTU-SOFTWARE.demo13.png)
That means you have uploaded successfully .