Team:CBNU-Korea/Project/BD/Overview

From 2012.igem.org

(Difference between revisions)
Line 1: Line 1:
 +
{{Team:CBNU-Korea/css_new}}
<html>
<html>
<head>
<head>
-
<link href='http://fonts.googleapis.com/css?family=Droid+Sans'
 
-
rel='stylesheet' type='text/css'>
 
-
<link href='http://fonts.googleapis.com/css?family=Francois+One'
 
-
rel='stylesheet' type='text/css'>
 
-
<link href='http://fonts.googleapis.com/css?family=Lato:300,400,900'
 
-
rel='stylesheet' type='text/css'>
 
-
 
-
<!--[if lt IE 9]>
 
-
    <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
 
-
    <script src="http://scottjehl.github.com/Respond/respond.min.js"></script>
 
-
    <![endif]-->
 
-
 
-
 
-
<meta name="viewport"
 
-
content="width=device-width, initial-scale=1.0 minimum-scale=1, maximum-scale=1, user-scalable=yes, target-densitydpi=medium-dpi" />
 
<style>
<style>
-
/******/
 
-
header,footer,section,article,aside,nav,hgroup,details,menu,figure,figcaption
 
-
{
 
-
display: block;
 
-
}
 
-
 
-
/* ----------------Display:none---------------- */
 
-
#p-logo {
 
-
display: none;
 
-
}
 
-
 
-
#search-controls {
 
-
display: none;
 
-
}
 
-
 
-
.firstHeading {
 
-
display: none;
 
-
}
 
-
 
-
#catlinks {
 
-
display: none;
 
-
}
 
-
 
-
#footer-box {
 
-
display: none;
 
-
}
 
-
 
-
#contentSub {
 
-
display: none;
 
-
}
 
-
 
-
/* ----------------TopSection---------------- */
 
-
#top-section {
 
-
height: 30px;
 
-
width: 100%;
 
-
background: none repeat scroll 0 0 #343838; /*per Page*/
 
-
border-bottom: 1px solid #262B35; /*per Page*/
 
-
border-left: medium none;
 
-
border-right: medium none;
 
-
}
 
-
 
-
#menubar {
 
-
top: 2px;
 
-
font-family: 'Droid Sans', sans-serif;
 
-
}
 
-
 
-
/* ----------------Body---------------- */
 
-
body {
 
-
font-family: 'Lato' sans-serif;
 
-
background: white;
 
-
}
 
-
 
-
#globalWrapper {
 
-
padding-bottom: 0px;
 
-
}
 
-
 
-
/* ----------------TopSection_left-menu---------------- */
 
-
.left-menu,.left-menu a {
 
-
color: white;
 
-
left: 0px;
 
-
text-transform: capitalize;
 
-
}
 
-
 
-
.left-menu:hover {
 
-
background-color: transparent;
 
-
}
 
-
 
-
.left-menu:hover a {
 
-
color: white;
 
-
text-decoration: none !important;
 
-
}
 
-
 
-
.left-menu li a:hover {
 
-
color: #aaaaff;
 
-
}
 
-
 
-
/* ----------------TopSection_right-menu---------------- */
 
-
.right-menu li {
 
-
background-color: transparent;
 
-
}
 
-
 
-
.right-menu,.right-menu a {
 
-
color: white;
 
-
right: 0;
 
-
text-align: right;
 
-
}
 
-
 
-
.right-menu:hover {
 
-
background-color: transparent;
 
-
}
 
-
 
-
.right-menu:hover a {
 
-
color: white;
 
-
}
 
-
 
-
.right-menu li a {
 
-
background-color: transparent;
 
-
color: white;
 
-
padding: 0 15px 0 0;
 
-
}
 
-
 
-
.right-menu li a:hover {
 
-
color: #aaaaff;
 
-
}
 
-
 
-
/* ----------------CB_top---------------- */
 
-
#CB_top {
 
-
background: url(https://static.igem.org/mediawiki/2012/f/fd/CBK_back_010.png);
 
-
font-family: 'Francois One', sans-serif;
 
-
overflow: auto;
 
-
padding-bottom: 20px;
 
-
}
 
-
 
-
#CB_top_shadow {
 
-
background: url(https://static.igem.org/mediawiki/2012/b/b0/CBK_back_011.png);
 
-
height: 10px;
 
-
margin-bottom: 12px;
 
-
}
 
-
 
-
#CB_top_logo_cont {
 
-
width: 90%;
 
-
max-width: 1080px;
 
-
margin: 0 auto;
 
-
line-height: 1em;
 
-
}
 
-
 
-
#CB_top_CBNU_logo {
 
-
width: 55%;
 
-
margin: 0 auto;
 
-
color: white;
 
-
font-size: 50px;
 
-
float: left;
 
-
padding-top: 25px;
 
-
}
 
-
 
-
#CB_top_CBNU_logo_img {
 
-
background: url(https://static.igem.org/mediawiki/2012/2/2c/CBK_logo_003.png)
 
-
no-repeat;
 
-
width: 140px;
 
-
height: 120px;
 
-
float: left;
 
-
}
 
-
 
-
#CB_top_CBNU_logo_text_1 p {
 
-
padding: 0;
 
-
margin: 0;
 
-
margin-top: 12px;
 
-
font-size: 30px;
 
-
}
 
-
 
-
#CB_top_CBNU_logo_text_2 p {
 
-
padding: 0;
 
-
margin: 0;
 
-
margin-top: -18px;
 
-
}
 
-
 
-
#CB_top_MENU {
 
-
width: 45%;
 
-
float: right;
 
-
text-align: right;
 
-
padding-top: 45px;
 
-
}
 
-
 
-
#CB_top_MENU ul {
 
-
margin: 0;
 
-
padding: 0;
 
-
font-size: 18px;
 
-
padding-bottom: 10px;
 
-
}
 
-
 
-
#CB_top_MENU li {
 
-
display: inline-block;
 
-
*display: inline;
 
-
border-bottom: 5px solid #221B1B;
 
-
height: 30px;
 
-
padding: 0 15px;
 
-
margin: 0 4px;
 
-
}
 
-
 
.PROJECT {
.PROJECT {
border-bottom-color: white !important;
border-bottom-color: white !important;
-
}
 
-
 
-
#CB_top_MENU li:hover {
 
-
background: white;
 
-
border-bottom: 5px solid white;
 
-
}
 
-
 
-
#CB_top_MENU li:hover a {
 
-
color: #24BED3;
 
-
}
 
-
 
-
#CB_top_MENU a {
 
-
color: #0E0B0B;
 
-
}
 
-
 
-
/* ----------------CB_content---------------- */
 
-
#CB_content a {
 
-
color: black;
 
-
}
 
-
 
-
#CB_subcontent {
 
-
width: 90%;
 
-
max-width: 1080px;
 
-
margin: 0 auto;
 
-
background: transparent;
 
-
overflow: auto;
 
-
}
 
-
 
-
#CB_subcontent h2 {
 
-
background: white;
 
-
color: black;
 
-
font-size: 2.2em;
 
-
font-weight: 900;
 
-
border: 0;
 
-
margin: 0;
 
-
padding: 25px 10px 10px 2%;
 
-
}
 
-
 
-
#CB_subcontent h3 {
 
-
font-weight: 400;
 
-
border: 0;
 
-
margin: 0;
 
-
padding: 2% 0 1% 4.2%;
 
-
font-size: 2em;
 
-
line-height: 1.5em;
 
-
}
 
-
 
-
#CB_subcontent p {
 
-
font-weight: 400;
 
-
border: 0;
 
-
margin: 0;
 
-
padding: 1% 0 1% 4.5%;
 
-
font-size: 1.4em;
 
-
}
 
-
 
-
#CB_sub_title {
 
-
width: 100%;
 
-
overflow: auto;
 
-
margin-bottom: 30px;
 
-
}
 
-
 
-
#CB_subcontent h2 {
 
-
background: white;
 
-
color: black;
 
-
font-size: 3.5em;
 
-
font-weight: 900;
 
-
border: 0;
 
-
margin: 0;
 
-
padding: 25px 10px 10px 2%;
 
-
}
 
-
 
-
#CB_sub_title h3 {
 
-
font-weight: 400;
 
-
border: 0;
 
-
margin: 0;
 
-
padding: 0 0 1% 4.2%;
 
-
font-size: 2em;
 
-
line-height: 1.5em;
 
-
}
 
-
 
-
#CB_sub_main {
 
-
width: 70%;
 
-
float: right;
 
-
}
 
-
 
-
#CB_sub_menu {
 
-
width: 28%;
 
-
float: left;
 
-
border-top: 1px dotted #41C7BC;
 
-
padding-top: 10px;
 
-
}
 
-
 
-
#CB_sub_menu ul {
 
-
list-style-type: none;
 
-
margin: 0;
 
-
padding: 10px 0 0 0;
 
-
margin-right: 20%;
 
-
font-size: 16px;
 
-
}
 
-
 
-
#CB_sub_menu li {
 
-
border-bottom: 1px dotted #41C7BC;
 
-
}
 
-
 
-
#li_sub {
 
-
font-size: 14px;
 
-
padding-left: 17%;
 
}
}
Line 317: Line 17:
color: #A56BAA !important;
color: #A56BAA !important;
padding-left: 10px;
padding-left: 10px;
-
}
 
-
 
-
#CB_sub_main {
 
-
border-top: 1px dotted #41C7BC;
 
-
padding-top: 10px;
 
-
}
 
-
 
-
#CB_sub_main h1 {
 
-
font-size: 2.4em;
 
-
font-weight: 900;
 
-
margin: 0;
 
-
line-height: 1.2em;
 
-
}
 
-
 
-
#CB_sub_main h2 {
 
-
font-size: 1.5em;
 
-
font-weight: 900;
 
-
margin: 0;
 
-
line-height: 1.2em;
 
-
border: 0;
 
-
padding: 10px 0 5px 2%;
 
-
}
 
-
 
-
#CB_sub_main h3 {
 
-
 
-
}
 
-
 
-
#CB_sub_main p {
 
-
 
}
}
#CB_sub_img {
#CB_sub_img {
-
height: 140px;
+
background-image:
-
background:
+
url(https://static.igem.org/mediawiki/2012/e/ed/CBK_sub_img_003.png);
url(https://static.igem.org/mediawiki/2012/e/ed/CBK_sub_img_003.png);
-
background-size: 100% 100%;
 
-
}
 
-
 
-
#CB_sub_img img {
 
-
width: 100%;
 
-
height: 100%;
 
-
}
 
-
 
-
#CB_sub_cont {
 
-
 
-
}
 
-
 
-
#scrolltotop {
 
-
width: 100%;
 
-
height: 20px;
 
-
background: url(https://static.igem.org/mediawiki/2012/7/7e/CBK_STT.png)
 
-
no-repeat right;
 
-
cursor: pointer;
 
-
}
 
-
/* ----------------CB_footer---------------- */
 
-
#CB_responsive {
 
-
height: 200px;
 
-
background: #DFD4E7;
 
-
border-top: 1px solid #AAA6B6;
 
-
}
 
-
 
-
#CB_footer {
 
-
height: 200px;
 
-
background: #EBEBEB;
 
-
border-top: 1px solid silver;
 
-
}
 
-
 
-
#CB_footer_logo {
 
-
 
-
}
 
-
 
-
#CB_footer_text {
 
-
 
-
}
 
-
 
-
/* ----------------Content---------------- */
 
-
#content {
 
-
background: transparent;
 
-
padding: 0;
 
-
width: 100%;
 
-
border: 0px;
 
-
}
 
-
 
-
a {
 
-
color: #0088cc;
 
-
text-decoration: none;
 
-
}
 
-
 
-
a:hover {
 
-
color: #005580;
 
-
text-decoration: none !important;
 
-
}
 
-
 
-
p {
 
-
margin: 0px;
 
-
}
 
-
 
-
hr {
 
-
height: 1px;
 
-
color: transparent;
 
-
background-color: transparent;
 
-
border: 0;
 
-
background-image: -webkit-linear-gradient(left, transparent, rgba(0, 0, 0, 0.25),
 
-
transparent );
 
-
background-image: -moz-linear-gradient(left, transparent, rgba(0, 0, 0, 0.25),
 
-
transparent );
 
-
background-image: -ms-linear-gradient(left, transparent, rgba(0, 0, 0, 0.25),
 
-
transparent );
 
-
background-image: -o-linear-gradient(left, transparent, rgba(0, 0, 0, 0.25),
 
-
transparent );
 
-
}
 
-
 
-
/* ----------------responsive---------------- */
 
-
 
-
/* iPhone, etc portrait ---- */
 
-
@media all and (min-width : 320px) and (max-width : 768px) {
 
-
#menubar {
 
-
display: none;
 
-
}
 
-
#CB_top {
 
-
padding-bottom: 0px;
 
-
}
 
-
#CB_top_logo_cont {
 
-
width: 100%;
 
-
max-width: 1080px;
 
-
margin: 0 auto;
 
-
line-height: 1em;
 
-
}
 
-
#CB_top_CBNU_logo {
 
-
width: 100%;
 
-
margin: 0 auto;
 
-
color: white;
 
-
font-size: 30px;
 
-
padding-top: 15px;
 
-
text-align: center;
 
-
}
 
-
#CB_top_CBNU_logo_img {
 
-
background: url(https://static.igem.org/mediawiki/2012/2/2c/CBK_logo_003.png)
 
-
no-repeat;
 
-
width: 120px;
 
-
height: 120px;
 
-
margin: 0 auto;
 
-
float: none;
 
-
}
 
-
#CB_top_MENU {
 
-
width: 100%;
 
-
text-align: center;
 
-
padding-top: 40px;
 
-
}
 
-
#CB_top_MENU ul {
 
-
margin: 0;
 
-
padding: 0;
 
-
font-size: 12px;
 
-
padding-bottom: 10px;
 
-
}
 
-
#CB_top_MENU li {
 
-
display: inline-block;
 
-
*display: inline;
 
-
border-bottom: 5px solid #221B1B;
 
-
height: 20px;
 
-
padding: 0 15px;
 
-
margin: 0 4px;
 
-
}
 
-
#CB_top_MENU li:hover {
 
-
background: white;
 
-
border-bottom: 5px solid white;
 
-
}
 
-
#CB_top_MENU li:hover a {
 
-
color: #24BED3;
 
-
}
 
-
#CB_top_MENU a {
 
-
color: #0E0B0B;
 
-
}
 
-
}
 
-
 
-
/* iPad, tablets etc portrait ---- */
 
-
@media all and (min-width : 769px) and (max-width : 1024px ) {
 
-
#menubar {
 
-
display: block;
 
-
}
 
-
#CB_top {
 
-
padding-bottom: 0px;
 
-
}
 
-
#CB_top_CBNU_logo {
 
-
width: 100%;
 
-
margin: 0 auto;
 
-
color: white;
 
-
font-size: 45px;
 
-
padding-top: 15px;
 
-
text-align: center;
 
-
}
 
-
#CB_top_CBNU_logo_img {
 
-
background: url(https://static.igem.org/mediawiki/2012/2/2c/CBK_logo_003.png)
 
-
no-repeat;
 
-
width: 120px;
 
-
height: 120px;
 
-
margin: 0 auto;
 
-
float: none;
 
-
}
 
-
#CB_top_MENU {
 
-
width: 100%;
 
-
text-align: center;
 
-
padding-top: 20px;
 
-
}
 
-
#CB_top_MENU ul {
 
-
margin: 0;
 
-
padding: 0;
 
-
font-size: 16px;
 
-
padding-bottom: 10px;
 
-
}
 
-
#CB_top_MENU li {
 
-
display: inline-block;
 
-
*display: inline;
 
-
border-bottom: 5px solid #221B1B;
 
-
height: 20px;
 
-
padding: 0 15px;
 
-
margin: 0 4px;
 
-
}
 
-
#CB_top_MENU li:hover {
 
-
background: white;
 
-
border-bottom: 5px solid white;
 
-
}
 
-
#CB_top_MENU li:hover a {
 
-
color: #24BED3;
 
-
}
 
-
#CB_top_MENU a {
 
-
color: #0E0B0B;
 
-
}
 
-
}
 
-
 
-
/* Laptops, Desktops, etc ---- */
 
-
/*@media all and (min-width: 1024px) {
 
-
            body {
 
-
                font-family: 'Droid Sans', sans-serif;
 
-
                background-color: green;
 
-
            }
 
-
 
-
            #menubar {
 
-
                display: block;
 
-
            }
 
-
}*/
 
-
 
-
/* large Desktops */
 
-
@media all and (min-width: 1025px) {
 
-
#menubar {
 
-
display: block;
 
-
}
 
}
}
</style>
</style>
-
 
-
<script type="text/javascript">
 
-
$(function() {
 
-
$("*#scrolltotop").click(function() {
 
-
$("html,body").animate({
 
-
scrollTop : 0
 
-
});
 
-
});
 
-
});
 
-
</script>
 
</head>
</head>
Line 595: Line 43:
<div id="CB_top_MENU">
<div id="CB_top_MENU">
<ul>
<ul>
-
<li class="HOME"><a href="https://2012.igem.org/Team:CBNU-Korea">HOME</a></li>
+
<li class="HOME"><a
-
<li class="TEAM"><a href="https://2012.igem.org/Team:CBNU-Korea/Team">TEAM</a></li>
+
href="https://2012.igem.org/Team:CBNU-Korea">HOME</a></li>
 +
<li class="TEAM"><a
 +
href="https://2012.igem.org/Team:CBNU-Korea/Team">TEAM</a></li>
<li class="PROJECT"><a href="#">PROJECT</a></li>
<li class="PROJECT"><a href="#">PROJECT</a></li>
-
<li class="NOTEBOOK"><a href="https://2012.igem.org/Team:CBNU-Korea/Notebook">NOTEBOOK</a></li>
+
<li class="NOTEBOOK"><a
 +
href="https://2012.igem.org/Team:CBNU-Korea/Notebook">NOTEBOOK</a></li>
</ul>
</ul>
<ul>
<ul>
-
<li class="SAFETY"><a href="https://2012.igem.org/Team:CBNU-Korea/Safety">SAFETY</a></li>
+
<li class="SAFETY"><a
-
<li class="JUDGING"><a href="https://2012.igem.org/Team:CBNU-Korea/JG/judging">JUDGING</a></li>
+
href="https://2012.igem.org/Team:CBNU-Korea/Safety">SAFETY</a></li>
-
<li class="iGEM"><a href="https://2012.igem.org/" target="_blank">iGEM</a></li>
+
<li class="JUDGING"><a
 +
href="https://2012.igem.org/Team:CBNU-Korea/JG/judging">JUDGING</a></li>
 +
<li class="iGEM"><a href="https://2012.igem.org/"
 +
target="_blank">iGEM</a></li>
</ul>
</ul>
</div>
</div>
Line 640: Line 94:
</div>
</div>
<div id="CB_sub_main">
<div id="CB_sub_main">
-
<div id="CB_sub_img"><img
+
<div id="CB_sub_img">
-
src="https://static.igem.org/mediawiki/2012/6/6e/CBK_overlay_001.png"></div>
+
<img
 +
src="https://static.igem.org/mediawiki/2012/6/6e/CBK_overlay_001.png">
 +
</div>
<div id="CB_sub_cont">
<div id="CB_sub_cont">
<h1>1. Overview</h1>
<h1>1. Overview</h1>

Revision as of 17:59, 26 September 2012

Brick Designer

- Overview

1. Overview

- The importance of the transfer, saving and management of bio-information is now closely related to the computers. Nowadays bio-informatics are used in many fields from simple biological models to complicated algorithm forecast and more. And in synthetic biology, since designing a biological circuit by using the computer became available, it has opened a new era. In the past, synthetic biology used to find subjects like a genetic part that is about a specific purpose and the connection between the fastest designing process only by experiments. But now in the future of synthetic biology, experiment and the computational designing program must be in a mutual relationship. The purpose of our project is to increase the efficiency of the experiment by using the designing process of BioBrick prior to the experiment, and improve the efficiency of the connection between the next experiment conducted by the program user.

2. Feature

2-1. BioBrick Data Download

- The registered BioBrick information needed for designing in this program, can be easily downloaded without being typed in.

2-2. Design

- The user can arrange the BioBrick in any sequence they want. And if they want, the user can put a proper Prefix, Suffix restriction enzyme site between the Bricks by the software.

- By selecting the Plasmid Backbone and the restriction enzyme in sequence, the cloning will be done automatically.

2-3. Screen Shot

- The BioBrick that the user designed from the program is saved in image files to be readily used in Wiki or documents.

2-4. Various Storage Formats

- The project in designing in progress can be saved or imported. Also, by saving the informations as a SBOL, GenBank, Fasta form, the user can use the information that they design in other programs as well.

3. The process of the program designing

3-1. Problem Recognition

- In many common laboratories today, there is a limit that the user themselves has to put in the BioBrick Data, and draw it as an image after they finish the design. So we decided to develop the designing a program that, based on BioBrick DataBase, directly provide designing process with convenient additional functions as well.

3-2. Requirement Checking

- We checked on other programs that many people are using nowadays, and analyzed the steps that are needed in designing.

- For the connection within other programs that can be used after the experiment, we checked on the needs of the saving methods on GenBank, SBOL, Fasta.

3-2. Design

- Visual Studio 2010, 2012 (C#)

- Windows 7

- OleDB (MS OFFICE)

- * When running the program, Microsoft Runtime is required.

3-2. Discussion and Feedback

- Our team members repeated testing the program, finding the errors and fixing the problems.

4. Future Work

Our program is now version 1.0.0, and will be updated and offer better information and performance about the designing process in next versions. First, simplification of the registration process of the iGEM Part will be offered. The registration of BioBrick is now available only in online. But by co-working with iGEM, we will develop a better functioning program, and make it possible to design and register the Brick at the same time. Secondly, we are planning to add a communication function between the users. This function will help the users to share opinions, and discuss designing information about a specific Brick. This discussion will help the users improve their experiment or project. Third, the expression rate will be produced in a numerical value. The expression rate value is a score that will show the users how the expression of the BioBrick designed by cloning is working in the experiment. To make it as a score, theoretical background and algorithm based on a lot of data are required. The last is the import of the files with various saving forms. Nowadays we can only save the designed BioBrick data after exporting it. But the next version of the program will be improved to read the data modified and saved in other process, and reading, processing and saving it will be available as well.