Team:Wellesley Desyne

From 2013.igem.org

(Difference between revisions)
 
(163 intermediate revisions not shown)
Line 1: Line 1:
 +
{{Team:Wellesley_Desyne/css/wp_app.css}}
<html>
<html>
<head>
<head>
<title>Wellesley HCI iGEM Team: Welcome</title>  
<title>Wellesley HCI iGEM Team: Welcome</title>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
-
<script src="http://cdn.jquerytools.org/1.2.5/full/jquery.tools.min.js?foo"></script>
+
<meta charset="utf-8">
 +
<meta name="viewport" content="width=device-width">
 +
<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
 +
<script src="//code.jquery.com/jquery-latest.min.js"></script>
 +
<script src="//unslider.com/unslider.min.js"></script>
<style type="text/css">
<style type="text/css">
-
 
+
.banner { position: relative; overflow: auto; }
-
/*hide default igem banner and reformat style into blank slate*/
+
     .banner li { list-style: none; }
-
#globalWrapper {width: 100%;}
+
        .banner ul li { float: left; }
-
#top-section {width: 100%; height:30px; border:none;}
+
        .banner ul li img {max-width: 970px;}
-
#p-logo {display:none;}
+
-
#search-controls {display:none;}
+
-
#menubar a {color:#000000; background-color:transparent;}
+
-
#menubar a:hover{text-decoration:none; color:#0090FF; background-color:transparent;}
+
-
.left-menu a:hover{background-color:transparent; margin:5px 0px 0px 0px; padding:0; background: transparent;}
+
-
.left-menu li a:hover{background-color:transparent; margin:0; padding:0; background: transparent;}
+
-
.right-menu ul li a {background-color:transparent; background: transparent;}
+
-
.printfooter {display:none; background-color:transparent;}
+
-
#footer-box {border:none; background-color:transparent;}
+
-
#catlinks {display:none; background-color:transparent;}
+
-
.firstHeading {display:none; background-color:transparent;}
+
-
#content {width: 100%; border:none; background-color:transparent;}
+
-
#bodyContent {border:none;}
+
-
 
+
-
/*actual content styles*/
+
-
body {width: 900px; margin:auto;}
+
-
 
+
-
#bu-wellesley_wiki_content {height:auto; line-height:100%;}
+
-
/*#bu-wellesley_wiki_content a {color:#69d01d;}*/
+
-
#bu-wellesley_wiki_content a:hover {text-decoration:none; color:#3d3f3c;}
+
-
 
+
-
.navbar li {color: #transparent;}
+
-
.navbar li a {color: #ffffff;}
+
-
.navbar li a:hover {background:#0090FF; color: #ffffff;}
+
-
 
+
-
/*only use for current page content header (i.e. Team, G-nomeSurferPro, etc)*/
+
-
H6 {
+
-
      font-family: Helvetica;
+
-
      font-size:32pt;
+
-
      text-transform: uppercase;
+
-
      text-decoration: none;
+
-
      /*text-align: center;*/
+
-
      color: #272829;
+
-
      margin:0 !important;
+
-
      padding-top:5px !important;
+
-
    }
+
-
 
+
-
H3 {
+
-
      font-family: Helvetica;
+
-
      text-decoration: none;
+
-
      text-align: left;
+
-
          line-height:120%;
+
-
      /*color: #870203;*/
+
-
      font-size: 10pt;
+
-
      font-weight:normal;
+
-
    }
+
-
 
+
-
/*Page content styles (e.g. welcome, project images)*/
+
-
#comp {
+
-
    float:left;
+
-
    width:400px;
+
-
    height:275px;
+
-
}
+
-
#compimg {
+
-
    float:left;
+
-
    width:470px;
+
-
    margin:0 30px 0 0;
+
-
    background-color:#ebebeb;
+
-
}
+
-
 
+
-
/*Project images with rollover*/
+
-
.project {
+
-
background-color:#e5e3e7;
+
-
width:290px; height:180px;
+
-
overflow:hidden;
+
-
float:left;
+
-
margin:20px 15px 0 0;
+
-
position:relative;
+
-
}
+
-
.projectBar { width:100%; height:60px; position:absolute; color:white; overflow:hidden;}
+
-
.projectName { text-align:right; padding:15px 20px; }
+
-
.projectName img { width:auto; height:16px; display:inline-block; }
+
-
.projectAbout {
+
-
background-image:url('http://cs.wellesley.edu/~hcilab/iGEM2012/images/arrow.png');
+
-
background-repeat:no-repeat;
+
-
background-position:left center;
+
-
background-color:rgba(0,0,0,0.5);
+
-
background-clip:border-box;
+
-
font-size:12px;
+
-
height:auto;
+
-
margin-top:-50px;
+
-
padding:5px 5px 5px 50px; /*50px padding makes room for arrow on left*/
+
-
-webkit-transition-duration:0.5s; -moz-transition-duration:0.5s;
+
-
}
+
-
.project:hover .projectAbout { margin-top:10px; }
+
-
.projectBar > a:link, .projectBar > a:visited, .projectBar > a:hover { color:inherit; }
+
-
 
+
-
/*<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+
-
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+
-
<html xmlns="http://www.w3.org/1999/xhtml">*/
+
-
 
+
-
/* NON-WEBSAFE FONTS */
+
-
/*@font-face {
+
-
font-family: 'Caviar Dreams';
+
-
src: url('../fonts/CaviarDreams.ttf') format('truetype');
+
-
}*/
+
-
 
+
-
/* MAIN STYLE DEFINITIONS */
+
-
a{
+
-
color:#870203;
+
-
-webkit-transition-duration:0.3s;
+
-
-moz-transition-duration:0.3s;
+
-
-o-transition-duration:0.3s;
+
-
}
+
-
 
+
-
a:hover {
+
-
color:#0090FF;
+
-
}
+
-
 
+
-
a:visited{
+
-
color:#870203;
+
-
}
+
-
 
+
-
td
+
-
{
+
-
font-family: Helvetica;
+
-
font-size: 10pt;
+
-
vertical-align: top;
+
-
text-align: left;
+
-
padding-right: 10px;
+
-
}
+
-
 
+
-
tr
+
-
{
+
-
vertical-align: top;
+
-
}
+
-
 
+
-
H1 {
+
-
     font-family: Helvetica;
+
-
    text-transform: uppercase;
+
-
    color: #3d3f3c;
+
-
    text-align: left;
+
-
    }
+
-
 
+
-
 
+
-
H4 {
+
-
    font-family: Helvetica;
+
-
    text-transform: uppercase;
+
-
    color: #3d3f3c;
+
-
    text-align: left;
+
-
    }
+
-
 
+
-
/* CONTENT HEADING STYLES - overrides some main.css styling */
+
-
 
+
-
H6 {
+
-
font-family:'Caviar Dreams';
+
-
font-size:30px;
+
-
font-weight:500;
+
-
text-align:left;
+
-
text-transform:uppercase;
+
-
color: #3d3f3c;
+
-
border-bottom:1px solid #0090FF;
+
-
padding-bottom:10px;
+
-
margin:15px 0;
+
-
}
+
-
 
+
-
H1, H3 {
+
-
font-family:'Source Sans Pro';
+
-
font-weight:600;
+
-
text-transform:uppercase;
+
-
}
+
-
 
+
-
H1 {
+
-
font-size:20px;
+
-
border:none;
+
-
}
+
-
 
+
-
img.headshot {
+
-
width: 100px;
+
-
height: auto;
+
-
vertical-align: text-top;
+
-
}
+
-
 
+
-
 
+
-
 
+
-
body {
+
-
background:#fff;
+
-
font-family: Helvetica;
+
-
}
+
-
 
+
-
content {
+
-
background: transparent;
+
-
}
+
-
 
+
-
#tracking_nav
+
-
{
+
-
margin: 0px 0px 0px 950px;
+
-
position: fixed;
+
-
color:#bababa;
+
-
border: 1px solid #3d3f3c;
+
-
background:#3d3f3c;
+
-
font-size: 16pt;
+
-
padding: 5px;
+
-
line-height: 120%;
+
-
}
+
-
 
+
-
#tracking_nav a { color:#ffffff; text-transform: lowercase;font-size: 16pt;}
+
-
#tracking_nav a:hover {background:#bababa;}
+
-
 
+
-
#parts_table
+
-
{
+
-
border: 1px solid #870203;
+
-
border-collapse: collapse;
+
-
width: 70%;
+
-
margin: auto;
+
-
}
+
-
 
+
-
#parts_table td
+
-
{
+
-
text-align: center;
+
-
margin: 5px;
+
-
border: 1px solid #870203;
+
-
+
-
}
+
-
 
+
-
#parts_table th
+
-
{
+
-
background-color: #bababa;
+
-
border: 1px solid #870203;
+
-
color: #ffffff;
+
-
}
+
-
 
+
-
.table_part
+
-
{
+
-
vertical-align: middle;
+
-
}
+
-
 
+
-
/* HEADER STYLES: banner, navbar, etc. */
+
-
#banner { width:500px; display:block; float:left; }
+
-
#banner img { width:100%; }
+
-
 
+
-
ul#nav {
+
-
width:675px;
+
-
margin:0 0 0 325px;
+
-
position:relative;
+
-
}
+
-
 
+
-
#nav li {
+
-
color: #bbb;
+
-
background-color:none;
+
-
margin: 0 50px 0 0;
+
-
float: left;
+
-
position: relative;
+
-
list-style: none;
+
-
text-transform:uppercase;
+
-
}
+
-
#nav li:last-child { margin:0; }
+
-
 
+
-
/* main level link */
+
-
#nav a {
+
-
font-family:'Source Sans Pro', sans-serif;
+
-
font-size:10pt;
+
-
font-weight:500;
+
-
line-height:110%;
+
-
color: inherit;
+
-
text-decoration: none;
+
-
display: block;
+
-
padding: 0 0 0 5px;
+
-
margin: 0;
+
-
}
+
-
 
+
-
ul#nav > li > a {
+
-
line-height:12px;
+
-
border-left:solid 2px #0090FF;
+
-
padding:0 0 0 3px;
+
-
}
+
-
 
+
-
#nav a:hover {
+
-
/*background-color: #0090FF;
+
-
color: #ffffff;*/
+
-
}
+
-
 
+
-
/* main level link hover */
+
-
#nav .current a, #nav li:hover > a {
+
-
color: #000;
+
-
border-color:#0090FF;
+
-
}
+
-
 
+
-
/* sub levels link hover */
+
-
#nav ul li:hover a, #nav li:hover li a {
+
-
border: none;
+
-
/*background-color: #FA9D1C;*/
+
-
color:#000;
+
-
}
+
-
 
+
-
#nav ul a:hover {
+
-
color: #0090FF !important;
+
-
/*background: #fff url(img/gradient.png) repeat-x 0 -100px !important;
+
-
text-shadow: 0 1px 1px rgba(0,0,0, .1);*/
+
-
}
+
-
 
+
-
 
+
-
/* dropdown */
+
-
#nav li:hover > ul {
+
-
/*display: block;*/
+
-
opacity:1;
+
-
margin:0;
+
-
background-color: none;
+
-
z-index:0;
+
-
}
+
-
 
+
-
/* level 2 list */
+
-
#nav ul {
+
-
/*display: none;*/
+
-
opacity:0;
+
-
margin: 20px 0 0 0;
+
-
padding: 7px 0 0 0;
+
-
width: 205px;
+
-
position: absolute;
+
-
left: 0;
+
-
z-index:-1;
+
-
-webkit-transition-duration:0.5s;
+
-
-moz-transition-duration:0.5s;
+
-
-o-transition-duration:0.5s;
+
-
}
+
-
#nav ul li {
+
-
float: none;
+
-
margin: 0;
+
-
padding: 0;
+
-
}
+
-
 
+
-
#nav ul a {
+
-
font-weight: normal;
+
-
/*text-shadow: 0 1px 0 #fff;*/
+
-
}
+
-
 
+
-
/* clearfix */
+
-
#nav:after {
+
-
content: ".";
+
-
display: block;
+
-
clear: both;
+
-
visibility: hidden;
+
-
line-height: 0;
+
-
height: 0;
+
-
}
+
-
#nav {
+
-
display: inline-block;
+
-
}
+
-
html[xmlns] #nav {
+
-
display: block;
+
-
}
+
-
+
-
* html #nav {
+
-
height: 1%;
+
-
}
+
-
 
+
-
/* pinterest like photo grid for social page*/
+
-
 
+
-
/*
+
-
body {
+
-
background: url(http://subtlepatterns.com/patterns/scribble_light.png) ;
+
-
}
+
-
*/
+
-
 
+
-
#wrapper {
+
-
width: 90%;
+
-
max-width: 1100px;
+
-
min-width: 800px;
+
-
margin: 50px auto;
+
-
}
+
-
 
+
-
#columns {
+
-
-webkit-column-count: 3;
+
-
-webkit-column-gap: 10px;
+
-
-webkit-column-fill: auto;
+
-
-moz-column-count: 3;
+
-
-moz-column-gap: 10px;
+
-
-moz-column-fill: auto;
+
-
column-count: 3;
+
-
column-gap: 15px;
+
-
column-fill: auto;
+
-
}
+
-
 
+
-
.pin {
+
-
display: inline-block;
+
-
background: #FEFEFE;
+
-
border: 2px solid #FAFAFA;
+
-
box-shadow: 0 1px 2px rgba(34, 25, 25, 0.4);
+
-
margin: 0 2px 15px;
+
-
-webkit-column-break-inside: avoid;
+
-
-moz-column-break-inside: avoid;
+
-
column-break-inside: avoid;
+
-
padding: 15px;
+
-
padding-bottom: 5px;
+
-
background: -webkit-linear-gradient(45deg, #FFF, #F9F9F9);
+
-
opacity: 1;
+
-
+
-
-webkit-transition: all .2s ease;
+
-
-moz-transition: all .2s ease;
+
-
-o-transition: all .2s ease;
+
-
transition: all .2s ease;
+
-
}
+
-
 
+
-
.pin img {
+
-
width: 100%;
+
-
border-bottom: 1px solid #ccc;
+
-
padding-bottom: 15px;
+
-
margin-bottom: 5px;
+
-
}
+
-
 
+
-
.pin p {
+
-
font: 12px/18px Arial, sans-serif;
+
-
color: #333;
+
-
margin: 0;
+
-
}
+
-
 
+
-
@media (min-width: 960px) {
+
-
#columns {
+
-
-webkit-column-count: 4;
+
-
-moz-column-count: 4;
+
-
column-count: 4;
+
-
}
+
-
}
+
-
 
+
-
@media (min-width: 1100px) {
+
-
#columns {
+
-
-webkit-column-count: 5;
+
-
-moz-column-count: 5;
+
-
column-count: 5;
+
-
}
+
-
}
+
-
 
+
-
#columns:hover .pin:not(:hover) {
+
-
opacity: 0.4;
+
-
}
+
-
 
+
-
 
+
</style>
</style>
-
 
+
<body>
-
 
+
<nav class="top-bar" style="padding-top: 0px; margin-top: 0px;">
-
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600' rel='stylesheet' type='text/css'>
+
<ul class="title-area">
-
 
+
<!-- Title Area -->
-
<style type="text/css">@import "http://cs.wellesley.edu/~hcilab/iGEM_wiki/css/videobox.css";</style>
+
<li class="name">
-
 
+
<h1><a href="#">WHCI</a></h1>
-
</head>
+
</li>
-
<body class="basiclayout">
+
<!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
-
<div id="bu-wellesley_wiki_content">
+
<li class="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a></li>
-
 
+
-
 
+
-
<a href="https://2013.igem.org/Main_Page"><img src="https://static.igem.org/mediawiki/2012/5/50/2013iGEM_logo.png" width="75px" style="display:block; float:left;"></a>
+
-
 
+
-
<a href="https://2013.igem.org/Team:Wellesley_Desyne"><img src="https://static.igem.org/mediawiki/igem.org/4/49/Titleimage.png" width="200px" style="display:block; float:left;"></a>
+
-
 
+
-
 
+
-
<!--Start NavBar-->
+
-
<ul id="nav">  
+
-
    <li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Team">Team</a>
+
-
        <ul>
+
-
    <li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Team">Team Members</a></li>
+
-
    <li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Notebook">Notebook</a></li>  
+
-
            <li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Acknowledgement">Acknowledgement</a></li>
+
-
    <li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Tips_Tricks">Tips & Tricks</a></li>
+
-
    <li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Social">Fun</a></li>
+
</ul>
</ul>
-
    </li>  
+
<section class="top-bar-section">
-
    <li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Project_Overview">Project</a>
+
<!-- Left Nav Section -->
-
        <ul>  
+
<ul class="left">
-
    <li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Project_Overview">Project Overview</a></li>  
+
<li class="divider"></li>
-
            <li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Eugenie">Eugenie</a></li>  
+
<li class="has-dropdown"><a href="#">TEAM</a>
-
            <li><a href="https://2013.igem.org/Team:Wellesley_Desyne/zMol_zTree">zMol_zTree</a></li>  
+
<ul class="dropdown">
-
            <li><a href="https://2013.igem.org/Team:Wellesley_Desyne/BAC">BAC to the Future</a></li>  
+
<li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Team">Team Members</a></li>
-
            <li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Downloads_Tutorials">Downloads & Tutorials</a></li>  
+
<li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Notebook">Notebook</a></li>
-
        </ul>
+
<li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Acknowledgement">Acknowledgement</a></li>
-
    </li>
+
<li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Tips_Tricks">Tips and Tricks</a></li>
-
    <li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Human_Practices">Human Practices</a>  
+
<li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Social">Fun</a></li>
-
<ul>  
+
</ul>
-
    <li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Human_Practices">User Research</a></li>  
+
</li>
-
            <li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Methodology">Methodology</a></li>  
+
<li class="divider"></li>
-
    <li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Safety">Safety</a></li>  
+
<li class="has-dropdown"><a href="#">PROJECT</a>
-
            <li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Outreach">Outreach</a></li>
+
<ul class="dropdown">
-
</ul>
+
<li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Project_Overview">Overview</a></li>
-
    </li>
+
<li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Eugenie">Eugenie</a></li>
-
    <li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Gold">Medal Fulfillment</a></li>
+
<li><a href="https://2013.igem.org/Team:Wellesley_Desyne/zTree">zTree</a></li>
-
</ul>
+
<li><a href="https://2013.igem.org/Team:Wellesley_Desyne/BAC">Bac to the Future</a></li>
 +
<li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Downloads_Tutorials">Downloads & Tutorials</a></li>
 +
</ul>
 +
</li>
 +
<li class="divider"></li>
 +
<li class="has-dropdown"><a href="#">HUMAN PRACTICES</a>
 +
<ul class="dropdown">
 +
<li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Human_Practices">User Research</a></li>
 +
<li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Methodology">Methodology</a></li>
 +
<li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Safety">Safety</a></li>
 +
<li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Outreach">Outreach</a></li>
 +
</ul>
 +
</li>
 +
<li class="divider"></li>
 +
<li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Gold">MEDAL FULFILLMENT</a></li>
 +
</ul>
 +
<!-- Right Nav Section -->
 +
<ul class="right">
 +
<li class="divider hide-for-small"></li>
 +
<li><a href="https://2013.igem.org/Main_Page"><img src="https://static.igem.org/mediawiki/2013/e/e0/Whci_igem_logo.png"></a>
 +
</li>
 +
<li class="divider"></li>
 +
</ul>
 +
</section>
 +
</nav>
 +
<header>
 +
<div id="header-container">
 +
<div class="row">
 +
<div class="large-12 columns">
 +
<a href="https://2013.igem.org/Team:Wellesley_Desyne" class="header-link"><h2><img src="https://static.igem.org/mediawiki/2013/0/03/Wellesley_logo.png">Wellesley HCI iGEM 2013</h2></a>
 +
</div>
 +
</div>
 +
</div>
 +
</header>
 +
<div class="row">
 +
<div class="large-12 columns">
 +
        <div class="banner">
 +
            <ul>
 +
                <li><img src="https://static.igem.org/mediawiki/2013/d/d7/Wellesley_slideshow_iGEM.jpg" /></li>
 +
                <li><img src="https://static.igem.org/mediawiki/2013/e/ee/Wellesley_slideshow_presentation.jpg" /></li>
 +
                <li><img src="https://static.igem.org/mediawiki/2013/9/9f/Wellesley_slideshow_Eugenie.jpg" /></li>
 +
                <li><img src="https://static.igem.org/mediawiki/2013/e/ee/Wellesley_slideshow_BACv2.jpg" /></li>
 +
                <li><img src="https://static.igem.org/mediawiki/2013/b/be/Wellesley_slideshow_zTree.jpg" /></li>
 +
            </ul>
-
<!--End NavBar-->
+
        </div>
-
 
+
</div>
-
 
+
-
<br>
+
-
<h6>Welcome!</h6>
+
-
<br>
+
-
 
+
-
 
+
-
 
+
-
<div id="left"><img src="https://static.igem.org/mediawiki/igem.org/9/98/Wellesleydesyne2013team.jpg" alt="The Team" style="width:470px;">
+
</div>
</div>
 +
<div class="row">
 +
<div class="large-12 columns">
 +
<div class="main-container">
 +
<div id="text-container">
 +
<h4>Synthetic biology requires a multidisciplinary, collaborative design environment to engineer
 +
the complex biological systems of the future.</h4>
 +
<p>Our team created a collection of software tools which
 +
address specific technical synthetic biology challenges while simultaneously advancing the way in
 +
which users interact with computing environments. Our software will support the workflow of the
 +
scientific process by supporting various steps: research, brainstorming, building, testing, troubleshooting,
 +
iteration, and analysis. The combination of human computer interaction, bio-design automation, and
 +
experimental design makes our effort unique in the iGEM experience and closes the loop on the
 +
design-build-test methodology.
 +
</p>
 +
<hr>
 +
                                <img src="https://static.igem.org/mediawiki/2013/6/62/Whci_sponsor_logos.png">
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
<script src="http://eastmaninteractive.com/igem/whci_zepto.js"></script>
 +
<script src="http://eastmaninteractive.com/igem/whci_foundation.js"></script>
 +
<script src="http://eastmaninteractive.com/igem/whci_foundation.alerts.js"></script>
 +
<script src="http://eastmaninteractive.com/igem/whci_foundation.dropdown.js"></script>
 +
<script src="http://eastmaninteractive.com/igem/whci_foundation.placeholder.js"></script>
 +
<script src="http://eastmaninteractive.com/igem/whci_foundation.tooltips.js"></script>
 +
<script src="http://eastmaninteractive.com/igem/whci_foundation.topbar.js"></script>
-
<div class="intro_greeting">Synthetic biology will require a multidisciplinary, collaborative design environment in order to engineer the complex biological systems of the future. Our team will create a collection of software tools which address specific technical synthetic biology challenges while simultaneously advancing the way in which users interact with computing environments. Our software will support the scientific workflow process by supporting each step: research, brainstorming, building, test, troubleshooting, iteration, and analysis. The combination of human computer interaction, bio-design automation, and experimental design makes our effort unique in the iGEM experience and closes the loop on the design-build-test methodology.
+
<script>
-
<br>
+
$(function() {
 +
$('.banner').unslider({
 +
speed: 500,              //  The speed to animate each slide (in milliseconds)
 +
delay: 3000,             //  The delay between slide animations (in milliseconds)
 +
complete: function() {}, //  A function that gets called after every slide animation
 +
keys: true,               //  Enable keyboard (left, right) arrow shortcuts
 +
dots: true,               //  Display dot navigation
 +
fluid: false              //  Support responsive design. May break non-responsive designs
 +
});
 +
});
 +
  var unslider = $('.banner').unslider();
 +
   
 +
    $('.unslider-arrow').click(function() {
 +
        var fn = this.className.split(' ')[1];
 +
       
 +
        //  Either do unslider.data('unslider').next() or .prev() depending on the className
 +
        unslider.data('unslider')[fn]();
 +
    });
 +
$(document).foundation();
 +
</script>
-
<br></div>
 
-
</div>
 
-
 
-
 
-
 
-
<div style="text-align:center; float:right; width:100%; margin-top:20px;">
 
-
<img src="http://cs.wellesley.edu/~hcilab/iGEM2012/images/agilentlogo-home.png" width="200px">
 
-
<img src="http://cs.wellesley.edu/~hcilab/iGEM2012/images/HHMILogo.jpg" width="100px">
 
-
<img src="http://cs.wellesley.edu/~hcilab/iGEM2012/images/NSFLogo.png" width="100px">
 
-
<img src="http://cs.wellesley.edu/~hcilab/iGEM2012/images/WellesleyLogo.png" width="100px">
 
-
</div>
 
-
 
-
<br><br><br><br><br>
 
-
</div><!--end wellesley_wiki_content div-->
 
-
</div>
 
</body>
</body>
</html>
</html>

Latest revision as of 15:25, 27 September 2013

Wellesley HCI iGEM Team: Welcome

Synthetic biology requires a multidisciplinary, collaborative design environment to engineer the complex biological systems of the future.

Our team created a collection of software tools which address specific technical synthetic biology challenges while simultaneously advancing the way in which users interact with computing environments. Our software will support the workflow of the scientific process by supporting various steps: research, brainstorming, building, testing, troubleshooting, iteration, and analysis. The combination of human computer interaction, bio-design automation, and experimental design makes our effort unique in the iGEM experience and closes the loop on the design-build-test methodology.

Retrieved from "http://2013.igem.org/Team:Wellesley_Desyne"