Team:CBNU-Korea/Team

From 2012.igem.org

(Difference between revisions)
Line 1: Line 1:
-
{{Team:CBNU-Korea/css_slide2}}
 
-
 
<html>
<html>
<head>
<head>
Line 10: Line 8:
<link href='http://fonts.googleapis.com/css?family=Lato:300,400,900'
<link href='http://fonts.googleapis.com/css?family=Lato:300,400,900'
rel='stylesheet' type='text/css'>
rel='stylesheet' type='text/css'>
-
 
<!--[if lt IE 9]>
<!--[if lt IE 9]>
     <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
     <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
     <script src="http://scottjehl.github.com/Respond/respond.min.js"></script>
     <script src="http://scottjehl.github.com/Respond/respond.min.js"></script>
-
</script>
 
-
   
 
     <![endif]-->
     <![endif]-->
Line 203: Line 198:
}
}
-
.HOME {
+
.PROJECT {
border-bottom-color: white !important;
border-bottom-color: white !important;
}
}
Line 221: Line 216:
/* ----------------CB_content---------------- */
/* ----------------CB_content---------------- */
 +
#CB_content a {
 +
color: black;
 +
}
 +
#CB_subcontent {
#CB_subcontent {
width: 90%;
width: 90%;
Line 227: Line 226:
background: transparent;
background: transparent;
overflow: auto;
overflow: auto;
-
margin-bottom: 15px;
 
}
}
Line 233: Line 231:
background: white;
background: white;
color: black;
color: black;
-
float: left;
 
font-size: 2.2em;
font-size: 2.2em;
font-weight: 900;
font-weight: 900;
Line 258: Line 255:
}
}
-
#CB_content_slide {
+
#CB_sub_title {
-
background: transparent;
+
-
width: 100%;
+
-
max-width: 1200px;
+
-
margin: 0 auto;
+
-
}
+
-
 
+
-
#CB_sub_jm {
+
width: 100%;
width: 100%;
overflow: auto;
overflow: auto;
 +
margin-bottom: 30px;
}
}
-
#CB_sub_menu {
+
#CB_subcontent h2 {
-
width: 28%;
+
-
float: left;
+
-
margin-right: 2%;
+
-
height: 200px;
+
background: white;
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;
}
}
Line 281: Line 283:
width: 70%;
width: 70%;
float: right;
float: right;
-
height: 400px;
 
-
background: white;
 
}
}
-
#CB_sub_cont {
+
#CB_sub_menu {
-
width: 100%;
+
width: 28%;
-
max-width: 1080px;
+
float: left;
-
background: white;
+
border-top: 1px dotted #41C7BC;
 +
padding-top: 10px;
}
}
-
/* ---------------CB_map------------------- */
+
#CB_sub_menu ul {
-
#CB_map {
+
list-style-type: none;
-
height: 300px;
+
margin: 0;
-
background: url("https://static.igem.org/mediawiki/2012/a/ae/CBK_map_002.png")
+
padding: 10px 0 0 0;
-
no-repeat #32B6DB;
+
margin-right: 20%;
-
cursor: pointer;
+
font-size: 16px;
}
}
-
#CB_map h1 {
+
#CB_sub_menu li {
-
margin: 0;
+
border-bottom: 1px dotted #41C7BC;
-
padding: 4% 10% 0% 65%;
+
}
-
border: 0;
+
 
-
font-size: 1.7em;
+
.MGD a {
font-weight: 900;
font-weight: 900;
-
color: white;
+
color: #A56BAA !important;
 +
padding-left: 10px;
}
}
-
#CB_map h2 {
+
#CB_sub_main {
 +
border-top: 1px dotted #41C7BC;
 +
padding-top: 10px;
 +
}
 +
 
 +
#CB_sub_main h1 {
 +
font-size: 2.4em;
 +
font-weight: 900;
margin: 0;
margin: 0;
-
padding: 1% 10% 0% 65%;
+
line-height: 1.2em;
 +
}
 +
 
 +
#CB_sub_main h2 {
 +
font-size: 1.5em;
 +
font-weight: 900;
 +
margin: 0;
 +
line-height: 1.2em;
border: 0;
border: 0;
-
font-size: 1em;
+
padding: 10px 0 5px 2%;
-
color: white;
+
}
}
-
/* ----------------CB_footer---------------- */
+
#CB_sub_main h3 {
-
#CB_responsive {
+
-
background: url(https://static.igem.org/mediawiki/2012/e/e1/CBK_back_013.png);
+
-
border-top: 1px solid #B483F1;
+
}
}
-
#CB_res_cont {
+
#CB_sub_main p {
-
background: url(https://static.igem.org/mediawiki/2012/0/0c/CBK_responsive_001.png) no-repeat center;
+
-
height: 250px;
+
-
width: 100%;
+
-
position: absolute;
+
}
}
-
#CB_responsive h1 {
+
#CB_sub_img {
-
padding: 4% 0 1% 50%;
+
height: 140px;
-
color: #3EA77D;
+
background: aqua;
-
margin: 0;
+
-
border: 0;
+
-
font-size: 2.5em;
+
}
}
-
#CB_responsive h2 {
+
#CB_sub_cont {
-
padding: 0% 15% 2% 50%;
+
-
color: #633F3F;
+
}
-
margin: 0;
+
 
-
border: 0;
+
#scrolltotop {
-
font-size: 1.3em;
+
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 {
#CB_footer {
-
height: 250px;
+
height: 200px;
-
background: url(https://static.igem.org/mediawiki/2012/a/a9/CBK_back_012.png);
+
background: #EBEBEB;
-
border-top: 1px solid white;
+
border-top: 1px solid silver;
}
}
Line 399: Line 416:
/* iPhone, etc portrait ---- */
/* iPhone, etc portrait ---- */
-
@media all and (min-width : 320px) and (max-width : 767px) {
+
@media all and (min-width : 320px) and (max-width : 768px) {
#menubar {
#menubar {
display: none;
display: none;
Line 431: Line 448:
width: 100%;
width: 100%;
text-align: center;
text-align: center;
-
padding-top: 20px;
+
padding-top: 40px;
}
}
#CB_top_MENU ul {
#CB_top_MENU ul {
Line 456: Line 473:
#CB_top_MENU a {
#CB_top_MENU a {
color: #0E0B0B;
color: #0E0B0B;
-
}
 
-
#CB_map {
 
-
background: url("https://static.igem.org/mediawiki/2012/a/ae/CBK_map_002.png")
 
-
no-repeat #32B6DB -160px 0px;
 
-
}
 
-
#CB_map h1 {
 
-
color: black;
 
-
padding: 4% 10% 0 10%;
 
-
}
 
-
#CB_map h2 {
 
-
color: black;
 
-
padding: 1% 10% 0 10%;
 
}
}
}
}
/* iPad, tablets etc portrait ---- */
/* iPad, tablets etc portrait ---- */
-
@media all and (min-width : 768px) and (max-width : 1023px ) {
+
@media all and (min-width : 769px) and (max-width : 1024px ) {
#menubar {
#menubar {
display: block;
display: block;
Line 523: Line 528:
#CB_top_MENU a {
#CB_top_MENU a {
color: #0E0B0B;
color: #0E0B0B;
-
}
 
-
#CB_map h1 {
 
-
color: black;
 
-
}
 
-
#CB_map h2 {
 
-
color: black;
 
}
}
}
}
Line 545: Line 544:
/* large Desktops */
/* large Desktops */
-
@media all and (min-width: 1024px) {
+
@media all and (min-width: 1025px) {
#menubar {
#menubar {
display: block;
display: block;
Line 551: Line 550:
}
}
</style>
</style>
-
 
<script type="text/javascript">
<script type="text/javascript">
-
function divLink(url) {
+
$(function() {
-
window.open(url);
+
$("*#scrolltotop").click(function() {
-
}
+
$("html,body").animate({
 +
scrollTop : 0
 +
});
 +
});
 +
});
</script>
</script>
Line 563: Line 565:
<body>
<body>
-
 
-
 
-
 
<div id="CB_top">
<div id="CB_top">
Line 580: Line 579:
<div id="CB_top_MENU">
<div id="CB_top_MENU">
<ul>
<ul>
-
<li class="HOME"><a href="#">HOME</a></li>
+
<li class="HOME"><a
 +
href="https://2012.igem.org/Team:CBNU-Korea">HOME</a></li>
<li class="TEAM"><a href="#">TEAM</a></li>
<li class="TEAM"><a href="#">TEAM</a></li>
<li class="PROJECT"><a href="#">PROJECT</a></li>
<li class="PROJECT"><a href="#">PROJECT</a></li>
Line 596: Line 596:
<div id="CB_content">
<div id="CB_content">
-
<div id="CB_content_slide">
 
-
<ul class="rslides">
 
-
<li><img
 
-
src="https://static.igem.org/mediawiki/2012/3/39/CBK_slide_001.png" /></li>
 
-
<li><img
 
-
src="https://static.igem.org/mediawiki/2012/6/69/CBK_slide_002.png" /></li>
 
-
<li><img
 
-
src="https://static.igem.org/mediawiki/2012/a/a0/CBK_slide_003.png" /></li>
 
-
<li><img
 
-
src="https://static.igem.org/mediawiki/2012/f/f6/CBK_slide_004.png" /></li>
 
-
</ul>
 
-
 
-
</div>
 
<div id="CB_subcontent">
<div id="CB_subcontent">
-
<div id="CB_sub_jm">
+
<div id="CB_sub_title">
-
<h2>+ What is BUGS</h2>
+
<h2>Minimal Genome Designer</h2>
 +
<h3>- Overview</h3>
</div>
</div>
-
<div id="CB_sub_cont">
+
<div id="CB_sub_menu">
-
<h3>Brick & Unique minimal Genome Software</h3>
+
<ul>
-
<p>
+
<li class="OVERVIEW"><a
-
We have developed two distinct software tools. <br> <br>
+
href="https://2012.igem.org/Team:CBNU-Korea/Project">01 +
-
The first tool, MG-designer, is functionally divided into designer
+
Overview</a></li>
-
and viewer. The viewer shows the information of genomes in both
+
<li class="BD"><a href="https://2012.igem.org/Team:CBNU-Korea/Project/BD/Overview">02 + Brick Designer</a></li>
-
linear and circular form. So it is easier for users to understand
+
<li class="MGD"><a href="#">03 + Minimal Genome Designer</a></li>
-
the characteristic of genomes. By the designer, user can design
+
<li id="li_sub" class="MGD_Overview"> - Overview</li>
-
minimal genomes by essential genes which are analogized by our team
+
<li id="li_sub" class="MGD_Method"> - Method</li>
-
in this year. The minimal genome can be designed depending on
+
<li id="li_sub" class="MGD_Analysis"> - Analysis</li>
-
characteristics of species by inserting the function of genes into
+
<li class="DOWNLOAD"><a href="https://2012.igem.org/Team:CBNU-Korea/Project/Download">04 + Download</a></li>
-
particular locations. <br> <br> With the second tool,
+
<li class="TUTORIAL"><a href="https://2012.igem.org/Team:CBNU-Korea/Project/Tutorial">05 + Tutorial</a></li>
-
brick-designer, user can design new bio-bricks. It is also able to
+
</ul>
-
synthesize bricks by using the bricks registered in partsregistry.
+
 
-
User can also utilize bricks he just designed. We tried to enhance
+
-
software potability by enabling the bricks to save as Genbank and
+
-
SBOL types. Brick also can be saved as picture file so that it is
+
-
helpful in the Wiki implementation.
+
-
</p>
+
</div>
</div>
-
</div>
+
<div id="CB_sub_main">
-
</div>
+
<div id="CB_sub_img"></div>
 +
<div id="CB_sub_cont">
 +
<h1>1. Overview</h1>
 +
<p>- 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.</p>
 +
<div id="scrolltotop"></div>
-
<div id="CB_map" onclick="divLink('http://goo.gl/maps/SH8VO');">
+
<h1>2. Feature</h1>
-
<h1>CBNU</h1>
+
<h2>2-1. BioBrick Data Download</h2>
-
<h2>
+
<p>- The registered BioBrick information needed for designing
-
Chungbuk National University<br> 52 Naesudong-ro, Heungdeok-gu,<br>
+
in this program, can be easily downloaded without being typed in.</p>
-
Cheongju Chungbuk, South-Korea<br> <br> +82 -43-261-2947<br>
+
<h2>2-2. Design</h2>
-
<br> iGEM.CBNU+2012@gmail.com
+
<p>- The user can arrange the BioBrick in any sequence they
-
</h2>
+
want. And if they want, the user can put a proper Prefix, Suffix
-
</div>
+
restriction enzyme site between the Bricks by the software.</p>
 +
<p>- By selecting the Plasmid Backbone and the restriction
 +
enzyme in sequence, the cloning will be done automatically.</p>
 +
<h2>2-3. Screen Shot</h2>
 +
<p>- The BioBrick that the user designed from the program is
 +
saved in image files to be readily used in Wiki or documents.</p>
 +
<h2>2-4. Various Storage Formats</h2>
 +
<p>- 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.</p>
 +
<div id="scrolltotop"></div>
-
<div id="CB_responsive">
+
<h1>3. The process of the program designing</h1>
-
<div id="CB_res_cont"></div>
+
<h2>3-1. Problem Recognition</h2>
-
<h1>Responsive Web</h1>
+
<p>- In many common laboratories today, there is a limit that
-
<h2>
+
the user themselves has to put in the BioBrick Data, and draw it
-
Responsive design is a method to building a single website that works
+
as an image after they finish the design. So we decided to develop
-
just as well on your mobile phones it does when you're sat at a desk.<br>
+
the designing a program that, based on BioBrick DataBase, directly
-
Just adjust your browser width now to see what we mean.<br> <br>
+
provide designing process with convenient additional functions as
-
Mobile phones, Tablet, Desktop(iE 9+, Chrome, Safari, FF etc)
+
well.</p>
-
</h2>
+
<h2>3-2. Requirement Checking</h2>
 +
<p>- We checked on other programs that many people are using
 +
nowadays, and analyzed the steps that are needed in designing.</p>
 +
<p>- 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.</p>
 +
<h2>3-2. Design</h2>
 +
<p>- Visual Studio 2010, 2012 (C#)</p>
 +
<p>- Windows 7</p>
 +
<p>- OleDB (MS OFFICE)</p>
 +
<p>- * When running the program, Microsoft Runtime is required.</p>
 +
<h2>3-2. Discussion and Feedback</h2>
 +
<p>- Our team members repeated testing the program, finding the
 +
errors and fixing the problems.</p>
 +
<div id="scrolltotop"></div>
 +
 
 +
<h1>4. Future Work</h1>
 +
<p>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.</p>
 +
<div id="scrolltotop"></div>
 +
</div>
 +
</div>
 +
</div>
</div>
</div>
Line 661: Line 714:
<div id="CB_footer_text"></div>
<div id="CB_footer_text"></div>
</div>
</div>
-
 
-
 
-
 
-
 
</body>
</body>
</html>
</html>

Revision as of 06:42, 26 September 2012

Minimal Genome 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.