Difference between revisions of "Team:Dalhousie/Human Practices"

 
(204 intermediate revisions by 4 users not shown)
Line 1: Line 1:
−
<html lang="en">
+
<html>
 +
<head>
 +
<style>
 +
#bg-video {
 +
        position: fixed;
 +
        top: 0;
 +
        right: 0;
 +
        bottom: 0px;
 +
        left: 0;
 +
        overflow: hidden;
 +
        z-index: -100;
 +
        width:100%;
 +
 
 +
}
 +
</style>
  
−
<head>
 
 
<!--glyphicons-->
 
<!--glyphicons-->
 
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
 
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
 +
  <link  rel="stylesheet" href="https://2017.igem.org/Team:Dalhousie/libraries/css/Bootstrap?action=raw&ctype=text/css" />
 +
  <link rel="stylesheet" href="https://2017.igem.org/Team:Dalhousie/libraries/css/fonts?action=raw&ctype=text/css" />
 +
<link rel="stylesheet" href="https://2017.igem.org/Team:Dalhousie/css3?action=raw&ctype=text/css" />
  
−
<!--just added all this shit-->
+
<!--------------------oldnavbar--------------->
 +
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  
−
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
 
−
<script>
 
−
$(document).ready(function(){
 
−
  // Add smooth scrolling to all links
 
−
  $("a").on('click', function(event) {
 
  
−
    // Make sure this.hash has a value before overriding default behavior
+
<!-------------------------------------need this--------------------------->
−
    if (this.hash !== "") {
+
<style>
−
      // Prevent default anchor click behavior
+
#home_logo, #sideMenu { display:none; }
−
      event.preventDefault();
+
#sideMenu, #top_title, .patrollink  {display:none;}
−
 
+
#content { width:100%; padding:0px;  margin-top:-20px; margin-left:0px; background-color: white;}
−
      // Store hash
+
body {background-color:white; }
−
      var hash = this.hash;
+
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 10px;  background-color: transparent; z-index:100;}
−
 
+
         .jumbotron {
−
      // Using jQuery's animate() method to add smooth page scroll
+
            height: 850px;
−
      // The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area
+
            position: relative;
−
      $('html, body').animate({
+
         
−
        scrollTop: $(hash).offset().top
+
            }
−
      }, 800, function(){
+
.navbar-default .navbar-nav>.active>a, .nav > li > a:hover, .nav > li > a:focus {
−
 
+
  background-color: #C1D35D;
−
         // Add hash (#) to URL when done scrolling (default click behavior)
+
  text-decoration: none;
−
        window.location.hash = hash;
+
−
      });
+
−
    } // End if
+
−
  });
+
−
});
+
−
</script>
+
−
 
+
−
 
+
−
<style>
+
−
body, html, .main {
+
−
    height: 100%;
+
 
}
 
}
 +
</style>
  
−
section {
 
−
    min-height: 100%;
 
−
}
 
  
 +
</head>
  
−
<!--fullpage settings-->
+
<body >
−
#home_logo, #sideMenu { display:none; }
+
−
#sideMenu, #top_title, .patrollink  {display:none;}
+
−
#content { width:100%; padding:0px;  margin-top:-42px; margin-left:0px; margin-bottom:50px;}</style>
+
  
  
 +
<!-------------------navbar---------------------->
 +
<div id="nav" class="noBackground" style="width:100%; z-index:100;" >
 +
            <div class="inner" >
 +
<div id="navWrap">
 +
    <nav >
 +
<div class="container-fluid">
 +
    <ul class="nav navbar-nav navbar-center">
  
−
    <meta charset="utf-8">
+
      <li class="active" ><a href="https://2017.igem.org/Team:Dalhousie" style=" color: white;">Home</a></li>
−
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+
−
    <meta name="viewport" content="width=device-width, initial-scale=1">
+
  
−
    <title>Dalhousie iGem</title>
+
<li class="dropdown" >
 +
        <a class="dropdown-toggle" data-toggle="dropdown" href="#" style=" color: white;">Project
 +
        </a>
 +
        <ul class="dropdown-menu" style=" background-color: rgba(193,211,93,0.8);">
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Description"  >Description</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Design">Design</a></li>
 +
<li><a href="https://2017.igem.org/Team:Dalhousie/Requirements">Requirements</a></li>
  
−
    <!-- Bootstrap Core CSS -->
+
        </ul>
−
  <link href="https://2017.igem.org/wiki/index.php?title=Team:Dalhousie/bootstrapmincss&action=raw&ctype=text/css" rel="stylesheet">
+
      </li>
  
−
<!-- Custom Fonts -->
+
<li class="dropdown">
−
<link href="https://2017.igem.org/wiki/index.php?title=Team:Dalhousie/fontawesome?action=raw&ctype=text/css" rel="stylesheet" type="text/css">
+
        <a class="dropdown-toggle" data-toggle="dropdown" href="#" style=" color: white;">Results
−
    <link href="https://fonts.googleapis.com/css?family=Lora:400,700,400italic,700italic" rel="stylesheet" type="text/css">
+
        </a>
−
    <link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet" type="text/css">
+
        <ul class="dropdown-menu" style=" background-color: rgba(193,211,93,0.8);">
−
    <link href="https://2017.igem.org/Team:Dalhousie/libraries/css/fonts?action=raw&ctype=text/css" rel="stylesheet" type="text/css">
+
          <li><a href="https://2017.igem.org/Team:Dalhousie/InterLab">Interlab</a></li>
 +
  <li><a href="https://2017.igem.org/Team:Dalhousie/Results">Results</a></li>
 +
        </ul>
 +
</li>  
  
 +
 
 +
<li class="dropdown">
 +
        <a class="dropdown-toggle" data-toggle="dropdown" href="#" style=" color: white;">Team
 +
        </a>
 +
        <ul class="dropdown-menu" style=" background-color: rgba(193,211,93,0.8);">
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Team">Team</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Collaborations">Collaborations</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Attributions">Attributions</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Sponsors">Sponsors</a></li>
 +
        </ul>
 +
</li>
  
−
<!-- Theme CSS -->
+
<li class="dropdown">
−
<link href="https://2017.igem.org/wiki/index.php?title=Team:Dalhousie/grayscale&action=raw&ctype=text/css" rel="stylesheet">
+
        <a class="dropdown-toggle" data-toggle="dropdown" href="#" style=" color: white;">Human Practices
 +
        </a>
 +
        <ul class="dropdown-menu" style=" background-color: rgba(193,211,93,0.8);">
 +
        <li><a href="https://2017.igem.org/Team:Dalhousie/Human_Practices">Summary</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/HP/Silver">Science Communication</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/HP/Gold_Integrated">Integrated and Gold</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Engagement">Public Engagement</a></li>
 +
<li><a href="https://2017.igem.org/Team:Dalhousie/SocialMedia">Social Media</a></li>
 +
     
  
−
   
+
         </ul>
−
<!------------------------no idea what this is-------------------------->
+
      </li>
−
    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
+
−
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
+
−
    <!--[if lt IE 9]>
+
−
         <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
+
−
        <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
+
−
    <![endif]-->
+
−
</head>
+
  
−
<!----------------------------------------------navbarshit---------------------------------------------->
+
<li class="dropdown">
 +
        <a class="dropdown-toggle" data-toggle="dropdown" href="#" style=" color: white;">Lab
 +
        </a>
 +
        <ul class="dropdown-menu" style=" background-color: rgba(193,211,93,0.8);">
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Parts">Parts</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Safety" >Safety</a></li>
 +
            <li><a href="https://2017.igem.org/Team:Dalhousie/Experiments">Experiments</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Notebook">Notebook</a></li>
 +
<li><a href="https://2017.igem.org/Team:Dalhousie/Improve">Improve</a></li>
 +
        </ul>
 +
      </li>
  
 +
     
  
−
  <meta charset="utf-8">
 
−
  <meta name="viewport" content="width=device-width, initial-scale=1">
 
−
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
 
−
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
 
−
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
 
−
</head>
 
  
  
 +
    </ul>
  
  
  
−
    <!------------------------------------------------------------------------------- Navbar -------------------------------------------------------------------------->
+
<!--------------------------contact us------------------------------------------>
−
<nav class="navbar navbar-inverse navbar-fixed-bottom">
+
−
  <div class="container-fluid">
+
−
   
+
−
    <ul class="nav navbar-nav navbar-center">
+
−
      <li><a href="https://2017.igem.org/Team:Dalhousie/anothertest">Home</a></li>
+
−
      <li class="dropdown">
+
−
        <a class="dropdown-toggle" data-toggle="dropdown" href="#">The Project
+
−
        <span class="caret"></span></a>
+
−
        <ul class="dropdown-menu">
+
−
          <li><a href="#">Design</a></li>
+
−
          <li><a href="#">Experiments</a></li>
+
−
          <li><a href="#">Notebook</a></li>
+
−
          <li><a href="#">Results</a></li>
+
−
          <li><a href="#">Safety</a></li>
+
−
        </ul>
+
−
      </li>
+
−
 
+
−
      <li><a href="#">Our Team</a></li>
+
−
      <li><a href="#">Attributions</a></li>
+
−
<li><a href="#">Outreach</a></li>
+
−
<li class="active"><a href="https://2017.igem.org/Team:Dalhousie/Human_Practices">Human practices</a></li>
+
−
    </ul>
+
 
<ul class="nav navbar-nav navbar-right">
 
<ul class="nav navbar-nav navbar-right">
 
     <div class="navbar-header">
 
     <div class="navbar-header">
−
       <a class="navbar-brand" >Contact us today </a>
+
       <a class="navbar-brand" style=" color: white;">Contact us today </a>
 
     </div>
 
     </div>
 
<li>
 
<li>
−
                         <a href="mailto:igemdalhousie@gmail.com" ><i class="fa fa-google-plus fa-fw"></i> <span class="network-name"></span></a>
+
                         <a href="mailto:igemdalhousie@gmail.com" ><i class="fa fa-envelope-o fa-fw" style=" color: white;"  ></i> <span class="network-name"></span></a>
 
                     </li>
 
                     </li>
 
<li>
 
<li>
−
                         <a href="https://twitter.com/dalhousie_igem?lang=en" ><i class="fa fa-twitter fa-fw"></i> <span class="network-name"></span></a>
+
                         <a target="_blank" href="https://twitter.com/dalhousie_igem?lang=en" ><i class="fa fa-twitter fa-fw" style=" color: white;" ></i> <span class="network-name"></span></a>
 
                     </li>
 
                     </li>
 
                     <li>
 
                     <li>
−
                         <a href="https://www.facebook.com/Dalhousie.iGEM/" ><i class="fa fa-facebook fa-fw"></i> <span class="network-name"></span></a>
+
                         <a target="_blank" href="https://www.facebook.com/Dalhousie.iGEM/" ><i class="fa fa-facebook fa-fw" style=" color: white;" ></i> <span class="network-name"></span></a>
 
                     </li>
 
                     </li>
 +
 
     </ul>
 
     </ul>
 
   </div>
 
   </div>
 
</nav>
 
</nav>
−
   
+
</div>
−
             
+
            </div>
 +
        </div>
 +
 
 +
 
 +
 
 +
 
 +
 
 +
        <div class="panel" id="panel1" >
 +
 
 +
            <div class="inner" >
 +
<div class="top" ><div class="title" >Human Practices</div></div>
 +
 
 +
 
 +
<img src= "https://static.igem.org/mediawiki/2017/0/0d/Dal_GS_Try1.jpg" style="top:0px; left:0px; padding-bottom:0px; position:fixed; width:100%; height: 100%; z-index:-100; " align="center" height="70%" width="70%">
 +
 
 +
 
 +
<!--------------------------------fade title---------------------------->
 +
<style>body {
 +
  margin: 0;
 +
  height: 10px;
 +
}
 +
 
 +
.top {
 +
 
 +
  margin-top: 350px;
 +
  position: absolute;
 +
width:65%;
 +
  left:250px;
 +
  background-color: transparent;
 +
  height: 150px;
 +
  text-align: center;
 +
  font-family: 'Trebuchet MS';
 +
  font-size: 80px;
 +
  font-weight: 400;
 +
  color: white;
 +
line-height: 60px;
 +
}
 +
 
 +
.title {
 +
  position: relative;
 +
top: 30%;
 +
 
 +
  left: 0px;
 +
}
  
 +
</style>
  
 +
<!---------------------------------------------------------------------------------this------------------------------------------------------------------------------------------->
 +
<script> $(window).scroll(function(){
 +
    $(".top").css("opacity", 1 - $(window).scrollTop() / 400);
 +
  });</script>
  
−
       
 
−
<!-- Intro Header -->
 
−
    <header class="intro">
 
−
        <div class="intro-body">
 
−
            <div class="container">
 
−
                <div class="row">
 
−
                    <div class="col-md-8 col-md-offset-2">
 
−
                        <h1 class="brand-heading">Human Practices</h1>
 
−
                     
 
−
                        <a href="#about" class="btn btn-circle page-scroll">
 
  
−
                            <span class="caret"></span>
+
            </div>
−
                        </a>
+
        </div>
−
                    </div>
+
 
−
                </div>
+
 
 +
 
 +
        <div class="panel" id="panel2">
 +
            <div class="inner" >
 +
</br></br>
 +
<div style="background-color: rgba(35,47,19,1); width: 95%; padding-left: 50px; padding-right: 50px; float: center; margin-top: 20px; margin-left: 30px;">
 +
<h1><font color= "#C1D35D"> Human Practices Summary </font>
 +
</h1></br>
 +
 
 +
<font color= "#C1D35D">Background</font></br>
 +
 
 +
Over the past decade, sharing science-based news articles online has become common practice. However, due to heavy scientific jargon, understanding and interpreting these articles can be challenging. Accordingly, along with the rise of “fake news”, the Human Practices Team has decided to promote scientific literacy and communication alongside our research.</br></br>
 +
 
 +
<font color= "#C1D35D">Our Blog</font></br>
 +
 
 +
Our main human practices initiative was partnering with PLoS Journals to establish the Think of the PLoSibilities blog. We wanted to help extend the reach of PLoS articles by writing engaging, scientifically-accessible summaries for the general public. We recognized that clear lay science writing is key to engaging the general public and promoting science literacy. In the future, we hope to help other iGEM teams establish their own blogs. This way there will be a network of blogs under the PLoS banner all working to promote science literacy. For more details, please refer to the <a href="https://2017.igem.org/Team:Dalhousie/Engagement" style="color: #C1D35D">public engagement</a> page.</br></br>
 +
 
 +
<font color= "#C1D35D">Survey</font></br>
 +
 
 +
We surveyed more than 250 people from diverse educational and cultural backgrounds to assess comfort in interpreting and sharing science-based news. These results helped us formulate questions to discuss with our panel of experts, including professional science communicators, science professors, students, and members of the general public. We then published a “how-to” infographic, inspired by our survey and interview results, about reading science-based news. For more details, please refer to the <a href="https://2017.igem.org/Team:Dalhousie/HP/Silver" style="color: #C1D35D">science communication</a> page.</br></br>
 +
 
 +
<font color= "#C1D35D">Outreach and Education</font></br>
 +
 
 +
In addition to our science communication efforts, we advocated for scientific literacy in the Halifax community. A huge part of our work was geared towards getting young children and students engaged in science. We hosted several workshops collaborating with SHAD Valley, SuperNOVA summer camps at Dalhousie University, and the Discovery Centre. For each session, we devised simple scientific experiments that equipped participants with new laboratory techniques and ended with insightful discussions. For more details, please refer to the <a href="https://2017.igem.org/Team:Dalhousie/Engagement" style="color: #C1D35D">public engagement</a> page.</br></br>
 +
 
 +
 
 +
<font color= "#C1D35D">Integrated Human Practices</font></br>
 +
 
 +
Finally, we integrated science communication and science literary into our overall design. We talked with experts to see how we could improve/ develop our project, we explored the safety of our project, and we met with a local fermentation company, BioVectra, to discuss how to commercialize our idea. Furthermore, we put our science communication skills to the test and practiced presenting our project to different audiences. For more details, please refer to the <a href="https://2017.igem.org/Team:Dalhousie/HP/Gold_Integrated" style="color: #C1D35D">integrated and gold</a> page.</br></br>
 +
 
 +
 
 +
<!-------------------------------------------------------------------HELP--------------------------------------------------------------------------------------------------->
 +
<div class="row" style="justify-content: center;">
 +
<div class="col-md-3"><a href="https://2017.igem.org/Team:Dalhousie/HP/Silver"><img src="https://static.igem.org/mediawiki/2017/6/66/Team--Dalhousie--speech.png" width="100%" height="100%"/>
 +
</a></div>
 +
<div class="col-md-3"><a href="https://2017.igem.org/Team:Dalhousie/HP/Gold_Integrated"><img src= "https://static.igem.org/mediawiki/2017/8/85/Dal_gears.png" width="100%" height="100%" />
 +
    </a></div>
 +
<div class="col-md-3"><a href="https://2017.igem.org/Team:Dalhousie/Engagement"><img src= "https://static.igem.org/mediawiki/2017/a/aa/Ruler.png" width="100%" height="100%"/>
 +
    </a></div>
 +
<div class="col-md-3"><a href="https://2017.igem.org/Team:Dalhousie/SocialMedia"><img src= "https://static.igem.org/mediawiki/2017/b/b4/Comp2.png" width="100%" height="100%" />
 +
    </a></div>
 +
</div>
 +
 
 +
<div class="row" style="justify-content: center;">
 +
<div class="col-md-3">
 +
<p style="font-size: 25px; color: #C1D35D;text-align:center;">Science Community</p>
 +
</div>
 +
<div class="col-md-3">
 +
<p style="font-size: 25px; color: #C1D35D;text-align:center;">Integrated Human Practices</p>
 +
</div>
 +
<div class="col-md-3">
 +
<p style="font-size: 25px; color: #C1D35D;text-align:center;">Public Engagement</p>
 +
</div>
 +
<div class="col-md-3">
 +
<p style="font-size: 25px; color: #C1D35D;text-align:center;">Social Media</p>
 +
</div>
 +
</div>
 +
</div style>
 +
<!---------------------------forcircle--------------------->
 +
<style>
 +
 
 +
.talkbubble {
 +
  position: relative;
 +
  width: 150px;
 +
  height: 100px;
 +
  padding: 10px;
 +
margin-top: 50px;
 +
margin-left: 50px;
 +
  border-radius: 5px;
 +
  border: white;
 +
  background: white;
 +
float: left;
 +
}
 +
 
 +
.talkbubble:before {
 +
  content:"";
 +
  position: absolute;
 +
  right: 100%;
 +
  top: 26px;
 +
  width: 0;
 +
  height: 0;
 +
  border-top: 13px solid transparent;
 +
  border-right: 26px solid white;
 +
  border-bottom: 13px solid transparent;
 +
float: left;
 +
}
 +
 
 +
 
 +
.circle1 {
 +
position: relative;
 +
float: left;
 +
margin-left:30px;
 +
    height: 200px;
 +
    width: 200px;
 +
    border-radius: 50%;
 +
  background-color: #C1D35D;
 +
text-align: center;
 +
color: black;
 +
}
 +
.link-spanner{
 +
  position:absolute;
 +
  width:100%;
 +
  height:100%;
 +
  top:0;
 +
  left: 0;
 +
  z-index: 1;
 +
} 
 +
 
 +
</style>
 
             </div>
 
             </div>
 
         </div>
 
         </div>
−
    </header>
 
  
−
    <!-- About Section -->
 
−
 
 
−
    <section id="about" class="container content-section text-center">
 
−
        <div class="row">
 
−
            <div class="col-lg-8 col-lg-offset-2">
 
−
           
 
−
         
 
−
             
 
  
 +
<div class="container" style="height:450px; width:100%; position: relative;"><!--------empty panel---------->
 +
</div>
  
−
<p style="text-align:center">  
+
 
−
As we progress through our project collaborating with industry, community and academia, we have noticed just how important science communication is. Selling our story has been important for getting funding, initiating community support and presenting to groups at Dalhousie University who aren’t versed in synthetic biology. As we reflected on how important science communication is, we broadened our scope to Halifax’s recent measles outbreaks and saw just how much pain science miscommunication can cause.  
+
              <div class="panel panel-red" id="panel3">
−
Our goal this year is to better understand the scope of scientific literacy within the general public through a survey asking ten short questions on how people read scientific media ( interested? Here’s the link). This information will allow us to draw some conclusions about people's reading and sharing habits online. This can then be used to interview science communicators, media outlets, scientists and members of the general public to get more fleshed out opinions on how science communication can improve, and how miscommunication can be spotted in the media. From this, we would like to create a webpage describing how to maneuver science communication and scientific media in the mainstream, with specific tips on how to spot fake articles. Our overarching goal is to discover ways science communication can progress to make science more accessible, and in the meantime create a document to help guide people through the maze of real science news and fake science news.
+
<p style="text-align: center; ">
−
</p>
+
<a href="http://www.plosibilities.wordpress.com"><img src="https://static.igem.org/mediawiki/2017/archive/8/8c/20171031235427%21Dalscreen.png" height="20%" width="20%" ></a>
−
               
+
<img src="https://static.igem.org/mediawiki/parts/d/d7/Porcupinelogo2017.png" height="20%" width="20%" >
−
               
+
<img src="https://static.igem.org/mediawiki/2017/e/ef/Whitetigerlogo.png" height="20%" width="20%" >
−
          </div>
+
</p>
 
         </div>
 
         </div>
−
  </section>
 
  
−
 
 
  
−
 
+
<style>
 +
html {
 +
height: 100%;
 +
min-height: 100%;
 +
}
  
 +
body {
 +
height: 100%;
 +
}
  
 +
.panel {
 +
width: 100%;
 +
height: 100%;
 +
background: black;
 +
color: #fff;
 +
padding-left: 5%;
 +
padding-right: 5%;
 +
text-align: center;
 +
}
  
−
    <!-- jQuery -->
 
−
    <script src="https://2017.igem.org/wiki/index.php?title=Team:Dalhousie/jquery&action=raw&ctype=script/js"></script>
 
  
−
    <!-- Bootstrap Core JavaScript -->
 
−
    <script src="https://2017.igem.org/wiki/index.php?title=Team:Dalhousie/bootstrapminjs&action=raw&ctype=script/js"></script>
 
  
−
    <!-- Plugin JavaScript -->
 
−
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
 
  
−
   
 
  
−
    <!-- Theme JavaScript -->
+
.panel.panel-red {
−
    <script src="https://2017.igem.org/wiki/index.php?title=Team:Dalhousie/grayscaleminjs&action=raw&ctype=script/js"></script>
+
background: black;
  
−
</body>
+
}
 +
#nav {
 +
position: fixed;
 +
top: 0;
 +
left: 0;
 +
width: 96%;
 +
padding: 2%;
 +
z-index: 100;
 +
color: white;
 +
height: 80px;
 +
}
  
−
</html>
+
.noBackground {
 +
background-color: rgba(0,0,0,0);
 +
visibility: visible;
 +
width:100%;
 +
padding-right:0px;
 +
    -webkit-transition: all 1.0s ease;
 +
    -moz-transition: all 1.0s ease;
 +
    -o-transition: all 1.0s ease;
 +
    transition: all 1.0s ease;
 +
}
 +
 
 +
.blackBackground {
 +
background-color: rgba(35,47,19,0.7);
 +
visibility: visible;
 +
width:100%;
 +
 
 +
}
 +
 
 +
#nav .inner {
 +
z-index:100;
 +
padding-bottom:40px;
 +
 
 +
}
 +
 
 +
#nav ul {
 +
list-style: none;
 +
margin: 0;
 +
padding: 0;
 +
}
 +
 
 +
 
 +
 
 +
#inner{
 +
z-index:101;
 +
 
 +
}
 +
 
 +
#panel1{
 +
background: transparent;
 +
height: 850px;
 +
width:100%;
 +
z-index:100;
 +
}
 +
#panel2{
 +
width:100%;
 +
height: 1500px;
 +
margin-bottom:0px;
 +
background: rgba(35,47,19,0.9);
 +
text-align:left;
 +
 
 +
}
 +
#panel3{
 +
width:100%;
 +
height: 100%;
 +
margin-bottom:-100px;
 +
background: rgba(35,47,19,0.9);
 +
}
 +
 
 +
 
 +
 
 +
 
 +
</style>
 +
<script>
 +
$( function() {
 +
//caches a jQuery object containing the header element
 +
var header = $('.noBackground');
 +
$(window).scroll(function() {
 +
var scroll = $(window).scrollTop();
 +
 
 +
if (scroll >= 100) {
 +
header.addClass('blackBackground');
 +
} else {
 +
header.removeClass('blackBackground');
 +
                     
 +
}
 +
});
 +
});
 +
</script>
 +
 
 +
</body>
 +
<html>

Latest revision as of 03:31, 2 November 2017

Human Practices


Human Practices Summary


Background
Over the past decade, sharing science-based news articles online has become common practice. However, due to heavy scientific jargon, understanding and interpreting these articles can be challenging. Accordingly, along with the rise of “fake news”, the Human Practices Team has decided to promote scientific literacy and communication alongside our research.

Our Blog
Our main human practices initiative was partnering with PLoS Journals to establish the Think of the PLoSibilities blog. We wanted to help extend the reach of PLoS articles by writing engaging, scientifically-accessible summaries for the general public. We recognized that clear lay science writing is key to engaging the general public and promoting science literacy. In the future, we hope to help other iGEM teams establish their own blogs. This way there will be a network of blogs under the PLoS banner all working to promote science literacy. For more details, please refer to the public engagement page.

Survey
We surveyed more than 250 people from diverse educational and cultural backgrounds to assess comfort in interpreting and sharing science-based news. These results helped us formulate questions to discuss with our panel of experts, including professional science communicators, science professors, students, and members of the general public. We then published a “how-to” infographic, inspired by our survey and interview results, about reading science-based news. For more details, please refer to the science communication page.

Outreach and Education
In addition to our science communication efforts, we advocated for scientific literacy in the Halifax community. A huge part of our work was geared towards getting young children and students engaged in science. We hosted several workshops collaborating with SHAD Valley, SuperNOVA summer camps at Dalhousie University, and the Discovery Centre. For each session, we devised simple scientific experiments that equipped participants with new laboratory techniques and ended with insightful discussions. For more details, please refer to the public engagement page.

Integrated Human Practices
Finally, we integrated science communication and science literary into our overall design. We talked with experts to see how we could improve/ develop our project, we explored the safety of our project, and we met with a local fermentation company, BioVectra, to discuss how to commercialize our idea. Furthermore, we put our science communication skills to the test and practiced presenting our project to different audiences. For more details, please refer to the integrated and gold page.

Science Community

Integrated Human Practices

Public Engagement

Social Media