Team:SYSU-Software/designer

From 2013.igem.org

(Difference between revisions)
 
(23 intermediate revisions not shown)
Line 14: Line 14:
<link href="https://2012.igem.org/Team:SYSU-Software/flatui.css?action=raw&ctype=text/css" rel="stylesheet" type="text/css" />
<link href="https://2012.igem.org/Team:SYSU-Software/flatui.css?action=raw&ctype=text/css" rel="stylesheet" type="text/css" />
<link href="https://2013.igem.org/Team:SYSU-Software/cast.css?action=raw&ctype=text/css" rel="stylesheet" type="text/css" />
<link href="https://2013.igem.org/Team:SYSU-Software/cast.css?action=raw&ctype=text/css" rel="stylesheet" type="text/css" />
 +
<!-- <link href="cast_designer/css/cast_designer.css" rel="stylesheet" type="text/css" /> -->
<link href="https://2013.igem.org/Team:SYSU-Software/header.css?action=raw&amp;ctype=text/css" rel="stylesheet" type="text/css" />
<link href="https://2013.igem.org/Team:SYSU-Software/header.css?action=raw&amp;ctype=text/css" rel="stylesheet" type="text/css" />
 +
Line 20: Line 22:
<script src="https://2013.igem.org/Team:SYSU-Software/bootstrap.min.js?action=raw&ctype=text/javascript" type="text/javascript"></script>
<script src="https://2013.igem.org/Team:SYSU-Software/bootstrap.min.js?action=raw&ctype=text/javascript" type="text/javascript"></script>
<script src="https://2013.igem.org/Team:SYSU-Software/prefix.js?action=raw&ctype=text/javascript" type="text/javascript"></script>
<script src="https://2013.igem.org/Team:SYSU-Software/prefix.js?action=raw&ctype=text/javascript" type="text/javascript"></script>
 +
<script src="https://2013.igem.org/Team:SYSU-Software/cast_designer.js?action=raw&ctype=text/javascript" type="text/javascript"></script>
 +
<!-- <script src="cast_designer/cast_designer.js" type="text/javascript"></script> -->
 +
<head>
<head>
Line 29: Line 34:
<body>
<body>
-
<!--header-->
+
<!--header-->
-
<div id="navigation"></div>
+
<div id="navigation"></div>
-
<div class="wrapper">
+
<div class="wrapper">
-
 
+
-
<div id="cast-header">
+
-
    <img src="https://static.igem.org/mediawiki/2013/7/77/Cast-header-image.png">
+
-
  </div>
+
-
 
+
-
  <div id="cast-introduction-header">
+
-
    CAST (Computer Aided Synbio Tool)- An Integrated Tool<br>
+
-
    for Synthetic Biology
+
-
  </div>
+
-
 
+
-
  <div id="cast-introduction-part1" class="cast-introduction-part">
+
-
    <table>
+
-
      <tr >
+
-
        <td>
+
-
          <span id="cast-intruction-image">
+
-
            <img src="https://static.igem.org/mediawiki/2013/4/41/Cast-intruction-image.png">
+
-
          </span>
+
-
        </td>
+
-
 
+
-
        <td>
+
-
          <span id="cast-intruction-text">
+
-
            <span id="cast-intruction-text-header">Regulation network:</span><br>
+
-
            Protein is the basic functional unit of all purpose of life. We can programme the mechanism among proteins by constructing regulation network; meanwhile,
+
-
 
+
-
this is also the step that users initially organize their ideas. In the Regulation network part, users can search all kinds of proteins that relates to synthetic
+
-
 
+
-
biology and drag them in the blank and then arrange the regulatory relationship. Clicking on Protein A, three icons will show on other proteins (for example, protein
+
-
 
+
-
B) that can be regulated by A. To click on the up arrow means A stimulate the expression of B (up-regulation) while the down arrow means repression (down-regulation).
+
-
 
+
-
The chain icon means A and B are programmed to be co-expressed. Different regulatory factors are provided to meet the demand of regulatory method. Users can design
+
-
 
+
-
their functional network but not gene circuits thus they can focus on the ideas without the bothering of technical questions.
+
-
          </span>
+
-
        </td>
+
-
      </tr>
+
-
    </table>
+
-
  </div>
+
-
 
+
-
 
+
-
  <div id="cast-introduction-part2" class="cast-introduction-part">
+
-
    <table>
+
-
      <tr >
+
-
        <td>
+
-
          <span id="cast-intruction-text">
+
-
            <span id="cast-intruction-text-header">Gene circuit:</span><br>
+
-
          Followed by Regulation network part, CAST will generate default gene circuits automatically. Also, the circuits can be optimized by users according to
+
-
 
+
-
special demand of materials or methods. Simultaneously, the simulation of this network will be displayed. The parameters of proteins can be adjusted by dragging the
+
-
columns, and thus, the model will be real-time adjusted. Furthermore, we can view the model by detail; in the simulation window, users can compare some curves they
+
<!-- <div id="cast-header"> -->
 +
<!-- <img src="https://static.igem.org/mediawiki/2013/7/77/Cast-header-image.png"> -->
 +
<!-- </div> -->
-
concentrate, or view the model influenced by stochastic noise or time delay. Inducers' effects will be also reflected in the model.
+
<div id="cast-introduction-header">
-
          </span>
+
<h1>
-
        </td>
+
CAST (Computer Aided Synbio Tool)- An Integrated Tool<br>
 +
for Synthetic Biology</h1>
 +
</div>
 +
<div id="part1" name="part1"class="cast-introduction-part cast-introduction-part1">
 +
<div class="introduction-content">
 +
<div class="introduction">
 +
<span class="cast-introduction-text-header">Gene circuit</span>
 +
<span>Followed by Regulation network part, CAST will generate default gene circuits automatically. Also, the circuits can be optimized by users according to special demand of materials or methods. Simultaneously, the simulation of this network will be displayed. The parameters of proteins can be adjusted by dragging the columns, and thus, the model will be real-time adjusted. Furthermore, we can view the model by detail; in the simulation window, users can compare some curves they concentrate, or view the model influenced by stochastic noise or time delay. Inducers' effects will be also reflected in the model.</span>
 +
</div>
 +
<div class="shots">
 +
<div>
 +
<div id="display-board">
 +
<div class='board-left board'><img src=""></div>
 +
<div class='board-right board'><span></span></div>
 +
</div>
 +
<img id="biobrick" src="https://static.igem.org/mediawiki/2013/2/2d/Cast_Biobrick.png" usemap="#biobirck-map">
 +
<map name="biobirck-map" id="biobirck-map">
 +
<area id="assembly" shape="rect" coords="116,25,188,45" href="#"/>
 +
<area id="simulating" shape="rect" coords="167,1,238,21" href="#"/>
 +
<area id="relationship" shape="rect" coords="254,24,326,44" href="#"/>
 +
<area id="parameter" shape="rect" coords="307,0,374,21" href="#"/>
 +
</map>
 +
</div>
 +
<div><img src="https://static.igem.org/mediawiki/2013/f/fb/SYSU-Gene_circuit.png"></div>
 +
</div>
 +
</div>
 +
</div>
-
        <td>
+
<div id="part2" name="part2"class="cast-introduction-part cast-introduction-part2">
-
          <span id="cast-intruction-image">
+
<div class="introduction-content">
-
            <img src="https://static.igem.org/mediawiki/2013/4/41/Cast-intruction-image.png">
+
<div class="shots">
-
          </span>
+
<div><img src="https://static.igem.org/mediawiki/2013/1/1d/SYSU-Regulation_network.png"></div>
-
        </td>
+
<div><img src="https://static.igem.org/mediawiki/2013/6/6e/SYSU-Regulation_network1.png"></div>
-
      </tr>  
+
<!-- <div><img src="https://static.igem.org/mediawiki/2013/e/ef/Cast_Regulation_network3.png"></div> -->
-
    </table>
+
</div>
-
  </div>
+
<div class="introduction">
 +
<span class="cast-introduction-text-header">Regulation network:</span>
 +
<span>Protein is the basic functional unit of all purpose of life. We can programme the mechanism among proteins by constructing regulation network; meanwhile, this is also the step that users initially organize their ideas. In the Regulation network part, users can search all kinds of proteins that relates to synthetic biology and drag them in the blank and then arrange the regulatory relationship. Clicking on Protein A, three icons will show on other proteins (for example, protein B) that can be regulated by A. To click on the up arrow means A stimulate the expression of B (up-regulation) while the down arrow means repression (down-regulation). The chain icon means A and B are programmed to be co-expressed. Different regulatory factors are provided to meet the demand of regulatory method. Users can design their functional network but not gene circuits thus they can focus on the ideas without the bothering of technical questions.</span>
 +
</div>
 +
</div>
 +
</div>
-
  <div id="cast-introduction-part1" class="cast-introduction-part">
+
<div id="part3" name="part3"class="cast-introduction-part cast-introduction-part1">
-
    <table>  
+
<div class="introduction-content">
-
        <tr >
+
<div class="shots">
-
        <td style="width:70%;">
+
<div><img src="https://static.igem.org/mediawiki/2013/b/bf/SYSU-Simulation1.png"></div>
-
          <span >
+
</div>
-
            <img src="https://static.igem.org/mediawiki/2013/7/79/Protocal.png">
+
<div class="introduction">
-
          </span>
+
<span class="cast-introduction-text-header">Simulation:</span>
-
        </td>  
+
<span>We can view the model by detail. In the simulation window, users can focus on the interested protein and trace its change; or compare some curves they concentrate on. Furthermore, users may view the model influenced by stochastic noise or time delay.</span>
-
        <td>
+
</div>
-
          <span id="cast-intruction-text">
+
</div>
-
            <span id="cast-intruction-text-header">Plasmid & protocol:</span><br>
+
</div>
-
            Circuit design is not our final goal. Gene circuits designed by our software will be composed into a plasmid automatically. Furthermore, protocol for
+
-
assembling plasmid is also provided step by step. Beginners are able to accomplish their idea with our direction conveniently. Designed plasmid is presented as a
+
<div id="part4" name="part4" class="cast-introduction-part cast-introduction-part2">
 +
<div class="introduction-content">
 +
<div class="introduction">
 +
<span class="cast-introduction-text-header">Plasmid:</span>
 +
<span>As automation is our soul, the plasmid is constructed without your worrying. The plasmid will be presented intuitively and detailedly. Even better, you can select different assembly standard as you wish.</span>
 +
</div>
 +
<div class="shots">
 +
<div><img src="https://static.igem.org/mediawiki/2013/4/45/Cast-Plasmid03.png"></div>
 +
</div>
 +
</div>
 +
</div>
-
circle and all the sequence is annotated and displayed at the head of the window. Biobricks locate in different loci in plasmid will be marked and all the sequences
+
<div id="part5" name="part5"class="cast-introduction-part cast-introduction-part1">
 +
<div class="introduction-content">
 +
<div class="shots">
 +
<div><img src="https://static.igem.org/mediawiki/2013/7/7d/Cast_Protocol.png"></div>
 +
</div>
 +
<div class="introduction">
 +
<span class="cast-introduction-text-header">Protocol:</span>
 +
<span>Being a amateur and find it hard to begin? Do not worry! CAST is a considerable assistant. Your can accomplish your synthetic biology design under our detailed direction.</span>
 +
</div>
 +
</div>
 +
</div>
-
can be revised by users. Lab protocol for standard Biobricks assembling is presented in our software for amateurs. Following the directions, people with little
+
<div id="part6" name="part6"class="cast-introduction-part cast-introduction-part2">
 +
<div class="introduction-content">
 +
<div class="introduction">
 +
<span class="cast-introduction-text-header">Other functions:</span>
 +
<span>Aside from the basic functions listed above, there are some auxiliary functions which help a lot.</span>
 +
</div>
 +
<div class="shots">
 +
<div><img src="https://static.igem.org/mediawiki/2013/4/41/Cast-intruction-image.png"></div>
 +
</div>
 +
</div>
 +
</div>
-
experience in wet lab will be able to create their own engineered bacterium and feel the magic of synthetic biology.
+
<div id="part7" name="part7"class="cast-introduction-part cast-introduction-part1">
-
          </span>
+
<div class="introduction-content">
-
        </td>
+
<div class="introduction">
-
      </tr>  
+
<span><b>Introduce Biobrick.</b> In the interface of user account, entering "my files", people can build and upload their novel biobricks by typing in the sequence and describe the parameters and type. These data can be edited and managed online.</span>
-
     
+
</div>
-
    </table>
+
-
  </div>
+
 +
<div class="shots">
 +
<div><img src="https://static.igem.org/mediawiki/2013/9/95/Cast-Introbiobrick.png"></div>
 +
</div>
 +
</div>
 +
</div>
-
  <div id="cast-introduction-part2" class="cast-introduction-part">
+
<div id="part8" name="part8"class="cast-introduction-part cast-introduction-part2">
-
    <table>
+
<div class="introduction-content">
-
      <tr >
+
<div class="introduction">
-
        <td>
+
<!-- <span class="cast-introduction-text-header">Other functions:</span> -->
-
          <span id="cast-intruction-text">
+
<span><b>Output SBOL file.</b> The created biobricks will be compiled into SBOL automatically and thus users can get the file according to the information of the biobrick.</span>
-
            <span id="cast-intruction-text-header">Other functions:</span><br>
+
</div>
-
            Aside from the basic functions listed above, there are some auxiliary functions which help a lot.\
+
<div class="shots">
-
          </span>
+
<div><img src="https://static.igem.org/mediawiki/2013/5/57/Cast_Output_SBOL_file.png"></div>
-
        </td>
+
</div>
-
      </tr>
+
</div>
-
      <tr>
+
</div>
-
        <td>
+
-
        </td>
+
-
        <td>
+
-
          <span>
+
-
            <img src="https://static.igem.org/mediawiki/2013/4/41/Cast-intruction-image.png">
+
-
          </span>
+
-
        </td>
+
-
      </tr>  
+
-
    </table>
+
-
  </div>
+
-
  <div id="cast-introduction-part1" class="cast-introduction-part">
+
-
    <table>
+
-
      <tr >
+
-
        <td>
+
-
          <span id="cast-intruction-text">
+
-
            <b>Introduce Biobrick.</b> In the interface of user account, entering "my files", people can build and upload their novel biobricks by typing in the sequence and
+
-
describe the parameters and type. These data can be edited and managed online.
+
<div id="part9" name="part9"class="cast-introduction-part cast-introduction-part1">
-
          </span>
+
<div class="introduction-content">
-
        </td>
+
<div class="introduction">
-
        </tr>
+
<!-- <span class="cast-introduction-text-header">Plasmid & protocol</span> -->
-
        <tr>
+
<span><b>File sharing.</b> Not only the biobricks, but also the ideas can be shared by CAST. Users' result of their ideas: regulation network, plasmid constructed and simulation can be stored on CAST and shared between researchers.</span>
-
        <td>
+
</div>
-
        </td>
+
-
        <td>
+
-
          <span>
+
-
            <img src="https://static.igem.org/mediawiki/2013/9/95/Cast-Introbiobrick.png">
+
-
          </span>
+
-
        </td>
+
-
      </tr>
+
-
    </table>
+
-
  </div>
+
-
  <div id="cast-introduction-part2" class="cast-introduction-part">
+
-
    <table>
+
-
      <tr >
+
-
        <td>
+
-
          <span id="cast-intruction-text">          
+
-
          <b>Output SBOL file.</b> The created biobricks will be compiled into SBOL automatically and thus users can get the file according to the information of the
+
-
biobrick.
+
<div class="shots">
-
          </span>
+
<div><img src="https://static.igem.org/mediawiki/2013/8/8d/Cast_File_sharing.png"></div>
-
        </td>
+
</div>
-
      </tr>
+
</div>
-
      <tr>
+
</div>
-
        <td>
+
-
        </td>
+
-
        <td>
+
-
          <span >
+
-
            <img src="https://static.igem.org/mediawiki/2013/c/c1/Cast-Outputsbol.png">
+
-
          </span>
+
-
        </td>
+
-
      </tr>  
+
-
    </table>
+
-
  </div>
+
-
  <div id="cast-introduction-part1" class="cast-introduction-part">
+
-
    <table>
+
-
      <tr>
+
-
        <td>
+
-
          <span id="cast-intruction-text">           
+
-
          <b>File sharing.</b> Not only the biobricks, but also the ideas can be shared by CAST. Users' result of their ideas: regulation network, plasmid constructed and
+
-
simulation can be stored on CAST and shared between researchers.
 
-
          </span>
 
-
          </td>
 
-
      </tr>
 
-
        <tr>
 
-
          <td>
 
-
          </td>
 
-
          <td>
 
-
          <span >
 
-
            <img src="https://static.igem.org/mediawiki/2013/e/ef/Cast-Sharefilelist.png">
 
-
          </span>     
 
-
          </td>
 
-
      </tr>
 
-
    </table>
 
-
  </div>
 
-
<!--page footer-->
+
<div id="part10" name="part8"class="cast-introduction-part cast-introduction-part2">
-
  <div id="sysu-footer">
+
<div class="introduction-content">
-
    <img id="bottom-image" src="https://static.igem.org/mediawiki/2013/d/d9/Sysu-footer.png">
+
<div class="introduction">
-
  </div>
+
<!-- <span class="cast-introduction-text-header">Other functions:</span> -->
-
</div>
+
<span><b>Clotho apps</b>For clotho users, we have created a clotho app to open our software. The interface in clotho allow users open the server and web page at the same time.</span>
 +
</div>
 +
<div class="shots">
 +
<div><img src="https://static.igem.org/mediawiki/2013/8/86/SYSU-Clotho.png"></div>
 +
</div>
 +
</div>
 +
</div>
 +
<!--page footer-->
 +
<div id="sysu-footer">
 +
<img id="bottom-image" src="https://static.igem.org/mediawiki/2013/d/d9/Sysu-footer.png">
 +
</div>
 +
</div>
</body>
</body>
</html>
</html>

Latest revision as of 23:19, 28 October 2013

Team:SYSU-Software new

CAST (Computer Aided Synbio Tool)- An Integrated Tool
for Synthetic Biology

Gene circuit Followed by Regulation network part, CAST will generate default gene circuits automatically. Also, the circuits can be optimized by users according to special demand of materials or methods. Simultaneously, the simulation of this network will be displayed. The parameters of proteins can be adjusted by dragging the columns, and thus, the model will be real-time adjusted. Furthermore, we can view the model by detail; in the simulation window, users can compare some curves they concentrate, or view the model influenced by stochastic noise or time delay. Inducers' effects will be also reflected in the model.
Regulation network: Protein is the basic functional unit of all purpose of life. We can programme the mechanism among proteins by constructing regulation network; meanwhile, this is also the step that users initially organize their ideas. In the Regulation network part, users can search all kinds of proteins that relates to synthetic biology and drag them in the blank and then arrange the regulatory relationship. Clicking on Protein A, three icons will show on other proteins (for example, protein B) that can be regulated by A. To click on the up arrow means A stimulate the expression of B (up-regulation) while the down arrow means repression (down-regulation). The chain icon means A and B are programmed to be co-expressed. Different regulatory factors are provided to meet the demand of regulatory method. Users can design their functional network but not gene circuits thus they can focus on the ideas without the bothering of technical questions.
Simulation: We can view the model by detail. In the simulation window, users can focus on the interested protein and trace its change; or compare some curves they concentrate on. Furthermore, users may view the model influenced by stochastic noise or time delay.
Plasmid: As automation is our soul, the plasmid is constructed without your worrying. The plasmid will be presented intuitively and detailedly. Even better, you can select different assembly standard as you wish.
Protocol: Being a amateur and find it hard to begin? Do not worry! CAST is a considerable assistant. Your can accomplish your synthetic biology design under our detailed direction.
Other functions: Aside from the basic functions listed above, there are some auxiliary functions which help a lot.
Introduce Biobrick. In the interface of user account, entering "my files", people can build and upload their novel biobricks by typing in the sequence and describe the parameters and type. These data can be edited and managed online.
Output SBOL file. The created biobricks will be compiled into SBOL automatically and thus users can get the file according to the information of the biobrick.
File sharing. Not only the biobricks, but also the ideas can be shared by CAST. Users' result of their ideas: regulation network, plasmid constructed and simulation can be stored on CAST and shared between researchers.
Clotho appsFor clotho users, we have created a clotho app to open our software. The interface in clotho allow users open the server and web page at the same time.