View source for Team:SKLBC-DGSYZX/Project

<html>
<head>
<title>Home</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <title>Home</title>
        <link rel="shortcut icon" href="http://snapsvg.io/assets/favicon.ico?v=1">
        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
        <script type="text/javascript" async="" src="./Snap.svg - Home_files/ga.js"></script><script src="http://use.edgefonts.net/source-sans-pro:n2,i2,n3,i3,n4,i4,n6,i6,n7,i7,n9,i9:all.js"></script>
        <link rel="stylesheet" href="http://120.25.1.181:8080/www/gdsyzx/sklbc-gdsyzx/css/master.css">
        <script src="./Snap.svg - Home_files/snap.svg-min.js"></script>
        <script type="text/javascript">
    var _gaq = _gaq || [];
    _gaq.push(['_setAccount', 'UA-44948757-1']);
    _gaq.push(['_trackPageview']);

    (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
    })();
    
    function trackOutboundLink(link, category, action) { 
        try { 
        _gaq.push(['_trackEvent', category , action]); 
        } catch(err){}
         
        setTimeout(function() {
        document.location.href = link.href;
        }, 100);
    }
</script>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" dir="ltr"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<a href="http://120.25.1.181:8080/www/gdsyzx/sklbc-gdsyzx/index.html"></a></p>
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<link href="http://120.25.1.181:8080/www/gdsyzx/sklbc-gdsyzx/css/bootstrap.css" rel='stylesheet' type='text/css' />
<link rel="stylesheet" type="text/css" href="http://120.25.1.181:8080/www/gdsyzx/sklbc-gdsyzx/css/wiki.css">
<link href="http://120.25.1.181:8080/www/gdsyzx/sklbc-gdsyzx/css/teamwiki.css" rel='stylesheet' type='text/css' />
<link href="http://120.25.1.181:8080/www/gdsyzx/sklbc-gdsyzx/css/ionicons.css" rel='stylesheet' type='text/css' />
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<!-- Custom Theme files -->
<link href="http://120.25.1.181:8080/www/gdsyzx/sklbc-gdsyzx/css/style.css" rel='stylesheet' type='text/css' />
<!-- Custom Theme files -->
<!--webfont-->
<link href='http://fonts.useso.com/css?family=Quicksand:300,400,700' rel='stylesheet' type='text/css'>
<link href='http://fonts.useso.com/css?family=Exo+2:100,200,300,400,500,600,700,800,900' rel='stylesheet' type='text/css'>
<script type="text/javascript" src="http://120.25.1.181:8080/www/gdsyzx/sklbc-gdsyzx/js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="http://120.25.1.181:8080/www/gdsyzx/sklbc-gdsyzx/js/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        $("#goToTop").hide()//隐藏go to top按钮
        $(function(){
            $(window).scroll(function(){
                if($(this).scrollTop()>1){//当window的scrolltop距离大于1时，go to top按钮淡出，反之淡入
                    $("#goToTop").fadeIn();
                } else {
                    $("#goToTop").fadeOut();
                }
            });
        });
     

        // 给go to top按钮一个点击事件
        $("#goToTop a").click(function(){
            $("html,body").animate({scrollTop:0},800);//点击go to top按钮时，以800的速度回到顶部，这里的800可以根据你的需求修改
            return false;
        });
    });
    </script>
<!------ Light Box ------>
<link rel="stylesheet" href="http://120.25.1.181:8080/www/gdsyzx/sklbc-gdsyzx/css/swipebox.css">
<script src="http://120.25.1.181:8080/www/gdsyzx/sklbc-gdsyzx/js/jquery.swipebox.min.js"></script> 
    <script type="text/javascript">
		jQuery(function($) {
			$(".swipebox").swipebox();
		});
	</script>
<!------ Eng Light Box ------>	   
<!-- Prettify -->
<link href="http://120.25.1.181:8080/www/gdsyzx/sklbc-gdsyzx/css/owl.carousel.css" rel="stylesheet">
<script src="http://120.25.1.181:8080/www/gdsyzx/sklbc-gdsyzx/js/owl.carousel.js"></script>
	<script>
		$(document).ready(function() {
		$("#owl-demo3").owlCarousel({
			items : 4,
			lazyLoad : true,
			autoPlay : true,
			navigation: false,
			pagination: false,
		 });
		});
	</script>
<!----- //End-Share-instantly-slider---->
<!----font-Awesome----->
<link rel="stylesheet" href="http://120.25.1.181:8080/www/gdsyzx/sklbc-gdsyzx/fonts/css/font-awesome.min.css">
<!----font-Awesome----->					
</head>

<body style="background-color:white">
<header id="header" style="height: inherit;">
    <div class="wrap">
        <a href="./Snap.svg - Home_files/Snap.svg - Home.html" class="logo">
            <img src="http://120.25.1.181:8080/www/gdsyzx/sklbc-gdsyzx/images/synn.jpg" alt="">
            <span class="header">Synsketch</span>
        </a>
        <nav>
            
            <a href="https://2015.igem.org/Team:SKLBC-DGSYZX" class=" selected">Home</a>
            
            <a href="https://2015.igem.org/Team:SKLBC-DGSYZX/Project" class="">Project</a>
            
            <a href="https://2015.igem.org/Team:SKLBC-DGSYZX/Notebook" class="">Notebook</a>
            
            <a href="https://2015.igem.org/Team:SKLBC-DGSYZX/Attributions" class="">Attributions</a>
            
            <a href="https://2015.igem.org/Team:SKLBC-DGSYZX/Collaborations" class="">Collaborations</a>
            
            <a href="https://2015.igem.org/Team:SKLBC-DGSYZX/Pratices" class="">Human Pratices</a>
            
            <a href="https://2015.igem.org/Team:SKLBC-DGSYZX/Parts" class="">Parts</a>
            
            <a href="https://2015.igem.org/Team:SKLBC-DGSYZX/Safety" class="">Safety</a>
            
            <a href="https://2015.igem.org/Team:SKLBC-DGSYZX/Software" class="">Software</a>
            
            <a href="https://2015.igem.org/Team:SKLBC-DGSYZX/Entrepreneurship" class="">Entrepreneurship</a>
            
            <a href="https://2015.igem.org/Team:SKLBC-DGSYZX/Team" class="">Team</a>
            
            <a href="https://2015.igem.org/Team:SKLBC-DGSYZX/Medals" class="">Medals and Prizes</a>
            
            <a href="https://2015.igem.org/Team:SKLBC-DGSYZX/Design" class="">Design</a>
            
            <a href="https://2015.igem.org/Team:SKLBC-DGSYZX/Measurement" class="">Measurement</a>
            
            <a href="https://2015.igem.org/Team:SKLBC-DGSYZX/Modeling" class="">Modeling</a>
        </nav>
    </div>
</header>
<br><br>
<div class="header_bottom about">
	<div>
		<h1 style="color:white"> Our Project</a></h1> 
	</div>
</div>


<div class="about_box3 title text-center">
  <div> 
      <div class="grid_3">
        <img src="http://120.25.1.181:8080/www/gdsyzx/sklbc-gdsyzx/images/gdsy.png" style="width: 100%;max-width: 1000px;" class="img-gdsy" alt=""/>
    </div>
    <div class="clearfix"> </div>
     </div>
  </div>
</div>



<div class="about_box3 title" style="background-color:#ccffff" id="background">
   <h3 class="m_1"><span >Description</span></h3>
   <div class="container"> 
       <div class="grid_3">
         <p style="margin-top:30px;"> Genetic circuits play a significant role in IGEM experiment. However, the diversity in styles of circuits not only hinders learners of synthetic biology, but also costs iGEMers lots of time to complete a standardized genetic circuits by using the current graphic design tool. After collaborating with and learning from university wet teams, we get the inspiration to develop a cloud-based tool-- Synsketch-- to design a standardized genetic circuit easily and efficiently,which is easy to learn, modify and share, therefore helping iGEMers to save lots of time creating a standardized genetic circuit. With other additional functions like personal account, multi-language interface and well-classified tags, Synsketch is able to inspire scientific curiosity among the public. We further develop it into a free innovative educational tool for personalized learning in synthetic biology. As a result, with combination of education and business model, we manage to create a genetic circuits design tool and bring iGEM to everyone and everywhere. </p>
      </div>
      <div class="clearfix"> </div>
   </div>
</div>
<div class="about_box3 title" style="background-color:#ff6699" id="background">
   <h3 class="m_1"><span >Background</span></h3>
   <div class="container"> 
       <div class="grid_3">
         <p>We start our exploration to IGEM and create a synthetically part named Osa-miR-397b precursor. In order to get better understanding of the part, we collaborate with other university students to do some relevant experiences and collect more information about parts and genetic circuits on the Internet. However, we have encountered some difficulties understanding other genetic circuits in various styles about experiment principle.</p>
         <p>After collaborating with and learning from university students,we have found that they also have the same problems.After discussing with university students from Sunyatsen University and South China University of Technology, we have found that they also have the same problems. And we later found out that it took quite much time for iGEMers to design a genetic circuit, so we were inspired to develop a tool to design a standardized genetic circuit easily and efficiently.</p>
      </div>
      <div class="clearfix"> </div>
   </div>
</div>
<div class="about_box3 title" style="background-color:#66cccc">
   <h3 class="m_1"><span>What is Synsketch?</span></h3>
   <div class="container"> 
       <div class="grid_3">
        <p style="margin-top:30px;">Synsketch is cloud-based software tool developed by SKLBC-GDSYZX. It has three main functions relevant to genetic circuits: designing and editing, saving and sharing, learning more about synthetically parts involved. These three main functions may help synthetic biology lovers and iGEMers design a standardized genetic circuit easily and efficiently. Synsketch is a tool that is really easy to learn and easy to use. With educational meaning and commercial potential, Synsketch is likely to set a new milestone in the learning of synthetic biology as well as the standardization of iGEM competitions and to arise high public interest of iGEM.</p>
        <img src="http://120.25.1.181:8080/www/gdsyzx/sklbc-gdsyzx/images/luntan.png" style="display: block;margin-left: auto;margin-right: auto;margin-top: 40px;max-width: 850px;" class="img-gdsy" alt=""/>
      </div>
      <div class="clearfix"> </div>
   </div>
</div>
<div class="about_box3 title" style="background-color:#ccffff" id="syn">
   <h3 class="m_1"><span>How to use Synsketch?</span></h3>
   <div class="container"> 
       <div class="grid_3 syn">
       	 <p style="margin-top:30px;">Synsketch is really easy to use. If a person wants to use Synsketch to design a genetic circuit, he doesn’t need to be technical. He just need to click the element e.g. PBS and then drag it to a proper place. After combining all the elements in a picture, a genetic circuit is finished. Besides, for those who begin to use Synsketch for the first time, we have prepared an illustrated course to help them understand Synsketch quickly.</p>
       	 <p>After finishing the design of a genetic circuit, users can log in and save it into their personal accounts. Moreover, a QR-code linking to the wechat account will be generated. Users can simply scan the QR-code with phone and directly put the genetic circuit into their wechat accounts, which makes it easier for them to share the genetic circuit they just finish with friends through wechat, the most famous social network with more than 549 million monthly active users.</p>
       	 <p>And the most educative part about Synsketch is that all the genetic circuits designed by Synsktech include a direct link to the iGEM official data base about the information of synthetically parts. A brief introduction will emerge if the mouse moves over a part on the genetic circuit. And users can view the detailed information about it by double-clicking the part. Such function save lots of time for users to look for information about all parts involved in a genetic circuit one by one. And the data base, the iGEM official website, is of great authentic credibility.</p>
         <img src="http://120.25.1.181:8080/www/gdsyzx/sklbc-gdsyzx/images/jietu.png" style="display: block;margin-left: auto;margin-right: auto;margin-top: 40px;max-width: 850px;" class="img-gdsy" alt=""/>
      </div>
      <div class="clearfix"> </div>
   </div>
</div>
<div class="about_box3 title" id="website" style="background-color:#ff6699">
   <h3 class="m_1"><span>Other functions</span></h3>
   <div class="container"> 
       <div class="grid_3 syn">
       	 <p style="margin-top:30px;">In addition to the functions of designing genetic circuits,Synsketch also has many other functions which are user-friendly:</p>
         <li class="promble">Personal account----manage your own genetic circuits</li>
         <li class="promble">News pushing----know current news about synthetic biology</li>
         <li class="promble">Resource recommendation----gain some knowledge</li>
         <li class="promble">Helpful tags----help manage and classify</li>
         <li class="promble">Item analysis----broaden your horizon</li>
         <li class="promble">Multiple interactions----iGEM whenever and wherever</li>
         <img src="http://120.25.1.181:8080/www/gdsyzx/sklbc-gdsyzx/images/jietu2.png" style="display: block;margin-left: auto;margin-right: auto;margin-top: 40px;max-width: 850px;" class="img-gdsy" alt=""/>
      </div>
      <div class="clearfix"> </div>
   </div>
</div>
<div class="about_box3 title" id="forum" style="background-color:#66cccc">
   <h3 class="m_1"><span>Why Synsketch?</span></h3>
   <div class="container"> 
       <div class="grid_3 syn">
       	<p>Synsketch is a tool of great standardization, adaption and interaction. We create Synsketch on the purpose of using and supporting existing synthetic biology standards. Synsketch provides a standardized model for people to design genetic circuits both quickly and efficiently. If Synsketch is successfully promoted among iGEM community, we will get unified visual effect. That will strengthen synthetic biology standards. As for synthetic biology platforms, we build up Synsketch community, through with Synthetic biology lovers can show their discoveries as well as communicate about their problems. And the most educative part about Synsketch is that all the genetic circuits designed by Synsktech include a direct link to the iGEM official data base about the information of synthetically parts. With such function, user will save lots of time to look for information about all parts involved in a genetic circuit one by one. And the data base, the iGEM official website, is of great authentic credibility. In conclusion, Synsketch effectively uses and supports exist synthetic biology standards and platforms.</p>
         <img src="http://120.25.1.181:8080/www/gdsyzx/sklbc-gdsyzx/images/jietu3.png" style="display: block;margin-left: auto;margin-right: auto;margin-top: 40px;max-width: 850px;" class="img-gdsy" alt=""/>
       </div>
      <div class="clearfix"> </div>
   </div>
</div>
<div class="about_box3 title" id="forum" style="background-color:#ccffff">
   <h3 class="m_1"><span>Synsketch promotion</span></h3>
   <div class="container"> 
       <div class="grid_3 syn">
        <p>We successfully held several offline promotion activities for example, Science Festival in Guangdong Experimental High School (other details various activities on notebook) and understood the needs and problems of the target customers. These valuable experiences helped us perfect our project as well as promote synthetic biology. We also built up a viable business model and have got 100,000RMB from our sponsors.</p>
       </div>
      <div class="clearfix"> </div>
   </div>
</div><div class="footer">
  <div>
        <div class="copy">
            <p>Copyright &copy; 2015 SKLBC-GDSYZX.  All rights reserved.</p>
      </div>
  </div>
</div>
<div id="goToTop"><a href="#">top</a></div>
</body>
</html>