Team:Wellesley Desyne/Outreach

From 2013.igem.org

(Difference between revisions)
 
(90 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">
-
<style type="text/css">
+
<meta name="viewport" content="width=device-width">
 +
<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
 +
<body>
 +
<nav class="top-bar">
 +
<ul class="title-area">
 +
<!-- Title Area -->
 +
<li class="name">
 +
<h1><a href="https://2013.igem.org/Team:Wellesley_Desyne">WHCI</a></h1>
 +
</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>
 +
</ul>
 +
<section class="top-bar-section">
 +
<!-- Left Nav Section -->
 +
<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/zTree">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 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>
 +
<!--End NavBar--> 
 +
<div class="row">
 +
<div class="large-12 columns">
 +
<div class="main-container">
 +
<div id="text-container">
-
/*hide default igem banner and reformat style into blank slate*/
+
<!--Start content-->
-
#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:#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*/
+
<h3>Outreach</h3>
-
body {width: 900px; margin:auto;}
+
-
#bu-wellesley_wiki_content {height:auto; line-height:100%;}
+
<div class="panel" style = "float: right; margin: 5px; padding: 10px; margin-left: 15px;">
-
/*#bu-wellesley_wiki_content a {color:#69d01d;}*/
+
<img src = "https://static.igem.org/mediawiki/2013/7/76/Eugenie_intern.jpg" alt = "Evan and Raquel" width = "175px">
-
#bu-wellesley_wiki_content a:hover {text-decoration:none; color:#3d3f3c;}
+
<figcaption width="175" class="caption">Evan and intern Raquel</figcaption>
 +
</div>
-
.navbar li {color: #transparent;}
+
<h4>Overview</h4>
-
.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)*/
+
<p>At the Wellesley HCI Lab, we are committed to fostering STEM education, passionate about empowering women in the sciences, and strongly believe in the power of mentorship. The 2013 Wellesley iGEM team worked toward achieving these goals 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.</p>
-
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 {
+
<div class="panel" style = "float: right; margin: 5px; padding: 10px; margin-left: 15px;">
-
      font-family: Helvetica;
+
<img src = "https://static.igem.org/mediawiki/2013/5/53/Ub_test_cropped.jpg" alt = "Upward Bound User Test" width = "200px">
-
      text-decoration: none;
+
<figcaption width="200" class="caption">Upward Bound students<br> testing  Bac to the Future</figcaption>
-
      text-align: left;
+
</div>
-
          line-height:120%;
+
-
      /*color: #870203;*/
+
-
      font-size: 10pt;
+
-
      font-weight:normal;
+
-
    }
+
-
/*Page content styles (e.g. welcome, project images)*/
+
<h4>MIT-Wellesley Upward Bound</h4>
-
#comp {
+
-
    float:left;
+
-
    width:400px;
+
-
    height:275px;
+
-
}
+
-
#compimg {
+
-
    float:left;
+
-
    width:470px;
+
-
    margin:0 30px 0 0;
+
-
    background-color:#ebebeb;
+
-
}
+
-
/*Project images with rollover*/
+
<p>We performed three user studies for Bac to the Future with the <a href="http://mitpsc.mit.edu/outreach/program/view/75/search">MIT-Wellesley Upward Bound program</a>, 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. </p>
-
.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"
+
<div class="panel" style = "float: right; margin: 5px; padding: 10px; margin-top:5px; margin-left: 15px;">
-
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+
<img src = "https://static.igem.org/mediawiki/2013/b/b0/Bttf_Interns.jpg" alt = "interns" width = "200px">
-
<html xmlns="http://www.w3.org/1999/xhtml">*/
+
<figcaption  class="caption">Neoreet and Artemis <br> with the art team</figcaption>
 +
</div>
-
/* NON-WEBSAFE FONTS */
+
<h4>Interns</h4>
-
/*@font-face {
+
-
font-family: 'Caviar Dreams';
+
-
src: url('../fonts/CaviarDreams.ttf') format('truetype');
+
-
}*/
+
-
/* MAIN STYLE DEFINITIONS */
+
<p>
-
a{
+
Throughout the summer, we had four high schools interns join the HCI Lab: Neoreet Braha ('17), Artemis Metaxa ('15), Raquel Penha ('15), and Yoav Segev ('15). 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.</p>
-
color:#870203;
+
-
-webkit-transition-duration:0.3s;
+
-
-moz-transition-duration:0.3s;
+
-
-o-transition-duration:0.3s;
+
-
}
+
-
a:hover {
+
<h4>Summer Poster Session</h4>
-
color:#0090FF;
+
<p>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.</p>
-
}
+
-
a:visited{
 
-
color:#870203;
 
-
}
 
-
td
+
<table align="center">
-
{
+
<td>
-
font-family: Helvetica;
+
<img src = "https://static.igem.org/mediawiki/2013/d/d3/Wellesley_Outreach_1.jpg" width = "270px">
-
font-size: 10pt;
+
<img src = "https://static.igem.org/mediawiki/2013/3/3e/Wellesley_outreach_2.jpg" width = "270px">
-
vertical-align: top;
+
<img src = "https://static.igem.org/mediawiki/2013/e/ee/Wellesley_outreach_three.jpg" width= "270px">  
-
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>
+
-
 
+
-
 
+
-
<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://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>
+
-
    </li>
+
-
    <li><a href="https://2013.igem.org/Team:Wellesley_Desyne/Gold">Medal Fulfillment</a></li>
+
-
</ul>
+
-
 
+
-
<!--End NavBar--> 
+
-
 
+
-
 
+
-
<br><br>
+
-
 
+
-
<!--Actual content-->
+
-
<h6>Outreach</h6>
+
<br>
<br>
-
<h1>Overview</h1>
+
<figcaption class="caption">
-
<p>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.</p>
+
Presenting our projects to the Wellesley community
-
<br><br>
+
</figcaption>
-
 
+
</table>
-
<h1>MIT-Wellesley Upward Bound</h1>
+
-
<p>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. </p>
+
-
<br><br>
+
-
 
+
-
<h1>Interns</h1>
+
-
<p>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.</p>
+
-
<br><br>
+
-
 
+
-
<h1>Summer Poster Session</h1>
+
-
<p>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.</p>
+
-
<br>
+
 +
<div class="row">
 +
<hr>
 +
<img src="https://static.igem.org/mediawiki/2013/6/62/Whci_sponsor_logos.png">
 +
</div>
</div>
</div>
-
<!--END Actual content-->
 
-
 
-
<br><br><br><br><br>
 
-
</div><!--end wellesley_wiki_content div-->
 
</div>
</div>
-
</body>
+
<!--End content-->
 +
<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.dropdown.js"></script>
 +
<script src="http://eastmaninteractive.com/igem/whci_foundation.topbar.js"></script>
 +
<script>
 +
$(document).foundation();
 +
</script>
</html>
</html>

Latest revision as of 03:28, 28 September 2013

Wellesley HCI iGEM Team: Welcome

Outreach

Evan and Raquel
Evan and intern Raquel

Overview

At the Wellesley HCI Lab, we are committed to fostering STEM education, passionate about empowering women in the sciences, and strongly believe in the power of mentorship. The 2013 Wellesley iGEM team worked toward achieving these goals 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.

Upward Bound User Test
Upward Bound students
testing Bac to the Future

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
Neoreet and Artemis
with the art team

Interns

Throughout the summer, we had four high schools interns join the HCI Lab: Neoreet Braha ('17), Artemis Metaxa ('15), Raquel Penha ('15), and Yoav Segev ('15). 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.


Presenting our projects to the Wellesley community

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