"
Team:ETH Zurich
From 2013.igem.org
(Difference between revisions)
| (463 intermediate revisions not shown) | |||
| Line 1: | Line 1: | ||
{{:Team:ETH_Zurich/Templates}} | {{:Team:ETH_Zurich/Templates}} | ||
| + | {{:Team:ETH_Zurich/Templates/stylesheet}} | ||
| + | {{:Team:ETH Zurich/collapsible}} | ||
| - | < | + | [[File:Minesweeperheader.png|left|800px]]<br> |
| + | [[File:Gold-medal.png|right|100px|link=https://2013.igem.org/Team:ETH_Zurich/achievements]] <html><a href="http://minesweeperonline.com/" target="_Blank">Play Minesweeper here !</a></html> | ||
| + | <html> | ||
| + | <style type="text/css"> | ||
| + | #bxsliderText li | ||
| + | { | ||
| + | text-align: justify; | ||
| + | font-size:14.5px; | ||
| + | line-height: 1.5em; | ||
| + | </style> | ||
| + | <div style="display: table; table-layout: fixed; max-width:1200px; width: 90%; margin: 0 auto; position: relative; height: 100%; min-height:530;"> | ||
| + | <div style="display: table-row; height:100%;"> | ||
| + | <div style="display: table-cell; vertical-align: top; width: 350px; height: 100%; padding-bottom: 70px;"> | ||
| + | <ul class="bxslider" id="bxsliderText"> | ||
| - | < | + | <li><b>Colisweeper</b><br> Colisweeper is an interactive, biological version of the computer game Minesweeper. The goal is to clear an agar “minefield” without detonating the mines. Genetically engineered <i>Escherichia coli</i> colonies are used as mines and non-mines. Mines secrete the signaling molecule AHL whereas non-mines process the signal. To distinguish different AHL-levels, a library of P<sub>LuxR</sub> promoters with various AHL sensitivities was created through site-saturation mutagenesis. High-pass filters were constructed to control the expression of different orthogonal hydrolases in non-mines, depending on the number of surrounding mines.<br><br> The slideshow covers all aspects of our project. Feel free to <b>CLICK ON ANY PICTURE</b> in <b>ANY SLIDESHOW</b> to navigate to the description page.<br><br> CLICK ON THE START BUTTON OF THE FIRST SLIDE TO SEE OUR VIDEO |
| + | </li> | ||
| + | |||
| + | <li><b><br>How to play Colisweeper</b><br><br> Initially, an agar plate is prepared with mine and non mine colonies in the hexagonal grid pattern. To play the game, the player pipettes a solution on to a colony of choice. The color developed on this colony will determine the next move for the player. If the playing solution is pipetted on a colony and it turns yellow, salmon or magenta; this indicates zero,one or two mines respectively adjacent to the played colony. In case a mine colony is encountered, the colony turns blue and the game is over. If the player decides to flag a mine colony, the flagging solution is pipetted that turns the colony green in color. This way the color logic gives the player cue for the next move in the game. | ||
| + | |||
| + | </li> | ||
| + | <li><b><br>Information Processing</b><br><br> Sender cells (mines) express LuxI protein, which catalyzes the production of a small signalling molecule, called AHL. This molecule diffuses through the agar plate and reaches the receiver cells called non-mine colonies. These colonies are designed to distinguish different concentrations of AHL and translate this analog information into the expression of different sets of reporter enzymes. The continuous signal is digitized through a set of mutated P<sub>LuxR</sub> promoters with different AHL sensitivities acting as highpass filters. | ||
| + | </li> | ||
| + | |||
| + | <li><b><br>From Minesweeper to Colisweeper </b><br><br> Mines secrete the signaling molecule AHL which diffuses through the agar and is processed by neighboring non-mine colonies. High-pass filters were constructed to control the expression of different orthogonal hydrolase enzymes in non-mines. Promoters that serve as high-pass filters were tuned to express hydrolases depending on the concentration of the AHL molecules from the surrounding mines. The colors yellow, salmon and magenta corresponds to zero, one and two mines around a colony. Additionally, the mines express their own hydrolase which when added with the multi-substrate gives blue color. The genomic expression of <i>lacZ</i> enables the flagging of both mines and non mine colonies turning the colonies green. | ||
| + | </li> | ||
| + | <li><b><br>Hydrolase Reactions</b><br><br> As a reporter system we use a set of orthogonal hydrolase enzymes: alkaline phosphatase (<i>phoA</i>), β-galactosidase (<i>lacZ</i>), acetylesterase (<i>aes</i>), β-N-Acetylglucosaminidase (<i>nagZ</i>) and β-glucuronidase (<i>gusA</i>). Each hydrolase can react with its respective substrate within minutes resulting in a fast, colorful output. Quick response times and the ability to read the output without using instruments are essentials for a fast gameplay.</li> | ||
| + | |||
| + | <li><b><br>The Model</b><br><br>As our bio-game is based on processing the AHL concentration in the non-mine colonies, the diffusion of AHL in the agar is vital to the system. The diffusion was modeled by carrying out simulations to determine the time and distance of diffusion. We also modeled synthesis, regulation and degradation reactions of the proteins involved in our genetic circuits. To account for both processes: diffusion and reactions; we developed a spatio-temporal model in two dimensions comprised by three modules: mines, receivers, and the agar plate. Finite element methods were used to solve the system of partial differential equations (PDEs). Our model turned out to be very valuable in the circuit refinement and the design of experiments. Moreover, we continually improve out model by incorporating parameters from our own experimental data. | ||
| + | </li> | ||
| + | <li><b><br>Experimental Results</b><br><br> Diffusion experiments were performed to determine the time and distance of AHL diffusion between colonies in the agar mine-grid. A symbiotic relation between experiment and model proved to be beneficial. As proof-of-principle, we set up diffusion experiments using GFP as reporter. The LuxR promoter from the registry was mutated to obtain a library of P<sub>LuxR</sub> promoters with different sensitivities in order to distinguish different AHL levels. Initial tests suggested leaky reporter expression in the uninduced colonies. As a solution to this problem, we use glucose to shut down the P<sub>lac</sub>promoter and a positive feedback loop using lacI under the P<sub>LuxL</sub> promoter. Meanwhile we characterize the biobricks using Michealis-Menten kinetics and flow cytometry. | ||
| + | </li> | ||
| + | <li><b><br>Human practice</b><br><br>We analyze the concept of gamification in synthetic biology, describing many examples where common games are played in a new way or where games are used as research tools. We discuss possible consequences for synthetic biology and show how Colisweeper could be used for awareness raising. For this purpose we designed a Colisweeper Laboratory Course Kit and we propose an idea of a web-based Colisweeper platform enabling people from across the world to play against each other using a remotely controlled robot. | ||
| + | </li> | ||
| + | <li><b><br>Team</b><br><br>We are a team of seven highly motivated Bachelor- and Master Students at ETH Zurich pursuing various fields such as Biotechnology, Biomedical Engineering, Neurobiology and Bioinformatics. The iGEM project is carried out at one of the youngest departments of ETHZ located in Basel-Department of Biosystems Science and Engineering - flourishing in interdisciplinary biological research. If you're around Basel, make sure to visit our team's lab to play the bio-game Colisweeper! | ||
| + | </li> | ||
| + | </ul> | ||
</div> | </div> | ||
| + | <div style="display: table-cell; vertical-align: top; width: 15px; "></div> | ||
| + | <div style="display: table-cell; vertical-align: top; width: auto; "> | ||
| + | <ul class="bxslider" id="bxslider"> | ||
| + | <li><div></html>{{:Team:ETH Zurich/Templates/Video|width=660px|id=video1|ratio=4/3|srcMP4=<html>https://static.igem.org/mediawiki/2013/7/76/Colisweeperfinal.mp4</html>|poster=<html>/wiki/images/e/ec/Videoposter.png</html>}}<html> | ||
| + | </div></li> | ||
| + | <li> | ||
| + | <a href="https://2013.igem.org/Team:ETH_Zurich/Play"><img src="https://static.igem.org/mediawiki/2013/a/ab/Playthegame2.png"/></a> | ||
| + | </li> | ||
| + | <li> | ||
| + | <a href="https://2013.igem.org/Team:ETH_Zurich/Infoproc"> | ||
| + | <img src="https://static.igem.org/mediawiki/2013/4/45/Infoprocslide.png" /></a> | ||
| - | < | + | </li> |
| + | <li> | ||
| + | <a href="https://2013.igem.org/Team:ETH_Zurich/Circuit"><img src="https://static.igem.org/mediawiki/2013/b/b2/Colisweepercircuitfinal.png"/></a> | ||
| + | </li> | ||
| + | <li> | ||
| + | <a href="/Team:ETH_Zurich/Experiments_3"><img src="https://static.igem.org/mediawiki/2013/4/43/Outputsystemcolisweeper.png"/></a> | ||
| + | |||
| + | </li> | ||
| + | <li> | ||
| + | <a href="https://2013.igem.org/Team:ETH_Zurich/Modeling/Overview"><img src="https://static.igem.org/mediawiki/2013//6/68/ModelSlide2.png"/></a> | ||
| + | </li> | ||
| + | |||
| + | <li><a href="https://2013.igem.org/Team:ETH_Zurich/Experimentalresults"><img src="https://static.igem.org/mediawiki/2013/2/24/Experimentalslidecoli.png"/></a> | ||
| + | </li> | ||
| + | |||
| + | <li> | ||
| + | <a href="https://2013.igem.org/Team:ETH_Zurich/Practiceoverview"><img src="https://static.igem.org/mediawiki/2013/5/57/Humanpracticeslide.png" /></a> | ||
| + | </li> | ||
| + | |||
| + | <li> | ||
| + | <a href="/Team:ETH_Zurich/Team"><img src="https://static.igem.org/mediawiki/2013/e/ef/Teamslide.png" /></a> | ||
| + | |||
| + | </li> | ||
| + | |||
| + | </ul> | ||
</div> | </div> | ||
| + | </div> | ||
| + | </div> | ||
| + | <script type="text/javascript"> | ||
| + | (function($) { | ||
| + | function img(url) { | ||
| + | var i = new Image; | ||
| + | i.src = url; | ||
| + | return i; | ||
| + | } | ||
| + | |||
| + | if ('naturalWidth' in (new Image)) { | ||
| + | $.fn.naturalWidth = function() { return this[0].naturalWidth; }; | ||
| + | $.fn.naturalHeight = function() { return this[0].naturalHeight; }; | ||
| + | return; | ||
| + | } | ||
| + | $.fn.naturalWidth = function() { return img(this[0].src).width; }; | ||
| + | $.fn.naturalHeight = function() { return img(this[0].src).height; }; | ||
| + | })(jQuery); | ||
| - | + | function onWindowResize() | |
| + | { | ||
| + | var curWidth = $(window).width(), | ||
| + | curHeight = $(window).height(), | ||
| + | checking=false; | ||
| + | if (checking) { | ||
| + | return; | ||
| + | } | ||
| + | checking = true; | ||
| + | window.setTimeout( | ||
| + | function() { | ||
| + | var newWidth = $(window).width(), | ||
| + | newHeight = $(window).height(); | ||
| + | if (!(newWidth !== curWidth || | ||
| + | newHeight !== curHeight)) { | ||
| + | resize(false); | ||
| + | } | ||
| + | checking=false; | ||
| + | }, 300); | ||
| + | } | ||
| - | + | function resize(initial) { | |
| - | + | if (navigator.userAgent.match(/msie/i)) | |
| + | { | ||
| + | if ($("#bxsliderText").parent().css("height") != $("#bxslider").parent().css("height")) | ||
| + | setTimeout(function() {$( "#bxsliderText" ).parent().css({"height": $("#bxslider").parent().css("height")});}, 100); | ||
| + | } | ||
| - | + | if (!initial) | |
| + | { | ||
| + | var container = $('#bxslider > li'); | ||
| + | var imgWidth = container.width(); | ||
| + | $( "#imagemap, #imagemap2" ).each(function() { | ||
| + | $(this).css('height', 'auto', 'width', 'auto'); | ||
| + | $(this).mapster('resize',Math.min(imgWidth, $(this).naturalWidth()) ,0,0); | ||
| + | }); | ||
| + | } | ||
| - | + | } | |
| - | + | ||
| - | + | ||
| - | |||
| - | + | $(document).ready(function(){ | |
| - | </ | + | sliderText = $('#bxsliderText').bxSlider({'mode': 'fade', 'controls': false, 'pager': false, 'auto': false, "responsive": false, 'touch': false}); |
| + | slider = $('#bxslider').bxSlider({ 'auto': false, onSlideAfter: function(slideElement, oldIndex, newIndex){sliderText.goToSlide(newIndex);}, onSlideBefore: function(slideElement, oldIndex, newIndex){sliderText.goToSlide(newIndex);}}); | ||
| + | $('#bxsliderText').parent().css({"height": "100%", 'min-height' : '530px'}); | ||
| + | $('#bxsliderText').parent().parent().css({"height": "100%"}); | ||
| + | $('.bx-viewport #bxslider').bind('mousewheel', function(event, delta, deltaX, deltaY) { | ||
| + | event.preventDefault(); | ||
| + | if (delta < 0) {slider.goToNextSlide();} | ||
| + | else {slider.goToPrevSlide();} | ||
| + | }); | ||
| + | $('#imagemap, #imagemap2').mapster({ | ||
| + | fillColor: 'c2d8f1', | ||
| + | fillOpacity: 0.6, /* | ||
| + | stroke: true, | ||
| + | strokeColor: 'c2d8f1', | ||
| + | strokeOpacity: 0.7, | ||
| + | strokeWidth: 2, */ | ||
| + | clickNavigate: true | ||
| + | }); | ||
| + | |||
| + | |||
| + | $(window).resize( | ||
| + | function() | ||
| + | { | ||
| + | onWindowResize(); | ||
| + | }); | ||
| + | resize(true); | ||
| + | }); | ||
| + | </script> | ||
| + | </html> | ||
| + | <br clear="all" /> | ||
| + | {{:Team:ETH_Zurich/templates/footer}} | ||
Latest revision as of 01:49, 29 October 2013
