Difference between revisions of "Team:SKLBC-DGSYZX/Design"

(Prototype team page)
 
Line 1: Line 1:
{{SKLBC-DGSYZX}}
 
 
<html>
 
<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']);
  
<h2>Design</h2>
+
    (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();
 +
                }
 +
            });
 +
        });
 +
   
  
<p>
+
        // 给go to top按钮一个点击事件
By talking about your design work on this page, there is one medal criterion that you can attempt to meet, and one award that you can apply for. If your team is going for a gold medal by building a functional prototype, you should tell us what you did on this page. If you are going for the <a href="https://2015.igem.org/Judging/Awards#SpecialPrizes">Applied Design award</a>, you should also complete this page and tell us what you did.  
+
        $("#goToTop a").click(function(){
</p>
+
            $("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>
  
<div class="highlightBox">
+
<body style="background-color:white">
<h4>Note</h4>
+
<header id="header" style="height: inherit;">
<p>In order to be considered for the <a href="https://2015.igem.org/Judging/Awards#SpecialPrizes">Best Applied Design award</a> and/or the <a href="https://2015.igem.org/Judging/Awards#Medals">functional prototype gold medal criterion</a>, you must fill out this page.</p>
+
    <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>
 +
        </nav>
 +
    </div>
 +
</header>
 +
<br><br>
 +
<div class="header_bottom about">
 +
<div class="container">
 +
<h1 style="color:white">design</a></h1>
 +
</div>
 
</div>
 
</div>
  
<p>This is a prize for the team that has developed a synthetic biology product to solve a real world problem in the most elegant way. The students will have considered how well the product addresses the problem versus other potential solutions, how the product integrates or disrupts other products and processes, and how its lifecycle can more broadly impact our lives and environments in positive and negative ways.</p>
 
  
<p>
 
If you are working on art and design as your main project, please join the art and design track. If you are integrating art and design into the core of your main project, please apply for the award by completing this page.
 
</p>
 
  
 +
<div class="about_box3 title" style="background-color:#ccffff" id="background">
 +
  <h3 class="m_1"><span>Software design</span></h3>
 +
  <div class="container">
 +
      <div class="grid_3">
 +
        <p>The group for programming takes charge of our website and forum’s construction, administration and maintenance. They use JavaScript and GoJS to build up the skeleton of our project and the carry on the further improvement of the project.</p>
 +
      </div>
 +
      <div class="clearfix"> </div>
 +
  </div>
 
</div>
 
</div>
 
+
<div class="about_box3 title" style="background-color:#ff6699" id="background">
 +
  <h3 class="m_1"><span>Visual effect</span></h3>
 +
  <div class="container">
 +
      <div class="grid_3">
 +
        <p>The group for design is in charge of the whole design process of the website, from the size of the words and the color of the page, to the design of the team mascot and poster. It works as the artist to make sure that all work is on display at the best visual effect</p>
 +
      </div>
 +
      <div class="clearfix"> </div>
 +
  </div>
 +
</div>
 +
<div class="about_box3 title" style="background-color:#66cccc">
 +
  <h3 class="m_1"><span>Tutorial</span></h3>
 +
  <div class="container">
 +
      <div class="grid_3">
 +
        <p>In order to make it easier from learner to master the use of Synsketch, we design a tutorial for the users. Actually, it’s a brilliant idea which helps us learn synthetic biology easily and save time at the same time. With the help of tutorial, users can learn how to use the software tool within 15mins, only the time to make a cup of coffee. And teachers will also have materials to expand the usage of Synsketch among high school and university students who show an interest in synthetic biology and who want to participate in iGEM competitions.</p>
 +
      </div>
 +
      <div class="clearfix"> </div>
 +
  </div>
 +
</div>
 +
<div class="about_box3 title" style="background-color:#ccffff" id="syn">
 +
  <h3 class="m_1"><span>Step4</span></h3>
 +
  <div class="container">
 +
      <div class="grid_3 syn">
 +
        <h1>pitched our idea to investors and received money</h1>
 +
      <p >We have received 80,000RMB from Guangzhou APP Education Information Consultancy Company and 20,000RMB from Education International Cooperation Group.</p>      </div>
 +
      <div class="clearfix"> </div>
 +
  </div>
 +
</div>
 +
<div class="footer">
 +
  <div class="container">
 +
        <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>
 
</html>

Revision as of 06:02, 17 September 2015

Home Home



design

Software design

The group for programming takes charge of our website and forum’s construction, administration and maintenance. They use JavaScript and GoJS to build up the skeleton of our project and the carry on the further improvement of the project.

Visual effect

The group for design is in charge of the whole design process of the website, from the size of the words and the color of the page, to the design of the team mascot and poster. It works as the artist to make sure that all work is on display at the best visual effect

Tutorial

In order to make it easier from learner to master the use of Synsketch, we design a tutorial for the users. Actually, it’s a brilliant idea which helps us learn synthetic biology easily and save time at the same time. With the help of tutorial, users can learn how to use the software tool within 15mins, only the time to make a cup of coffee. And teachers will also have materials to expand the usage of Synsketch among high school and university students who show an interest in synthetic biology and who want to participate in iGEM competitions.

Step4

pitched our idea to investors and received money

We have received 80,000RMB from Guangzhou APP Education Information Consultancy Company and 20,000RMB from Education International Cooperation Group.