Team:Wellesley Desyne/Outreach

From 2013.igem.org

(Difference between revisions)
Line 1: Line 1:
<html>
<html>
<head>
<head>
-
<title>Wellesley HCI iGEM Team: Welcome</title>  
+
<title>Wellesley HCI iGEM Team: Outreach</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">
 +
 
<style type="text/css">
<style type="text/css">
-
/*hide default igem banner and reformat style into blank slate*/
+
/* Hiding predefined html elements */
-
#globalWrapper {width: 100%;}
+
/***********************************/
-
#top-section {width: 100%; height:30px; border:none;}
+
#contentSub, #search-controls, #catlinks, #p-logo, .firstHeading {
 +
display:none;
 +
padding:0px;
 +
margin:0px;
 +
}
 +
#bodyContent {border:none;}
 +
#content {width: 100%; padding:0px; border-left: 0px; border-right: 0px;}
 +
#globalWrapper {width: 100%; font-size: 100%; position: static;}
 +
#top-section {width: 100%; height:10px; border:none;}
#p-logo {display:none;}
#p-logo {display:none;}
#search-controls {display:none;}
#search-controls {display:none;}
Line 17: Line 27:
.right-menu ul li a {background-color:transparent; background: transparent;}
.right-menu ul li a {background-color:transparent; background: transparent;}
.printfooter {display:none; background-color:transparent;}
.printfooter {display:none; background-color:transparent;}
 +
a:hover {text-decoration: none;}
#footer-box {border:none; background-color:transparent;}
#footer-box {border:none; background-color:transparent;}
#catlinks {display:none; background-color:transparent;}
#catlinks {display:none; background-color:transparent;}
.firstHeading {display:none; background-color:transparent;}
.firstHeading {display:none; background-color:transparent;}
#content {width: 100%; border:none; background-color:transparent;}
#content {width: 100%; border:none; background-color:transparent;}
-
#bodyContent {border:none;}
+
h1, h2, h3, h4, h5, h6 {  
-
 
+
font-size: 100%;  
-
/*actual content styles*/
+
padding-top: 0;
-
body {width: 900px; margin:auto;}
+
padding-bottom: 0;
-
 
+
border-bottom: 0px;
-
#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 */
+
html {margin: 0;}
-
a{
+
ul {
-
color:#870203;
+
list-style-type: none;
-
-webkit-transition-duration:0.3s;
+
list-style-image: none;
-
-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:#F1F4F7;
 
-
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:300px; 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>
 +
<link rel="stylesheet" href="http://cs.wellesley.edu/~hcilab/igem2013/whci_app.css">
 +
<link href='http://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'>
 +
<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
 +
<script src="http://cs.wellesley.edu/~hcilab/igem2013/whci_jquery.js"></script>
-
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600' rel='stylesheet' type='text/css'>
+
<body>
-
 
+
<nav class="top-bar">
-
<style type="text/css">@import "http://cs.wellesley.edu/~hcilab/iGEM_wiki/css/videobox.css";</style>
+
<ul class="title-area">
-
 
+
<!-- Title Area -->
-
</head>
+
<li class="name">
-
<body class="basiclayout">
+
<h1><a href="#">WHCI</a></h1>
-
<div id="bu-wellesley_wiki_content">
+
</li>
-
 
+
<!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
-
 
+
<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>
+
-
    </li>
+
-
    <li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Project_Overview">Project</a>
+
-
        <ul>
+
-
    <li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Project_Overview">Project Overview</a></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/zMol_zTree">zMol_zTree</a></li>
+
-
            <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><a href="https://2013.igem.org/Team:Wellesley_Desyne/Human_Practices">Human Practices</a>
+
-
<ul>
+
-
    <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>
</ul>
-
    </li>
+
<section class="top-bar-section">
-
    <li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Gold">Medal Fulfillment</a></li>
+
<!-- Left Nav Section -->
-
</ul>
+
<ul class="left">
 +
<li class="divider"></li>
 +
<li class="has-dropdown"><a href="#">TEAM</a>
 +
<ul class="dropdown">
 +
<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 and Tricks</a></li>
 +
<li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Social">Fun</a></li>
 +
</ul>
 +
</li>
 +
<li class="divider"></li>
 +
<li class="has-dropdown"><a href="#">PROJECT</a>
 +
<ul class="dropdown">
 +
<li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Project_Overview">Overview</a></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/zMol_zTree">zTree & zMol</a></li>
 +
<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 class="has-dropdown"><a href="#">Main Item 4</a>
 +
</li>
 +
<li class="divider"></li>
 +
</ul>
 +
</section>
 +
</nav>
 +
<header>
 +
<div id="header-container">
 +
<div class="row">
 +
<div class="large-12 columns">
 +
<h2><img src="https://static.igem.org/mediawiki/2013/0/03/Wellesley_logo.png">Wellesley HCI iGEM 2013</h2>
 +
</div>
 +
</div>
 +
</div>
 +
</header>
<!--End NavBar-->   
<!--End NavBar-->   
 +
<div class="row">
 +
<div class="large-12 columns">
 +
<div class="main-container">
 +
<div id="text-container">
 +
<!--Start content-->
-
<br><br>
 
-
 
-
<!--Actual content-->
 
<h6>Outreach</h6>
<h6>Outreach</h6>
<br>
<br>
Line 512: Line 145:
</div>
</div>
-
<!--END Actual content-->
 
-
<br><br><br><br><br>
+
<!--End content-->
-
</div><!--end wellesley_wiki_content div-->
+
<html>
-
</div>
+
<script src="http://cs.wellesley.edu/~hcilab/igem2013/whci_foundation.js"></script>
-
</body>
+
<script src="http://cs.wellesley.edu/~hcilab/igem2013/whci_foundation.abide.js"></script>
 +
<script src="http://cs.wellesley.edu/~hcilab/igem2013/whci_foundation.alerts.js"></script>
 +
<script src="http://cs.wellesley.edu/~hcilab/igem2013/whci_foundation.clearing.js"></script>
 +
<script src="http://cs.wellesley.edu/~hcilab/igem2013/whci_foundation.cookie.js"></script>
 +
<script src="http://cs.wellesley.edu/~hcilab/igem2013/whci_foundation.dropdown.js"></script>
 +
<script src="http://cs.wellesley.edu/~hcilab/igem2013/whci_foundation.forms.js"></script>
 +
<script src="http://cs.wellesley.edu/~hcilab/igem2013/whci_foundation.interchange.js"></script>
 +
<script src="http://cs.wellesley.edu/~hcilab/igem2013/whci_foundation.joyride.js"></script>
 +
<script src="http://cs.wellesley.edu/~hcilab/igem2013/whci_foundation.magellan.js"></script>
 +
<script src="http://cs.wellesley.edu/~hcilab/igem2013/whci_foundation.orbit.js"></script>
 +
<script src="http://cs.wellesley.edu/~hcilab/igem2013/whci_foundation.placeholder.js"></script>
 +
<script src="http://cs.wellesley.edu/~hcilab/igem2013/whci_foundation.reveal.js"></script>
 +
<script src="http://cs.wellesley.edu/~hcilab/igem2013/whci_foundation.section.js"></script>
 +
<script src="http://cs.wellesley.edu/~hcilab/igem2013/whci_foundation.tooltips.js"></script>
 +
<script src="http://cs.wellesley.edu/~hcilab/igem2013/whci_foundation.topbar.js"></script>
 +
  <script>
 +
    $(document).foundation();
 +
  </script>
</html>
</html>

Revision as of 01:08, 9 September 2013

Wellesley HCI iGEM Team: Outreach

Wellesley HCI iGEM 2013

Outreach

Overview

At the Wellesley HCI Lab, we are committed to fostering education, and strongly believe in the power of mentorship. The 2013 Wellesley iGEM team worked toward achieving this goal by promoting Synthetic Biology public education and awareness with our outreach project Bac to the Future. By demonstrating this project in various public settings, including with groups of middle school and high school students, we focused on making Synthetic Biology concepts fun and accessible to students and non-scientists. Additionally, we participated in the Wellesley College Science Outreach program and mentored high school interns in the human-computer interaction lab throughout the summer.



MIT-Wellesley Upward Bound

We performed three user studies for Bac to the Future with the MIT-Wellesley Upward Bound program, student ages ranging from 12-17. To prepare for these studies and explore the potential use of our application in an educational setting, we prepared a brief preliminary presentation to introduce Synthetic Biology concepts and terminology, and also performed a project demonstration. The students then worked through the application in groups of 2 or more.



Interns

Throughout the summer, we had four high schools interns join the HCI Lab: Neoreet Braha, Artemis Metaxa, and Yoav Segev. Each intern was paired with lab mentors, and assisted with project development and execution. In the process, they learned about Human-Computer Interaction, user-centered design, Synthetic Biology, and programming skills.



Summer Poster Session

As a lab, we participated in the annual Wellesley Science Center Summer Research Poster Session, which is attended by students, faculty, and members of the local community. Each project team prepared and displayed a poster outlining the project abstract, design process, results, and future work. We also performed on-site demonstrations.


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