Team:Wellesley HCI/Downloads Tutorials

<html>
<head>
<title>Wellesley HCI iGEM Team: Welcome</title> 
<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>
<style type="text/css">
/*hide default igem banner and reformat style into blank slate*/
#globalWrapper {width: 100%;}
#top-section {width: 100%; height:30px; border:none;}
#p-logo {display:none;}
#search-controls {display:none;}
#menubar a {color:#000000; background-color:transparent;}
#menubar a:hover{text-decoration:none; color:#6B5A3A; 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:#D99C45; 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
    	  width:100%;
    	  padding-bottom:15px;
    	  border-bottom:solid 1px orangered;
    }

H3 {
    	  font-family: Helvetica;
    	  text-decoration: none;
    	  text-align: left;
          line-height:120%;
    	  color: #870203;
    	  font-size: 12pt;
    }

</style>


<link rel="stylesheet" type="text/css" href="http://cs.wellesley.edu/~hcilab/iGEM2012/css/Team.css">
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600' rel='stylesheet' type='text/css'>

<style type="text/css">@import "http://cs.wellesley.edu/~hcilab/iGEM_wiki/css/videobox.css";</style>

</head>
<body class="basiclayout">
<div id="bu-wellesley_wiki_content">

<a href="https://2012.igem.org/Team:Wellesley_HCI"><img src="http://cs.wellesley.edu/~hcilab/iGEM2012/images/titleimage.png" width="300px" style="display:block; float:left;"></a>

<!--Start NavBar-->
<ul id="nav"> 
	<li><a href="https://2012.igem.org/Team:Wellesley_HCI/Team">Team</a></li> 
	<li><a href="https://2012.igem.org/Team:Wellesley_HCI/Project_Overview">Project</a>
<ul> 
			<li><a href="https://2012.igem.org/Team:Wellesley_HCI/Project_Overview">Project Overview</a></li> 
			<li><a href="http://www.synbiosearch.org/">SynBio Search</a></li> 
			<li><a href="https://github.com/igemsoftware/Wellesley_HCI_2012">MoClo Planner</a></li> 
			<li><a href="https://github.com/igemsoftware/Wellesley_HCI_2012">SynFlo</a></li> 
                        <li><a href="https://2012.igem.org/Team:Wellesley_HCI/Downloads_Tutorials">Downloads & Tutorials</a></li> 
		</ul>
</li> 
		
	<li><a href="#">Process</a> 
		<ul> 
			<li><a href="https://2012.igem.org/Team:Wellesley_HCI/Human_Practices">Human Practices</a></li> 
			<li><a href="https://2012.igem.org/Team:Wellesley_HCI/Methodology">Methodology</a></li> 
			<li><a href="https://2012.igem.org/Team:Wellesley_HCI/Safety">Safety</a></li> 
			<li><a href="https://2012.igem.org/Team:Wellesley_HCI/Notebook">Notebook</a></li> 
			<li><a href="https://2012.igem.org/Team:Wellesley_HCI/Outreach">Outreach</a></li>
			<li><a href="https://2012.igem.org/Team:Wellesley_HCI/Tips_Tricks">Tips & Tricks</a></li> 
		</ul>
	</li>
	<li><a href="https://2012.igem.org/Team:Wellesley_HCI/Gold">Medal Fulfillment</a></li> 
	<li><a href="#">Additional Info</a>
		<ul>
			<li><a href="https://2012.igem.org/Team:Wellesley_HCI/Acknowledgement">Acknowledgement</a></li> 
			<li><a href="https://2012.igem.org/Team:Wellesley_HCI/Social">Fun</a></li>
		</ul>
	</li>
</ul>
<!--End NavBar-->   
 

<br>
<h6>Downloads and Tutorials</h6>

<div id="tracking_nav">
JUMP TO...<br>
<a href="#bu-wellesley_wiki_content">Top</a><br>
<a href="#downloads">Downloads</a><br>
<a href="#tutorials">Tutorials</a><br>
<a href="#install">Installation</a><br>
</div>

<div id="downloads">
<h1>Downloads</h1>

<ul>
<li><a href="http://www.synbiosearch.org">SynBio Search</a> (To access web app, click <a href="http://www.synbiosearch.org">here.</a>)
<li><a href="https://github.com/igemsoftware/Wellesley_HCI_2012.git">MoClo Planner</a>
<li><a href="https://github.com/igemsoftware/Wellesley_HCI_2012.git">SynFlo</a>
</ul>

</div>
<div id="tutorials">
<h1>Tutorials</h1>

<ul>
<li>SynBio Search
<center><iframe width="560" height="315" src="http://www.youtube.com/embed/z6W4Eb-ueyc" frameborder="0" allowfullscreen></iframe></center>
<li>MoClo Planner
<center><iframe width="560" height="315" src="http://www.youtube.com/embed/3bmKh48nSCo" frameborder="0" allowfullscreen></iframe></center>
<li>SynFlo
<center><iframe width="560" height="315" src="http://www.youtube.com/embed/_oWCemFi1NI" frameborder="0" allowfullscreen></iframe></iframe></center>
</ul>

</div>

<div id="install">
<h1>Installation Instructions</h1>
<li>SynFlo</li>
<ul>
<li>A description and demo of the installation can be found here: https://2012.igem.org/Team:Wellesley_HCI/SynFluo</li><li>To use SynFlo, you will need at least three Sifteo Cubes, which you can purchase here: https://www.sifteo.com/shop.</li>
<li>You need to register for a Sifteo account (https://www.sifteo.com/login). Currently, SynFlo only works with the original version of the Sifteo SDK, so you need to download SiftRunner in order to install and run the program: https://www.sifteo.com/original/download.</li>
<li>You will also need Visual Studio 2008: http://www.microsoft.com/download/en/details.aspx?displaylang=en&id=6506.</li>
<li>To install SynFlo into the cubes, place the cubes into the charging dock and connect Sifteo’s USB wireless link to your computer. Using SiftDev (one of the programs that should have come with the SiftRunner installation), click on the option to ‘Load Application’ then select the folder that contains SynFlo.</li>
<li>To run SynFlo, you have to first run it on Visual Studio then run it on SiftDev. Without the surface however this installation only simulates the process of modifying E. coli.</li>
<li>If you want to simulate deployment into the environment wherein you are able to introduce toxins and trigger color changes in the E. coli, you will also need a Microsoft Surface. </li>
<li>Some preparation is needed in order to connect the Surface with the cubes. Once you run the server-side program on the tabletop computer, place one cube, with its screen facing up, onto the Surface and flip it. Do this for each one of your cubes, making sure no more than one tag is placed on the tabletop computer at a time. </li>
</ul>
<br>
<li>SynBio Search</li>
<ul><li>To access web app, click <a href="http://synbiosearch.org">here.</a></li></ul>
<br>
<li>MoClo Planner</li>
<ul><li>INSTALL HERE</li></ul>


</div><!--end wellesley_wiki_content div-->

</div>
</body>
</html>