Difference between revisions of "Team:York"

 
(530 intermediate revisions by 3 users not shown)
Line 1: Line 1:
 
{{:Team:York/Templates/NavigationBar}}
 
{{:Team:York/Templates/NavigationBar}}
−
 
 
<html>
 
<html>
 
<!DOCTYPE html>
 
<!DOCTYPE html>
−
<head>
+
<style>
−
    <style>
+
@media screen and (max-width: 1000px) {
−
 
+
<!--MAKE MOBILE VERSION APPEAR HERE-->
−
    img.hover:hover {
+
}
−
      opacity: 0.7;
+
@media screen and (min-width: 1200px) {
−
    }
+
  .TeamImg {
−
   
+
     height: 25em;
−
    .dropdown {
+
     width: 21em;
−
    position: relative;
+
  }
−
    }
+
}
−
 
+
</style>
−
    .dropdown-content {
+
<body style="background-color: #fff;">
−
    display: none;
+
−
    position: absolute;
+
−
    background-color: #888;
+
−
    min-width: 100px;
+
−
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+
−
    padding: 0;
+
−
    z-index: 1;
+
−
    }
+
−
 
+
−
    .dropdown:hover .dropdown-content {
+
−
    display: block;
+
−
    }
+
−
 
+
−
    .cam-container {
+
−
    background-color: transparent;
+
−
    }
+
−
   
+
−
    .container {
+
−
    background-color: #888;
+
−
    }
+
−
 
+
−
    .mw-content-ltr {
+
−
     background-color: transparent;
+
−
     }
+
−
 
+
−
    #content {
+
−
    background-color: transparent;
+
−
    }
+
−
 
+
−
    #bodyContent {
+
−
    background-color: transparent;
+
−
    }
+
−
 
+
−
    #HQ_page {
+
−
    background-color: transparent;
+
−
    position: relative;
+
−
    left: -20px;
+
−
    bottom: 10px;
+
−
    }
+
−
   
+
−
    </style>
+
−
</head>
+
−
<body style="background-image: url(//2017.igem.org/wiki/images/5/50/YorkBackgroundTest.jpg);">
+
 
<div>
 
<div>
 
     <!-- Header -->
 
     <!-- Header -->
−
     <header class="intro-header" style="background-color: #888; margin: 0px -20px;">
+
     <header class="intro-header" style="background: url(//2017.igem.org/wiki/images/2/27/TeamYork-TemporaryBackground.png); background-size: 100% 100%; background-position:0px 20px;">
−
        <p>
+
−
           
+
−
        </p>
+
 
         <div class="container">
 
         <div class="container">
−
             <div class="intro-message text-center" style = "margin: -80px 0px;">
+
             <div class="intro-message text-center container" style = "margin: 0px 0px;">
−
                <div class="dropdown">
+
                 <br style = “line-height:20px;”><br>
−
                    <img src="https://static.igem.org/mediawiki/2017/3/3f/CampusByNightMarkWoodwardCropped.jpg" style="max-width=100%; max-height=100%; margin:-0px -500px;" alt="Photo credit: Mark Woodward" class="image">
+
                 <h1 style="-webkit-text-stroke: 2px black; color:#fff;">iGEM York 2017</h1>
−
                    <div class="dropdown-content text-left">
+
                 <h1 style="-webkit-text-stroke: 2px black; color:#fff;">DIHM Assisted Co-culture Optimisation</h1>
−
                        <span style="color:#fff; font-size:10px;">Photo credit: Mark Woodward</span>
+
−
                    </div>
+
−
                </div>
+
−
                 <br style = “line-height:10;”><br>
+
−
                 <h1 style="color:#000;">iGEM York 2017</h1>
+
−
                 <h3>DIHM Assisted Co-culture Optimization</h3>
+
−
 
+
−
<head>
+
−
    <meta name="viewport" content="width=device-width, initial-scale=1">
+
−
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+
−
    <style>
+
−
    .fa {
+
−
      padding: 1px;
+
−
      font-size: 30px;
+
−
      width: 30px;
+
−
      text-align: center;
+
−
      text-decoration: none;
+
−
      margin: 5px 2px;
+
−
    }
+
−
 
+
−
    .fa:hover {
+
−
        opacity: 0.7;
+
−
    }
+
−
 
+
−
    .fa-facebook {
+
−
      background: #3B5998;
+
−
      color: white;
+
−
    }
+
−
 
+
−
    .fa-twitter {
+
−
      background: #55ACEE;
+
−
      color: white;
+
−
    }
+
−
 
+
−
    .fa-instagram {
+
−
      background: #125688;
+
−
      color: white;
+
−
    }
+
−
 
+
−
    </style>
+
−
</head>
+
 
</div>
 
</div>
 
             </div>
 
             </div>
 
         </div>
 
         </div>
 
     </header>
 
     </header>
−
 
−
 
−
 
 
     <!-- Page Content -->
 
     <!-- Page Content -->
−
     <section id="teams">
+
  <div class="cam-container" style="background-color: #ddd; color: #000; margin: -50px 0px 0px 0px;">
−
 
+
     <section id="teams" style="padding-bottom: 10px;">
−
         <div class="container">
+
         <div class="container" style="background-color: #fff; border-style: solid; border-color: #000000; border-radius: 25px; padding: 10px 10px 10px 10px;">
−
            <div class="row">
+
                    <div class="row">
 
                 <div class="col-lg-12 text-center">
 
                 <div class="col-lg-12 text-center">
−
                     <h2 class="section-heading">About our project</h2>
+
                     <h1 class="section-heading" style="margin-bottom:-15px;">QWACC: a Quicker Way to Analyse Co-Cultures</h1>
−
                    <h3 class="section-subheading text-muted">A collaboration of the sciences</h3>
+
                     <h4 class="section-subheading">Contact us: <b><a class="text-muted" href="mailto:igemyork@gmail.com" style="color: #000;">igemyork@gmail.com</a></b></h4>
−
                     <h4 class="section-subheading text-muted">Contact us: <b>igemyork@gmail.com</b></h4>
+
 
                     <div>
 
                     <div>
−
                         <a href="//www.facebook.com/igemyork/" class="fa fa-facebook"></a>
+
                         <a href="//www.facebook.com/igemyork/"><img class="social-top social-top-facebook" src="//2017.igem.org/wiki/images/0/0c/Icon-facebook.png" width="32px" height="32px"></a>
−
                         <a href="//twitter.com/igemyork?lang=en" class="fa fa-twitter"></a>
+
                         <a href="//twitter.com/igemyork?lang=en"><img class="social-top social-top-twitter" src="//2017.igem.org/wiki/images/6/6f/Icon-twitter.png" width="32px" height="32px"></a>
−
                         <a href="//www.instagram.com/igemyork/" class="fa fa-instagram"></a>
+
                         <a href="//www.instagram.com/igemyork/"><img class="social-top social-top-instagram" src="//2017.igem.org/wiki/images/5/51/Icon-instagram.png" width="32px" height="32px"></a>
 
                   </div>
 
                   </div>
 
                 </div>
 
                 </div>
 
             </div>
 
             </div>
−
           
+
        <hr>
 
             <div class="row text-center">
 
             <div class="row text-center">
 
                 <div class="col-md-4">
 
                 <div class="col-md-4">
−
                    <span class="fa-stack fa-4x">
+
                         <a href="//2017.igem.org/Team:York/Results#Modifying-Chlamydomonas">
−
                         <a href="#">
+
                         <img class="Iconlink" src="//2017.igem.org/wiki/images/1/1c/TeamYork-BiologyIcon.png" width="100px" height="100px">
−
                         <i class="fa fa-circle fa-stack-2x text-primary" style="font-size:100px; padding: 1px; width: 100px; text-align:center; margin:50px 20px;"></i>
+
−
                        <i class="fa fa-flask fa-stack-1x fa-inverse" style="font-size:60px; padding: 1px; width: 100px; text-align:center; margin:30px 20px;"></i>
+
 
                         </a>
 
                         </a>
−
                    </span>
 
 
                     <h4 class="service-heading">Biology</h4>
 
                     <h4 class="service-heading">Biology</h4>
−
                     <p class="text-muted">Genetically engineering <em>C. reinhardtii</em> and <em>E. coli</em> in order to form a co-culture to allow the creation of biofuels. </p>
+
                     <p class="text-muted" style="font-size:0.8em; text-align: center; margin-right: 5px; margin-left: 5px;">Genetically engineering <em>C. reinhardtii</em> and <em>E. coli</em> in order to form a co-culture with industrial potentials. </p>
 
                 </div>
 
                 </div>
−
               
+
 
 
                 <div class="col-md-4">
 
                 <div class="col-md-4">
−
                    <span class="fa-stack fa-4x">
+
                         <a href="//2017.igem.org/Team:York/Hardware">
−
                         <a href="#">
+
                         <img class="Iconlink" src="//2017.igem.org/wiki/images/a/a5/TeamYork-HardwareIcon.png" width="100px" height="100px">
−
                         <i class="fa fa-circle fa-stack-2x text-primary" style="font-size:100px; padding: 1px; width: 100px; text-align:center; margin:50px 20px;"></i>
+
−
                        <i class="fa fa-cogs fa-stack-1x fa-inverse" style="font-size:50px; padding: 1px; width: 100px; text-align:center; margin:30px 17px;"></i>
+
 
                         </a>
 
                         </a>
−
                    </span>
 
 
                     <h4 class="service-heading">Hardware</h4>
 
                     <h4 class="service-heading">Hardware</h4>
−
                     <p class="text-muted">Using optical diffraction to create and probe 3D images through holography in order to monitor co-cultures.</p>
+
                     <p class="text-muted" style="font-size:0.8em; text-align: center; margin-right: 5px; margin-left: 5px;">Using optical diffraction to create and probe 3D images through holography in order to monitor co-cultures.</p>
 
                 </div>
 
                 </div>
 
              
 
              
 
                 <div class="col-md-4">
 
                 <div class="col-md-4">
−
                    <span class="fa-stack fa-4x">
+
                         <a href="//2017.igem.org/Team:York/Software">
−
                         <a href="#">
+
                         <img class="Iconlink" src="//2017.igem.org/wiki/images/0/0d/TeamYork-SoftwareIcon.png" width="100px" height="100px">
−
                         <i class="fa fa-circle fa-stack-2x text-primary" style="font-size:100px; padding: 1px; width: 100px; text-align:center; margin:50px 20px;"></i>
+
−
                        <i class="fa fa-code fa-stack-1x fa-inverse" style="font-size:60px; padding: 1px; width: 100px; text-align:center; margin:30px 20px;"></i>
+
 
                         </a>
 
                         </a>
−
                    </span>
 
 
                     <h4 class="service-heading">Software</h4>
 
                     <h4 class="service-heading">Software</h4>
−
                     <p class="text-muted">Taking images using the hardware and turning this into a holograph, then analysing this image to optimise co-cultures.</p>
+
                     <p class="text-muted" style="font-size:0.8em; text-align: center; margin-right: 5px; margin-left: 5px;">Cell counting and analysis using holograms formed from images taken with our hardware.</p>
−
                </div>
+
−
            </div>
+
−
           
+
−
            <div class="row description-text">
+
−
                <div class="col-md-7">
+
−
                    <p>With the decreasing supply but increasing demand for fossil fuels, biofuels are a renewable alternative to help cope with our growing energy needs. We aim to develop and optimize a stable microbial co-culture system whereby the source of energy is light, and carbon flows from CO&#8322; in the atmosphere to synthesise a biofuel. This simple synthetic microbial community will comprise <em>Chlamydomonas reinhardtii</em>, an algae, that will produce sugars through photosynthesis to feed the biofuel-producing <em>Escherichia coli</em>, ideally resulting in a growth system that could reduce the cost of feedstock materials for biofuel production. However, their differing growth rates would likely result in an unstable system in which one organism might outgrow the other.</p>
+
−
                </div>
+
−
 
+
−
                <div class="col-md-5 description-images" style="background-image: url(//2017.igem.org/wiki/images/c/c9/IGEM-York-Biology-Overview.jpg); background-size: cover; background-position: 0px -100px; background-repeat: no-repeat;">
+
−
                <br style="line-height:12;">
+
−
                </div>
+
−
            </div>
+
−
           
+
−
            <div class="row description-text">
+
−
                <div class="col-md-5 description-images" style="background-image: url(//2017.igem.org/wiki/images/b/b4/IGEM-York-Hardware2-Overview.png); background-size: cover; background-position: 0px 0px; background-repeat: no-repeat;">
+
−
                  <!--img class="description-images" src="https://static.igem.org/mediawiki/2017/5/5c/IGEM-York-Hardware-Overview.jpg" width="470px" height="220px"-->
+
−
                  <br style="line-height:12;">
+
−
                </div>
+
−
           
+
−
                <div class="col-md-7">
+
−
                    <p>To monitor the ratio of <em>C. reinhardtii</em> to <em>E. coli</em>, we will be using Digital Holographic Microscopy (DHM). This involves illuminating a sample of the co-culture with a laser and observing the diffraction pattern formed by the microbes. This pattern is sensitive to the wavelength of the laser light, the distance from the co-culture sample and the shape, size and position of the microbes. The mathematical and physical relationship between these quantities is well described, so we can calculate what the cross-section of the sample would look like at various levels. This allows us to form a stack of 2D images which, when combined, represent the 3D sample. We can then analyse this stack of images to track the number of each type of microbe present.</p>
+
−
                </div>
+
−
            </div>
+
−
           
+
−
            <div class="row description-text">
+
−
                <div class="col-md-7">
+
−
                    <p>Images are taken from a Raspberry Pi computer and sent to a Windows machine where a piece of MATLAB code forms a stack of 2D images which, when combined, represent the 3D sample. We can then analyse this stack of images to establish the number of each type of microorganism present in the co-culture. From this information we will be able to compare these results to our mathematical model, where we can then modify the conditions of the co-culture through the use of the Raspberry Pi in order to optimise the growth of the bacteria, which will then increase output of the ethanol from the system. The whole process is tied together through a Windows Application written in C#, allowing a user to fully control the system without any interaction with the code itself.</p>
+
−
                </div>
+
−
                </style>
+
−
               
+
−
                <div class="col-md-5">
+
−
                    <img class="description-images" src="img/promo/coding.jpg">
+
 
                 </div>
 
                 </div>
 
             </div>
 
             </div>
 
         </div>
 
         </div>
−
    </section>
+
</section>
−
   
+
<div class="cam-container" style="background-color: #dddddd; color: #444444;">
−
    <!-- Footer >
+
<section id="Project-Intro" style="padding-top: 10px; padding-bottom: 20px; margin-top: 0px;">
−
    <footer>
+
  <br>
−
        <div class="container">
+
  <div class="container" style="background-color: rgb(250,250,250); color: #000000; border-style: solid; border-color: #000000; border-radius: 25px;">
−
            <ul class="list-inline">
+
    <div class="text-center">
−
                <li class="list-inline-item">
+
      <h1>The Project</h1>
−
                    <a href="#">Home</a>
+
      <br>
−
                </li>
+
      <p style="text-align: center; font-size: 20px;">Upon being asked to find the number of microorganisms in a given sample, the response from members of our iGEM team has invariably been a long sigh and a plea to the realms of the supernatural. <br><br>That most human quality - laziness - alongside flaws in traditional techniques, which we will revisit below, has led to us designing a potential solution in the form of a Digital Inline Holographic Microscope (DIHM). <br><br>In particular, we discovered that, when studying co-cultures, there are precious few methods of counting cells that are accurate, fast, cheap and non-destructive. <br><br>We decided, therefore, to try to bring together two promising areas of science in this project: <br>Digital Holographic Microscopy and Co-Culturing.</p>
−
                <li class="footer-menu-divider list-inline-item">&sdot;</li>
+
      <br style="line-size: 10px;">
−
                <li class="list-inline-item">
+
    </div>
−
                    <a href="#about">About</a>
+
  </div>
−
                </li>
+
</section>
−
                <li class="footer-menu-divider list-inline-item">&sdot;</li>
+
</div>
−
                <li class="list-inline-item">
+
<div class="cam-container" style="background-color: #ddd; color: #000;">
−
                    <a href="#services">Services</a>
+
<section style="padding-top: 10px; padding-bottom: 20px; margin-top: 0px;">
−
                </li>
+
  <div class="container" style="background-color: rgb(250,250,250); color: #000000; border-style: solid; border-color: #000000; border-radius: 25px;">
−
                <li class="footer-menu-divider list-inline-item">&sdot;</li>
+
    <div class="text-center">
−
                <li class="list-inline-item">
+
      <h1>Our Work</h1>
−
                    <a href="#contact">Contact</a>
+
    </div>
−
                </li>
+
    <div class="text-left" style="margin: 0px;">
−
            </ul>
+
      <p style="font-size: 18px; text-align: center;">To easily find our achievements with respect to the iGEM 2017 competition, please see our <a style="color: #0000ff;" href="//2017.igem.org/Team:York/Achievements">Achievements</a> page for a list of direct links.</p>
−
            <p class="copyright text-muted small">Copyright &copy; Your Company 2017. All Rights Reserved</p>
+
    </div>
−
        </div>
+
     <br style="line-height: 10px;">
−
    </footer>
+
  </div>
−
 
+
</section>
−
    <!-- Bootstrap core JavaScript -->
+
</div>
−
    <script src="vendor/jquery/jquery.min.js"></script>
+
−
    <script src="vendor/tether/tether.min.js"></script>
+
−
     <script src="vendor/bootstrap/js/bootstrap.min.js"></script>
+
−
 
+
 
</body>
 
</body>
−
 
 
</html>
 
</html>
 +
{{:Team:York/Templates/Footer}}

Latest revision as of 01:49, 31 October 2017

YORK


iGEM York 2017

DIHM Assisted Co-culture Optimisation

QWACC: a Quicker Way to Analyse Co-Cultures

Contact us: igemyork@gmail.com

Biology

Genetically engineering C. reinhardtii and E. coli in order to form a co-culture with industrial potentials.

Hardware

Using optical diffraction to create and probe 3D images through holography in order to monitor co-cultures.

Software

Cell counting and analysis using holograms formed from images taken with our hardware.


The Project


Upon being asked to find the number of microorganisms in a given sample, the response from members of our iGEM team has invariably been a long sigh and a plea to the realms of the supernatural.

That most human quality - laziness - alongside flaws in traditional techniques, which we will revisit below, has led to us designing a potential solution in the form of a Digital Inline Holographic Microscope (DIHM).

In particular, we discovered that, when studying co-cultures, there are precious few methods of counting cells that are accurate, fast, cheap and non-destructive.

We decided, therefore, to try to bring together two promising areas of science in this project:
Digital Holographic Microscopy and Co-Culturing.


Our Work

To easily find our achievements with respect to the iGEM 2017 competition, please see our Achievements page for a list of direct links.


  • ABOUT US
  • We are an overgraduate team representing the University of York.
  • Our Quicker Way to Analyse Co-Cultures (QWACC) is our entry into the Hardware track for iGEM 2017.
    •