Difference between revisions of "Team:BostonU HW/Notebook"

 
(7 intermediate revisions by the same user not shown)
Line 1: Line 1:
{{BUHW2016}}
+
{{Template:BUHW2016_NavBar}}
<html>
+
  
  
 +
{{Template:BUHW2016_Bootstrap}}
 +
<html>
 +
<head>
 
<style>
 
<style>
 +
 +
 +
/********************************* DEFAULT WIKI SETTINGS  ********************************/
 +
 +
  #sideMenu, #top_title {display:none;}
 +
  #content { padding:0px; width:100%; margin-top:-12px; margin-left:0px;}
 +
  body {background-color:white; }
 +
  #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
 +
 +
 +
 +
@font-face {
 +
    font-family: openSans;
 +
    src: url(https://static.igem.org/mediawiki/2016/1/1e/T--BostonU_HW--openSansLight_rcwolf.ttf);
 +
}
 +
 +
 +
html,body
 +
{
 +
    width: 100%;
 +
    min-width: 100%;
 +
    height: 100%;
 +
    margin: 0px;
 +
    padding: 0px;
 +
    overflow-x: hidden;
 +
}
 +
 +
 +
body{
 +
background-color: white;
 +
}
 +
 +
* {
 +
font-family: openSans !important;
 +
}
 +
 +
 +
.navbar {
 +
  background-color: black;
 +
  border-color: black;
 +
margin-top: 10px;
 +
 
 +
}
 +
 +
 +
 +
.navbar-default .navbar-header .navbar-brand,
 +
.navbar-default .navbar-header .navbar-brand:hover,
 +
.navbar-default .navbar-header .navbar-brand:focus {
 +
      color: white;
 +
  }
 +
  .navbar-default .nav > li > a,
 +
  .navbar-default .nav > li > a:focus {
 +
      color: white;
 +
      font-size: medium;
 +
  }
 +
  .navbar-default .nav > li > a:hover,
 +
  .navbar-default .nav > li > a:focus:hover {
 +
      color: white;
 +
      font-size: medium;
 +
  }
 +
  .navbar-default.affix {
 +
      background-color: white;
 +
      border-color: white;
 +
  }
 +
 +
 +
  /*  Animated Underlining For Menu Items  */
 +
.dropbtn {
 +
  display: inline-block;
 +
  position: relative;
 +
  padding-bottom: 3px;
 +
}
 +
.dropbtn:after {
 +
  content: '';
 +
  display: block;
 +
  margin: auto;
 +
  height: 2px;
 +
  width: 0px;
 +
  background: transparent;
 +
  transition: width .5s ease, background-color .5s ease;
 +
}
 +
.sliding-middle-out:hover > .dropbtn:after {
 +
  width: 100%;
 +
  background: white;
 +
}
 +
 +
 +
 +
 +
 +
/*  Dropdown Menu Functionality  */
 +
/* Style The Dropdown Button */
 +
.dropbtn {
 +
    color: white;
 +
    border: none;
 +
    cursor: pointer;
 +
}
 +
 +
/* The container <div> - needed to position the dropdown content */
 +
.dropdown {
 +
    position: relative;
 +
    display: inline-block;
 +
}
 +
 +
/* Dropdown Content (Hidden by Default) */
 +
.dropdown-content {
 +
    display: none;
 +
    position: absolute;
 +
    background-color: rgba(249,249,249,0.4);
 +
    min-width: 160px;
 +
}
 +
 +
/* Links inside the dropdown */
 +
.dropdown-content a {
 +
    color: black;
 +
    font-size: 15px;
 +
    padding: 10px 16px;
 +
    text-decoration: none;
 +
    display: block;
 +
}
 +
 +
/* Change color of dropdown links on hover */
 +
.dropdown-content a:hover {background-color: #f1f1f1}
 +
 +
/* Show the dropdown menu on hover */
 +
.dropdown:hover .dropdown-content {
 +
    display: block;
 +
}
 +
 +
.paddedNav{
 +
padding-left: 23px;
 +
padding-right: 23px;
 +
padding-bottom: 5px;
 +
}
 +
 +
 +
 +
 +
 +
 +
 +
 
.timeline{list-style:none;padding:0;position:relative}
 
.timeline{list-style:none;padding:0;position:relative}
 
.timeline:before{top:0;bottom:0;position:absolute;content:"";width:2px;background-color:#f1f1f1;left:40px;margin-left:-1.5px}
 
.timeline:before{top:0;bottom:0;position:absolute;content:"";width:2px;background-color:#f1f1f1;left:40px;margin-left:-1.5px}
Line 12: Line 157:
 
.timeline>li .timeline-panel:before{border-left-width:0;border-right-width:15px;left:-15px;right:auto}
 
.timeline>li .timeline-panel:before{border-left-width:0;border-right-width:15px;left:-15px;right:auto}
 
.timeline>li .timeline-panel:after{border-left-width:0;border-right-width:14px;left:-14px;right:auto}
 
.timeline>li .timeline-panel:after{border-left-width:0;border-right-width:14px;left:-14px;right:auto}
.timeline>li .timeline-image{left:0;margin-left:0;width:80px;height:80px;position:absolute;z-index:100;background-color:#fed136;color:#fff;border-radius:100%;border:7px solid #f1f1f1;text-align:center}
+
.timeline>li .timeline-image{left:0;margin-left:0;width:80px;height:80px;position:absolute;z-index:99;background-color:white;color:#fff;border-radius:100%;border:7px solid #f1f1f1;text-align:center}
 
.timeline>li .timeline-image h4{font-size:10px;margin-top:12px;line-height:14px}
 
.timeline>li .timeline-image h4{font-size:10px;margin-top:12px;line-height:14px}
 
.timeline>li.timeline-inverted>.timeline-panel{float:right;text-align:left;padding:0 20px 0 100px}
 
.timeline>li.timeline-inverted>.timeline-panel{float:right;text-align:left;padding:0 20px 0 100px}
Line 21: Line 166:
 
.timeline .timeline-body>p,.timeline .timeline-body>ul{margin-bottom:0}
 
.timeline .timeline-body>p,.timeline .timeline-body>ul{margin-bottom:0}
 
@media (min-width:768px){.timeline:before{left:50%}
 
@media (min-width:768px){.timeline:before{left:50%}
.timeline>li{margin-bottom:100px;min-height:100px}
+
    .timeline>li{margin-bottom:100px;min-height:100px}
.timeline>li .timeline-panel{width:41%;float:left;padding:0 20px 20px 30px;text-align:right}
+
    .timeline>li .timeline-panel{width:41%;float:left;padding:0 20px 20px 30px;text-align:right}
.timeline>li .timeline-image{width:100px;height:100px;left:50%;margin-left:-50px}
+
    .timeline>li .timeline-image{width:100px;height:100px;left:50%;margin-left:-50px}
.timeline>li .timeline-image h4{font-size:13px;margin-top:16px;line-height:18px}
+
    .timeline>li .timeline-image h4{font-size:13px;margin-top:16px;line-height:18px}
.timeline>li.timeline-inverted>.timeline-panel{float:right;text-align:left;padding:0 30px 20px 20px}
+
    .timeline>li.timeline-inverted>.timeline-panel{float:right;text-align:left;padding:0 30px 20px 20px}
 
}
 
}
 
@media (min-width:992px){
 
@media (min-width:992px){
.timeline>li{min-height:150px}
+
    .timeline>li{min-height:150px}
.timeline>li .timeline-panel{padding:0 20px 20px}
+
    .timeline>li .timeline-panel{padding:0 20px 20px}
.timeline>li .timeline-image{width:150px;height:150px;margin-left:-75px}
+
    .timeline>li .timeline-image{width:150px;height:150px;margin-left:-75px}
.timeline>li .timeline-image h4{font-size:18px;margin-top:30px;line-height:26px}
+
    .timeline>li .timeline-image h4{font-size:18px;margin-top:30px;line-height:26px}
.timeline>li.timeline-inverted>.timeline-panel{padding:0 20px 20px}
+
    .timeline>li.timeline-inverted>.timeline-panel{padding:0 20px 20px}
 
}
 
}
 
@media (min-width:1200px){
 
@media (min-width:1200px){
.timeline>li{min-height:170px}
+
    .timeline>li{min-height:170px}
.timeline>li .timeline-panel{padding:0 20px 20px 100px}
+
    .timeline>li .timeline-panel{padding:0 20px 20px 100px}
.timeline>li .timeline-image{width:170px;height:170px;margin-left:-85px}
+
    .timeline>li .timeline-image{width:170px;height:170px;margin-left:-85px}
.timeline>li .timeline-image h4{margin-top:40px}
+
    .timeline>li .timeline-image h4{margin-top:40px}
.timeline>li.timeline-inverted>.timeline-panel{padding:0 100px 20px 20px}
+
    .timeline>li.timeline-inverted>.timeline-panel{padding:0 100px 20px 20px}
 
}
 
}
 +
 +
 
</style>
 
</style>
 +
 +
 +
</head>
 +
 +
 +
 +
 +
  
  
Line 47: Line 202:
  
 
<body>
 
<body>
<div class="services bg-primary">
+
 
<div class="row text-center">
+
<header id="top" class="header">
          <div class="col-lg-10 col-lg-offset-1">
+
 
         <div class="text-vertical-center" style="color: white;">
+
<nav class="navbar navbar-default navbar-fixed-top" style="max-height: 70px !important;">
            <h1>Timeline</h1>
+
  <div class="container-fluid paddedNav">
</div>
+
    <!-- Brand and toggle get grouped for better mobile display -->
</div>
+
    <div class="navbar-header">
</div>
+
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
 +
         <span class="sr-only">Toggle navigation</span>
 +
        <span class="icon-bar"></span>
 +
        <span class="icon-bar"></span>
 +
        <span class="icon-bar"></span>
 +
      </button>
 +
     
 +
      <a class="navbar-brand" href="https://2016.igem.org/Team:BostonU_HW"><img src="https://static.igem.org/mediawiki/2016/9/97/T--BostonU_HW--NeptuneLogo_rcwolf.png" height="38" width="55" style="display: inline-block; padding-right: 17px; ">BU HW 2016</a>
 +
    </div>
 +
 
 +
    <!-- Collect the nav links, forms, and other content for toggling -->
 +
    <div class="collapse navbar-collapse " >
 +
      <ul class="nav navbar-nav navbar-right">
 +
        <li class="sliding-middle-out dropdown">
 +
            <a href="#" class="dropbtn">TEAM </a>
 +
            <div class="dropdown-content">
 +
                  <a href="https://2016.igem.org/Team:BostonU_HW/Team">Meet the Team </a>
 +
                  <a href="https://2016.igem.org/Team:BostonU_HW/Attributions">Attributions</a>
 +
                  <a href="https://2016.igem.org/Team:BostonU_HW/Collaborations">Collaborations</a>
 +
            </div>
 +
        </li>
 +
        <li class="sliding-middle-out dropdown">
 +
            <a href="#" class="dropbtn">PROJECT</a>
 +
           
 +
            <div class="dropdown-content">
 +
                  <a href="https://2016.igem.org/Team:BostonU_HW/Results">Results</a>
 +
                  <a href="https://2016.igem.org/Team:BostonU_HW/Demonstrate">Demonstration</a>
 +
                  <a href="https://2016.igem.org/Team:BostonU_HW/Proof">Proof</a>
 +
                  <a href="https://2016.igem.org/Team:BostonU_HW/Design">Design</a>
 +
                  <a href="https://2016.igem.org/Team:BostonU_HW/Parts">Parts</a>
 +
            </div>
 +
        </li>
 +
        <li class="sliding-middle-out dropdown">
 +
            <a href="#" class="dropbtn">NOTEBOOK</a>
 +
            <img src="https://static.igem.org/mediawiki/2016/5/58/T--BostonU_HW--indexTriangle_rcwolf.png" width="36" height="18" style="margin-bottom: 0 !important; margin-top: 0; padding-bottom: 0 !important; border: none; display: block; margin: 0 auto;">
 +
            <div class="dropdown-content">
 +
                  <a href="https://2016.igem.org/Team:BostonU_HW/Notebook">Timeline</a>
 +
                  <a href="https://2016.igem.org/Team:BostonU_HW/Experiments">Experiments</a>
 +
                  <a href="https://2016.igem.org/Team:BostonU_HW/Safety">Safety</a>
 +
            </div>
 +
        </li>
 +
        <li class="sliding-middle-out dropdown">
 +
            <a href="https://2016.igem.org/Team:BostonU_HW/Human_Practices" class="dropbtn">HUMAN PRACTICES</a>
 +
            <div class="dropdown-content">
 +
                  <a href="https://2016.igem.org/Team:BostonU_HW/HP/Silver">Silver</a>
 +
                  <a href="https://2016.igem.org/Team:BostonU_HW/HP/Gold">Gold</a>
 +
 
 +
            </div>
 +
        </li>
 +
        <li class="sliding-middle-out dropdown">
 +
            <a href="#" class="dropbtn">AWARDS</a>
 +
            <div class="dropdown-content">
 +
                  <a href="https://2016.igem.org/Team:BostonU_HW/Integrated_Practices">Integrated Practices</a>
 +
                  <a href="https://2016.igem.org/Team:BostonU_HW/Software">Software</a>
 +
            </div>
 +
        </li>
 +
        <li class="sliding-middle-out dropdown">
 +
            <a href="#" class="dropbtn">MEDAL CRITERIA </a>
 +
            <div class="dropdown-content">
 +
                  <a href="https://2016.igem.org/Team:BostonU_HW/Bronze">Bronze</a>
 +
                  <a href="https://2016.igem.org/Team:BostonU_HW/Silver">Silver</a>
 +
                  <a href="https://2016.igem.org/Team:BostonU_HW/Gold">Gold</a>
 +
                 
 +
            </div>
 +
        </li>
 +
       
 +
 
 +
      </ul>
 +
    </div><!-- /.navbar-collapse -->
 +
  </div><!-- /.container-fluid -->
 +
</nav>
 +
 
 +
 
 
</div>
 
</div>
  
  
  
 +
</body>
  
  
  
 +
<html>
 +
 +
 +
 +
 +
 +
 +
<html>
 +
 +
<style>
 +
 +
  html {
 +
    background-color: #D2D2D2;
 +
  }
 +
  body {
 +
    background-color: #D2D2D2;
 +
  }
 +
 
 +
  #greyWrapper {
 +
    padding-top: 120px;
 +
    background-color: #D2D2D2;
 +
    margin: 0px 0px 40px 0px;
 +
    min-height: 1000px;
 +
  }
 +
  #pageTitle {
 +
    margin-left: 25px;
 +
    padding-bottom: 16px;
 +
  }
 +
  .pageBanner {
 +
    position: fixed;
 +
    color:black;
 +
    background-color:white;
 +
    width:100%;
 +
    top:70px;
 +
    z-index: 100;
 +
  }
 +
  .densmoreCard {
 +
    background-color: white;
 +
    padding:0;
 +
  }
 +
  .advisorCard {
 +
    background-color: white;
 +
  }
 +
  .miniBio {
 +
    padding-left: 20px;
 +
    padding-right:20px;
 +
    padding-bottom:30px;
 +
  }
 +
  .bioIcon {
 +
    border: none;
 +
    display: block;
 +
    margin-top: -24px;
 +
    margin-bottom: -20px;
 +
    margin-left: auto;
 +
    margin-right: auto;
 +
  }
 +
 +
 +
 +
 +
 +
.btn {
 +
    padding: 14px 24px;
 +
    border: 0 none;
 +
    border-radius: 0;
 +
    font-weight: 700;
 +
    font-size: 15px;
 +
    letter-spacing: 0.5px;
 +
    text-transform: uppercase;
 +
    -webkit-box-shadow: 5px 5px 0px rgba(4, 4, 4, 0.3);
 +
    -moz-box-shadow:    5px 5px 0px rgba(4, 4, 4, 0.3);
 +
    box-shadow:        5px 5px 0px rgba(4, 4, 4, 0.3);
 +
    outline: #545454 solid 2px;
 +
   
 +
}
 +
 +
.btn:focus, .btn:active:focus, .btn.active:focus {
 +
    outline: 0 none;
 +
}
 +
 +
.btn-primary {
 +
    background: #ffffff;
 +
    color: #000000;
 +
}
 +
 +
.btn-primary:active, .btn-primary.active {
 +
    background: #ffffff;
 +
    color: #000000;
 +
}
 +
 +
 +
 +
.btn-primary:focus {
 +
    background: #ffffff;
 +
    color: #000000;
 +
}
 +
 +
 +
.btn:active:focus {
 +
    background: #545454 !important;
 +
    color: white;
 +
    box-shadow: none;
 +
}
 +
.btn-primary:hover{
 +
    background: #545454;
 +
    color: white;
 +
}
 +
 +
 +
</style>
 +
 +
 +
 +
<body>
 +
<!-- PAGE TITLE BANNER -->
 +
  <div id="greyWrapper">   
 +
    <div class="pageBanner">
 +
      <h3 id="pageTitle">TIMELINE</h3>
 +
    </div>
 +
    <br><br><br><br>
 +
   
 +
   
 +
 +
 +
<div class="row" style="padding-top:50px; padding-bottom:50px;">
 +
  <div class="col-md-1"></div>
 +
  <div class="col-md-10" style="font-size: 3em; line-height: 130%;"><b style="color: #355E62;">TIMELINE | </b>Building the Neptune Flow</div>
 +
  <div class="col-md-1"></div>
 +
</div>
 +
 +
 +
 +
<div class="row" style="padding-top:20px; padding-bottom:20px;">
 
<!-- About Section -->
 
<!-- About Section -->
 
     <section id="about">
 
     <section id="about">
 
         <div class="container">
 
         <div class="container">
            <div class="row">
 
                <div class="col-lg-12 text-center">
 
                    <h2 class="section-heading">Building the Fluigi Flow</h2>
 
                    <h3 class="section-subheading text-muted">An overview of our work from our humble beginnings to a complete microfluidic design suite.</h3>
 
                </div>
 
            </div>
 
 
             <br><br/>
 
             <br><br/>
 
             <div class="row">
 
             <div class="row">
Line 85: Line 440:
 
                                 </div>
 
                                 </div>
 
                                 <div class="timeline-body">
 
                                 <div class="timeline-body">
                                     <p class="text-muted">Our project is part of a workflow, and during training and orientation, we learnt about the flow and how we fit in. We also started to test tools that we could use to build the graphical user interface, and planned out what we could do with the hardware setup. </p>
+
                                     <p class="text-muted">Our project is part of an existing workflow in our lab, and during training and orientation we learned about the flow and how we fit in. We also started to test tools that we could use to build our graphical user interface and planned out what we could do with the hardware setup. </p>
<a href="https://2016.igem.org/Team:BostonU_HW/Notebook/May" class="btn btn-light">See More </a>
+
                                    <br>
 +
                                    <a href="https://2016.igem.org/Team:BostonU_HW/Notebook/May"> <button type="button" class="btn btn-primary">See More</button></a>  
 
                                 </div>
 
                                 </div>
 
                             </div>
 
                             </div>
Line 92: Line 448:
 
                         <li class="timeline-inverted">
 
                         <li class="timeline-inverted">
 
                             <div class="timeline-image">
 
                             <div class="timeline-image">
                                 <img class="img-circle img-responsive" src="https://static.igem.org/mediawiki/2016/6/64/PostitSquare_rcwolf.jpg" alt="">
+
                                 <img class="img-circle img-responsive" src="https://static.igem.org/mediawiki/2016/9/9e/T--BostonU_HW--TimelineJune_rcwolf.png" alt="">
 
                             </div>
 
                             </div>
 
                             <div class="timeline-panel">
 
                             <div class="timeline-panel">
Line 100: Line 456:
 
                                 </div>
 
                                 </div>
 
                                 <div class="timeline-body">
 
                                 <div class="timeline-body">
                                     <p class="text-muted">After testing out tools, we finally decided to implement a web application using a node.js (operating as a server) framework. We started ordering parts and 3D printing components to set up the hardware. </p>
+
                                     <p class="text-muted">After testing out tools, we decided to implement a web application using a node.js (operating as a local server) framework. We started ordering parts and 3D printing components to set up the hardware. </p>
<a href="https://2016.igem.org/Team:BostonU_HW/Notebook/June" class="btn btn-light">See More </a>
+
                                    <br>
 +
                                    <a href="https://2016.igem.org/Team:BostonU_HW/Notebook/June"> <button type="button" class="btn btn-primary">See More</button></a>
 
                                 </div>
 
                                 </div>
 
                             </div>
 
                             </div>
Line 107: Line 464:
 
                         <li>
 
                         <li>
 
                             <div class="timeline-image">
 
                             <div class="timeline-image">
                                 <img class="img-circle img-responsive" src="https://static.igem.org/mediawiki/2016/d/d4/ComputerSquare_rcwolf.jpg" alt="">
+
                                 <img class="img-circle img-responsive" src="https://static.igem.org/mediawiki/2016/3/3b/T--BostonU_HW--TimelineJuly_rcwolf.png" alt="">
 
                             </div>
 
                             </div>
 
                             <div class="timeline-panel">
 
                             <div class="timeline-panel">
 
                                 <div class="timeline-heading">
 
                                 <div class="timeline-heading">
 
                                     <h4>July 2016</h4>
 
                                     <h4>July 2016</h4>
                                     <h4 class="subheading">Get it together</h4>
+
                                     <h4 class="subheading">Expanding Horizons</h4>
 
                                 </div>
 
                                 </div>
 
                                 <div class="timeline-body">
 
                                 <div class="timeline-body">
                                     <p class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sunt ut voluptatum eius sapiente, totam reiciendis temporibus qui quibusdam, recusandae sit vero unde, sed, incidunt et ea quo dolore laudantium consectetur!</p>
+
                                     <p class="text-muted">We started building Neptune piece by piece. From what was initially a GUI designed only to interact with hardware, the idea of Neptune as a full-fledged toolchain arose.</p>
<a href="https://2016.igem.org/Team:BostonU_HW/Notebook/July" class="btn btn-light">See More </a>
+
                                    <br>
 +
                                    <a href="https://2016.igem.org/Team:BostonU_HW/Notebook/July"> <button type="button" class="btn btn-primary">See More</button></a>  
 
                                 </div>
 
                                 </div>
 
                             </div>
 
                             </div>
Line 122: Line 480:
 
                         <li class="timeline-inverted">
 
                         <li class="timeline-inverted">
 
                             <div class="timeline-image">
 
                             <div class="timeline-image">
                                 <img class="img-circle img-responsive" src="https://static.igem.org/mediawiki/2016/4/4d/FilesSquare_rcwolf.jpg" alt="">
+
                                 <img class="img-circle img-responsive" src="https://static.igem.org/mediawiki/2016/f/f8/T--BostonU_HW--TimelineAug_rcwolf.png" alt="">
 
                             </div>
 
                             </div>
 
                             <div class="timeline-panel">
 
                             <div class="timeline-panel">
 
                                 <div class="timeline-heading">
 
                                 <div class="timeline-heading">
 
                                     <h4>August 2016</h4>
 
                                     <h4>August 2016</h4>
                                     <h4 class="subheading">Milkshakes</h4>
+
                                     <h4 class="subheading">In the Trenches</h4>
 
                                 </div>
 
                                 </div>
 
                                 <div class="timeline-body">
 
                                 <div class="timeline-body">
                                     <p class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sunt ut voluptatum eius sapiente, totam reiciendis temporibus qui quibusdam, recusandae sit vero unde, sed, incidunt et ea quo dolore laudantium consectetur!</p>
+
                                     <p class="text-muted">We carved out the major components that make up Neptune today. The Specify, Design, Build, Assemble, and Control pages were built with the end functional goal of each component clearly laid out. Many iterations of control infrastructure prototypes were made and firmware was solidified.</p>
<a href="https://2016.igem.org/Team:BostonU_HW/Notebook/August" class="btn btn-light">See More </a>   
+
                                    <br>
 +
                                    <a href="https://2016.igem.org/Team:BostonU_HW/Notebook/August"> <button type="button" class="btn btn-primary">See More</button></a>   
 
                                 </div>
 
                                 </div>
 
                             </div>
 
                             </div>
 
                         <li>
 
                         <li>
 
                             <div class="timeline-image">
 
                             <div class="timeline-image">
                                 <img class="img-circle img-responsive" src="https://static.igem.org/mediawiki/2016/c/cf/MeetingSquare_rcwolf.jpg" alt="">
+
                                 <img class="img-circle img-responsive" src="https://static.igem.org/mediawiki/2016/3/3a/T--BostonU_HW--TimelineSept_rcwolf.png" alt="">
 
                             </div>
 
                             </div>
 
                             <div class="timeline-panel">
 
                             <div class="timeline-panel">
 
                                 <div class="timeline-heading">
 
                                 <div class="timeline-heading">
 
                                     <h4>September 2016</h4>
 
                                     <h4>September 2016</h4>
                                     <h4 class="subheading">Some futuristic ish</h4>
+
                                     <h4 class="subheading">End-to-end Integration</h4>
 
                                 </div>
 
                                 </div>
 
                                 <div class="timeline-body">
 
                                 <div class="timeline-body">
                                     <p class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sunt ut voluptatum eius sapiente, totam reiciendis temporibus qui quibusdam, recusandae sit vero unde, sed, incidunt et ea quo dolore laudantium consectetur!</p>
+
                                     <p class="text-muted">Full integration of Neptune software and hardware was made. Neptune software was stress-tested by benchmarks and levels of hardware precision were evaluated and documented.</p>
<a href="https://2016.igem.org/Team:BostonU_HW/Notebook/September" class="btn btn-light">See More </a>
+
                                    <br>
 +
                                    <a href="https://2016.igem.org/Team:BostonU_HW/Notebook/September"> <button type="button" class="btn btn-primary">See More</button></a>  
 
                                 </div>
 
                                 </div>
 
                             </div>
 
                             </div>
Line 151: Line 511:
 
                         <li class="timeline-inverted">
 
                         <li class="timeline-inverted">
 
                             <div class="timeline-image">
 
                             <div class="timeline-image">
                                 <img class="img-circle img-responsive" src="https://static.igem.org/mediawiki/2016/d/d0/WalkingSquare_rcwolf.jpg" alt="">
+
                                 <img class="img-circle img-responsive" src="https://static.igem.org/mediawiki/2016/1/1e/T--BostonU_HW--GitHubLogo_rcwolf.png" alt="">
 
                             </div>
 
                             </div>
 
                             <div class="timeline-panel">
 
                             <div class="timeline-panel">
 
                                 <div class="timeline-heading">
 
                                 <div class="timeline-heading">
                                     <h4>October 2016</h4>
+
                                     <h4 >October 2016</h4>
                                     <h4 class="subheading">BEB</h4>
+
                                     <h4 class="subheading">Release</h4>
 
                                 </div>
 
                                 </div>
 
                                 <div class="timeline-body">
 
                                 <div class="timeline-body">
                                     <p class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sunt ut voluptatum eius sapiente, totam reiciendis temporibus qui quibusdam, recusandae sit vero unde, sed, incidunt et ea quo dolore laudantium consectetur!</p>
+
                                     <p class="text-muted">Programming time dedicated to bug-fixing. We validated our work through multiple test cases including a collaboration with the MIT wetlab team. We released our software and hardware as open source on GitHub and NONA.</p>
<a href="https://2016.igem.org/Team:BostonU_HW/Notebook/October" class="btn btn-light">See More </a>
+
                                    <br>
 +
                                    <a href="https://2016.igem.org/Team:BostonU_HW/Notebook/October"> <button type="button" class="btn btn-primary">See More</button></a>
 
                                 </div>
 
                                 </div>
 
                             </div>
 
                             </div>
Line 170: Line 531:
 
     </section>
 
     </section>
  
 +
    </div>
  
  
  
 +
<br><br>
  
</body>
 
  
  
  
    <!-- Footer -->
 
    <footer id="contact">
 
        <div class="container">
 
            <div class="row">
 
             
 
<div class="col-lg-10 col-lg-offset-1 text-center">
 
                    <h2>Contact Us</h2>
 
                    <ul>
 
<div class="col-md-6 col-lg-offset-1">
 
<img src= "https://static.igem.org/mediawiki/2016/2/25/ValenciaUPV_twitterLogo.png" height="50px">
 
                      <a href="http://twitter.com/iGemHWBU">Twitter </a> 
 
</div>
 
<div class="col-md-2">
 
<img src= "https://static.igem.org/mediawiki/2016/2/2c/ValenciaUPV_mailLogo.png" height="50px">
 
                      <a href="mailto:bu.igemhw2016@gmail.com"> Email</a>
 
</div>
 
                      <br/><br/><br/>
 
                    </ul>
 
                    <hr class="small">
 
                    <p class="text-muted" style="text-align:center">Copyright &copy; Boston University Hardware Team Website 2016</p>
 
    </div>
 
</div>
 
        </div>
 
    </footer>
 
  
 +
</body>
 
</html>
 
</html>

Latest revision as of 03:14, 20 October 2016


TIMELINE





TIMELINE | Building the Neptune Flow


  • 16 - 30 May 2016

    Training and Orientation

    Our project is part of an existing workflow in our lab, and during training and orientation we learned about the flow and how we fit in. We also started to test tools that we could use to build our graphical user interface and planned out what we could do with the hardware setup.


  • June 2016

    A GUI is Born

    After testing out tools, we decided to implement a web application using a node.js (operating as a local server) framework. We started ordering parts and 3D printing components to set up the hardware.


  • July 2016

    Expanding Horizons

    We started building Neptune piece by piece. From what was initially a GUI designed only to interact with hardware, the idea of Neptune as a full-fledged toolchain arose.


  • August 2016

    In the Trenches

    We carved out the major components that make up Neptune today. The Specify, Design, Build, Assemble, and Control pages were built with the end functional goal of each component clearly laid out. Many iterations of control infrastructure prototypes were made and firmware was solidified.


  • September 2016

    End-to-end Integration

    Full integration of Neptune software and hardware was made. Neptune software was stress-tested by benchmarks and levels of hardware precision were evaluated and documented.


  • October 2016

    Release

    Programming time dedicated to bug-fixing. We validated our work through multiple test cases including a collaboration with the MIT wetlab team. We released our software and hardware as open source on GitHub and NONA.