Difference between revisions of "Team:Valencia UPV"

(Undo revision 185200 by Carlosav (talk))
 
(26 intermediate revisions by 4 users not shown)
Line 1: Line 1:
 
{{Valencia_UPV/bootstrap.css}}
 
{{Valencia_UPV/bootstrap.css}}
−
<!--{{Valencia_UPV/bootstrapMin.css}}-->
 
 
{{Valencia_UPV/custom.css}}
 
{{Valencia_UPV/custom.css}}
 
{{Valencia_UPV/flickity.css}}
 
{{Valencia_UPV/flickity.css}}
Line 16: Line 15:
 
#sideMenu, #top_title, .patrollink  {display:none;}
 
#sideMenu, #top_title, .patrollink  {display:none;}
 
#content { margin-left:0px; margin-top:-30px; padding:0px; width:100%;}
 
#content { margin-left:0px; margin-top:-30px; padding:0px; width:100%;}
 +
 +
  
 
</style>
 
</style>
  
−
    <head>
+
<head>
−
        <meta charset="utf-8">
+
  <meta charset="utf-8">
−
        <title>Stack Multipurpose HTML Template</title>
+
  <title>Stack Multipurpose HTML Template</title>
−
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
−
        <meta name="description" content="Site Description Here">
+
  <meta name="description" content="Site Description Here">
−
        <link href="https://fonts.googleapis.com/css?family=Open+Sans:200,300,400,400i,500,600,700%7CMerriweather:300,300i" rel="stylesheet">
+
  <link href="https://fonts.googleapis.com/css?family=Open+Sans:200,300,400,400i,500,600,700%7CMerriweather:300,300i" rel="stylesheet">
−
        <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
+
  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
−
        <link href="https://fonts.googleapis.com/css?family=Lato:400,700,900" rel="stylesheet">
+
  <link href="https://fonts.googleapis.com/css?family=Lato:400,700,900" rel="stylesheet">
−
        <link href="https://2018.igem.org/Template:Valencia_UPV/fontAwesome?action=raw&ctype=text/css" rel="stylesheet" type="text/css">
+
  <link href="https://2018.igem.org/Template:Valencia_UPV/fontAwesome?action=raw&ctype=text/css" rel="stylesheet" type="text/css">
 +
 
 +
</head>
  
−
        <script type="text/javascript" src="http://latex.codecogs.com/latexit.js"></script>
 
−
<!-- Inserción de ecuaciones LaTex-->
 
  
  
−
       
+
<!-- ESTE ES EL CODIGO DE LA IMAGEN DE LA ESQUINA DERECHA
−
    </head>
+
−
  <body class="" style="background-color:#353535;">
+
−
        <a class="anchorOffset" id="start"></a>
+
  
 +
He puesto justo debajo los atributos height y width a 200 píxeles
 +
por defecto pero se puede modificar. Con esos valores, cualquier foto
 +
que pongas se va a ver con un tamaño de 200x200.
  
−
<!--------- NAVBAR-------------------------------------------------------------------------------------------------------------------------------------------------------------->
+
-->
 +
                                     
 +
<div style="
 +
    position: absolute;
 +
    padding-right: 1em;
 +
    padding-bottom: 1em;
 +
    padding-left: 1em;
 +
    z-index: 99;
 +
    width: 100%;
 +
    text-align: right;
 +
">
  
 +
<a href="https://2018.igem.org/Team:Valencia_UPV/Awards">
 +
<img style="
 +
    margin: 0 !important;
 +
    width: 200px;
 +
    height: 200px;
  
−
     
+
" src="https://static.igem.org/mediawiki/2018/7/7d/T--Valencia_UPV--TROFEOGIF_ale.gif">
 +
</a>
  
  
 +
</div>
  
−
<!------------CONTENEDOR PRINCIPAL ---------------------------------------------------------------------------------------------------------------------------------->
+
<!---->
  
  
−
<div class="main-container">
+
 
−
   
+
<div class="t-cover" style="
−
            <section style="/* background-color: #353535; *//* background-image: url(&quot;https://previews.123rf.com/images/bogdanhoda/bogdanhoda1504/bogdanhoda150400014/38730978-test-tubes-in-clinic-pharmacy-and-medical-research-laboratory-with-male-scientist-using-pipette.jpg&quot;); *//* background-size: 100%; */height:44.2em;margin-top: 0em;padding-top: 1.1em;" class="height-90 parallax">
+
height: 100vh; margin-top: -20px;background-color: #DCDEDC;">
−
              <div class="main-container" style="
+
 
−
height: 100%;">
+
 
−
              <center style="
+
 
−
height: 100%;">
+
 
−
              <div class="col-md-10" style="
+
 
−
height: 100%;margin-top: 4em;">
+
<div id="media-box">
−
<div id="logoPrinteria" class="item" style="
+
 
−
background-image: url(http://via.placeholder.com/1155x666);
+
 
 +
<video loop="" id="landing-page-video" class="landing-video" style="position:absolute;width: 100%;" playsinline="" autoplay="" muted="">
 +
                                        <source src="https://static.igem.org/mediawiki/2018/c/cc/T--Valencia_UPV--VideoHome.mov" type="video/mp4">
 +
                                      </video>
 +
                                    <center style="
 
height: 100%;
 
height: 100%;
−
width: 100%;background-attachment: fixed; background-position: center; background-position-y: 100px; background-repeat: no-repeat">
+
/* right: 14em !important; *//* position: absolute; *//* top: 81%; *//* padding-left: 31em; */">
−
   
+
<a class="btn down inner-link active" href="#story" style="
−
    <div style="/* position: absolute; *//* top: 81%; *//* padding-left: 31em; */">
+
;;
−
<a class="btn down inner-link active" href="#story" style="font-size: 82%;/* position: fixed; *//* bottom: 7%; */top: 541px;z-index: 99;background-color: white;position: relative;border-radius: 80%;width: 3.8em;height: 3.8em;padding: 0;padding-top: 14px;">
+
font-size: 82%;/* position: fixed; *//* bottom: 7%; */; top: 80vh;z-index: 93;background-color: white;position: relative;border-radius: 80%;width: 3.8em;height: 3.8em;padding: 0;padding-top: 14px;">
 
             <i class="stack-interface stack-down-open-big"></i>
 
             <i class="stack-interface stack-down-open-big"></i>
 
         </a>
 
         </a>
−
</div>
+
</center></div>
−
   
+
</div>
−
</div>
+
<div class="main-container" style=""><row>
−
</div>
+
−
               
+
−
              </center>
+
−
             
+
−
</div>
+
  
  
 +
<!-------------------------------IMAGEN PRINCIPAL------------------------------------------------>
  
−
              </section></div>
 
−
<a class="anchorOffset" id="story"></a>
 
−
<section class="feature-large" style="padding-top: 6em; padding-bottom: 50px; outline: none;" data-scroll-id="story" tabindex="-1">
 
−
  <div class="container">
 
−
      <div class="row">
 
−
        <div class="col-md-3" style="
 
−
            margin-left: 0em;
 
−
            padding-right: 0px;
 
−
            padding-left: 0.2em;">
 
−
            <div class="tabs-container tabs--vertical page-navigator" style="position: -webkit-sticky;position: sticky;padding-bottom: 0px;margin-top: 11.4em;">
 
−
              <h4 style="
 
−
                  padding-left: 1em;
 
−
                  ">Index</h4>
 
−
              <ul class="lateral">
 
−
                  <li class="lateral" style="margin-bottom: 0px;padding-bottom: 1em;padding-top: initial;padding-left: 1em;">
 
−
                    <div class="tab__title" style="
 
−
                        line-height: 1.3em;
 
−
                        ">
 
−
                        <a href="#lmHuman" class="lateral inner-link" style="
 
−
                          color: #353535;
 
−
                          opacity: 1;
 
−
                          list-style-type: circle;
 
−
                          ">Human Practices</a>
 
−
                    </div>
 
−
                  </li>
 
−
                  <li class="lateral">
 
−
                    <div class="tab__title" style="
 
−
                        line-height: 1.3em;
 
−
                        ">
 
−
                        <a href="#lmSoftware" class="lateral inner-link" style="
 
−
                          color: #353535;
 
−
                          opacity: 1;
 
−
                          ">Software</a>
 
−
                    </div>
 
−
                  </li>
 
−
                  <li class="lateral">
 
−
                    <div class="tab__title" style="
 
−
                        line-height: 1.3em;
 
−
                        ">
 
−
                        <a href="#lmHardware" class="lateral inner-link" style="
 
−
                          color: #353535;
 
−
                          opacity: 1;
 
−
                          ">Hardware</a>
 
−
                    </div>
 
−
                  </li>
 
−
                  <li class="lateral">
 
−
                    <div class="tab__title" style="
 
−
                        line-height: 1.3em;
 
−
                        ">
 
−
                        <a href="#lmWetLab" class="lateral inner-link" style="
 
−
                          color: #353535;
 
−
                          opacity: 1;
 
−
                          ">Wet Lab</a>
 
−
                    </div>
 
−
                  </li>
 
−
                  <li class="lateral">
 
−
                    <div class="tab__title" style="
 
−
                        line-height: 1.3em;
 
−
                        ">
 
−
                        <a href="#lmModeling" class="lateral inner-link" style="
 
−
                          color: #353535;
 
−
                          opacity: 1;
 
−
                          ">Modeling</a>
 
−
                    </div>
 
−
                  </li>
 
−
                  <li class="lateral">
 
−
                    <div class="tab__title" style="
 
−
                        line-height: 1.3em;
 
−
                        ">
 
−
                        <a href="#lmGraphicDesign" class="lateral inner-link" style="
 
−
                          color: #353535;
 
−
                          opacity: 1;
 
−
                          ">Graphic Design</a>
 
−
                    </div>
 
−
                  </li>
 
−
                  <li class="lateral">
 
−
                    <div class="tab__title" style="
 
−
                        line-height: 1.3em;
 
−
                        ">
 
−
                        <a href="#lmWiki" class="lateral inner-link" style="
 
−
                          color: #353535;
 
−
                          opacity: 1;
 
−
                          ">Wiki</a>
 
−
                    </div>
 
−
                  </li>
 
−
                  <li class="lateral">
 
−
                    <div class="tab__title" style="
 
−
                        line-height: 1.3em;
 
−
                        ">
 
−
                        <a href="#lmOrgCom" class="lateral inner-link" style="
 
−
                          color: #353535;
 
−
                          opacity: 1;
 
−
                          ">Organization / Communication</a>
 
−
                    </div>
 
−
                  </li>
 
−
              </ul>
 
−
              <ul class="tabs-content">
 
−
              </ul>
 
−
            </div>
 
−
        </div>
 
−
        <div class="col-md-9 col9Attr" style="padding-left: 6em;padding-right: 2em;">
 
−
            <div>
 
−
              <a class="anchorOffset" id="lmModeling"></a>
 
−
              <h3 class="h3Modeling">Modeling</h3>
 
−
              <p>
 
−
              <b>Do you think it is possible to mathematically describe a cell? Would you like to know the possibilities that Printeria modeling offers you?</b>
 
−
              </p>
 
−
              <p>
 
−
One of the fundamental bases of the Printeria project has undoubtedly been <b>mathematical modeling</b>. Thanks to the development and application of new mathematical models, it is possible to <b>quantify the expression of proteins</b> in cells, and therefore <b>characterize</b> through different experiments the parts designed by Printeria. From the Printeria modeling team, we intend to reach different goals:
 
−
</p>
 
−
<ul>
 
−
<li><p>
 
−
<b>Design simple mathematical models</b> based on differential equations that describe the biochemical processes of a cell. With them, we can simulate the different genetic circuits that Printeria allows us to build.
 
−
</p></li>
 
−
<li><p>
 
−
Develop a <b>Simulation Tool</b> that allows the user to visualize a prediction of the results of their experiment before running it in Printeria.
 
−
</p></li>
 
−
<li><p>
 
−
<b>Optimize model parameters</b> to match simulation results to experimental data obtained from Printeria constructions.
 
−
</p></li>
 
−
<li><p>
 
−
<b>Characterize the parts of our <a href="https://2018.igem.org/Team:Valencia_UPV/Part_Collection">Part Collection</a></b> from the optimization results and provide the user with all the information about the Printeria kit.
 
−
</p></li>
 
−
</ul>
 
−
<p>
 
−
Although in the development of the project we have dealt with all these aspects, all of them have a single purpose: to understand and <b>describe in a mathematical way the biological processes</b> that take place inside the cell.
 
−
                </p>
 
−
              <!--BOTONES PARA MOVERSE POR LA PÁGINA -->
 
−
              <!--Los enlaces están bien pero los ids a donde apuntan están descuadrados adrede para que al pulsar lleve un poco por encima del contenido -->
 
−
              <div id="" data-scroll-id="" tabindex="-1" style="outline: none; margin-top: 1em;" class="row">
 
−
                  <div class="col-md-2" style="text-align: center;">
 
−
                    <a class="inner-link" href="#models"><img class="fotosModeling" src="https://static.igem.org/mediawiki/2018/c/ca/T--Valencia_UPV--instagramUPV2018.png"></a>
 
−
                    <p style="text-align: center !important; font-weight: bold;">Models & Experiments</p>
 
−
                  </div>
 
−
                  <div class="col-md-2" style="text-align: center;">
 
−
                    <a class="inner-link" href="#charact"><img class="fotosModeling" src="https://static.igem.org/mediawiki/2018/c/ca/T--Valencia_UPV--instagramUPV2018.png"></a>
 
−
                    <p style="text-align: center !important; font-weight: bold;">Characterisation procedures</p>
 
−
                  </div>
 
−
                  <div class="col-md-2" style="text-align: center;">
 
−
                    <a class="inner-link" href="#simtool"><img class="fotosModeling" src="https://static.igem.org/mediawiki/2018/c/ca/T--Valencia_UPV--instagramUPV2018.png"></a>
 
−
                    <p style="text-align: center !important; font-weight: bold;">Simulation Tool</p>
 
−
                  </div>
 
−
              </div>
 
−
              <!--FIN BOTONES PARA MOVERSE POR LA PÁGINA -->
 
−
              <div>
 
−
                  <h4>Models & Experiments</h4>
 
−
                    <a class="anchorOffset" id="models"></a>
 
−
                    <p>
 
−
                    <!--Contenido de MODELS & EXPERIMENTS -->
 
−
                    </p>
 
−
                  <h4>Characterisation procedures</h4>
 
−
                    <a class="anchorOffset" id="charact"></a>
 
−
                    <p>
 
−
Valencia UPV iGEM team has designed an extensive <a href="https://2018.igem.org/Team:Valencia_UPV/Part_Collection">Part Collection </a> in purpose of allowing the user to design multiple genetic constructions and experiments. One of <b>our main objectives has been to show the user clear and structured information</b> about the pieces that make up the Printeria kit. For this reason, we have considered the characterization of the parts as a priority when developing the project. In this way, we have elaborated some <b>procedures</b> which have allowed us to systematically obtain and structure information from the parts. 
 
−
<ul>
 
−
<li><p>
 
−
<a href="#spectra">Procedure for obtaining protein spectra</a>
 
−
</p></li>
 
−
<li><p>
 
−
<a href="#comparison">Comparison between sfGFP and GFP relative fluorescence intensity</a>
 
−
</p></li>
 
−
</ul>                     
 
−
</p>
 
  
−
<h5>Procedure for obtaining protein spectra </h5>
 
−
<p><a id="spectra"></a></p>
 
−
<p>
 
−
Obtaining <b>excitation and emission spectra</b> is a fundamental aspect in the process of characterization of a fluorescent protein. Each protein has a characteristic spectrum, which indicates the energy in which the molecule is excited or emits at a certain wavelength.
 
−
</p>
 
−
<p>
 
−
The characterization of the reporter proteins by excitation and emission spectra are of great importance in the experimentation. When contrasting experimental information with the theoretical results of mathematical models, we experiment with numerous reporter proteins, such as fluorescence proteins or chromoproteins. However, the ><b>fluorescence data obtained must be corrected applying diferent operations</b> in order to obtain representative fluorescence data:
 
−
</p>
 
−
<ol style="list-style-type: upper-roman;">
 
−
<li><p>
 
−
The subtraction of the blank fluorescence: <div lang="latex"> F_{subs} = F - F_{blank}</div>
 
−
</li></p>
 
−
<li><p>
 
−
The quotient of the fluorescence with the gain: <div lang="latex"> F_{gain} = \frac{F_{subs}}{G}</div>
 
−
</li></p>
 
−
<li><p>
 
−
The quotient of the fluorescence with excitation and emission efficiency: <div lang="latex"> F_{corrected} = \frac{F_{gain}}{\frac{exc(\%)em(\%)}{100}}</div>
 
−
</li></p>
 
−
</ol>
 
−
<img src="https://static.igem.org/mediawiki/2018/6/6e/T--Valencia_UPV--esquema_opsUPV2018.png" id="esquema_ops">
 
−
<p>
 
−
Until now, the corrections applied to the experiments performed with these reporter proteins were the subtraction of the fluorescence of the blank, and the division by the gain factor of the measuring equipment. However, with the protein spectra, we can also normalize the fluorescence data to values that would have been obtained with maximum excitation and emission.
 
−
</p>
 
−
<p>
 
−
Owing to this reason, a protocol has been established in the lab by Lab and Modeling team to obtain the spectrum of any reporter protein.
 
−
</p>
 
−
<p><i>Materials:</i></p>
 
−
<ul>
 
−
<li>
 
−
<p>Measuring equipment: <b>Biotek Cytation3</b></p>
 
−
</li>
 
−
<li>
 
−
<p><b>96 well plate</b></p>
 
−
</li>
 
−
<li>
 
−
<p><b>MATLAB 2018a software</b></p>
 
−
</li>
 
−
</ul>
 
−
<p><i>Procedure:</i></p>
 
−
<ol>
 
−
<li><p>
 
−
We look for the <a href="https://www.thermofisher.com/es/es/home/life-science/cell-analysis/labeling-chemistry/fluorescence-spectraviewer.html">theoretical spectra</a>of the protein to be measured (or similar molecules) to determine the wavelength at which the protein is excited or emitted at maximum energy, i.e. where the theoretical spectral peaks occur.
 
−
</p></li>
 
−
<li><p>
 
−
We define the protocol of our equipment to get the absorbance and fluorescence dataset. In our protocol, the most important parameters to be established are summarized in the following Table.
 
−
<table style="width:100%">
 
−
  <tr>
 
−
    <th><p>Parameters</p></th>
 
−
    <th><p>Description</p></th>
 
−
  </tr>
 
−
  <tr>
 
−
    <td><p>Number of samples</p></td>
 
−
    <td><p>From <b>3 to 6 samples of reporter protein</b> and <b>3 samples of blank</b> (BLK)</p></td>
 
−
  </tr>
 
−
  <tr>
 
−
    <td><p>Temperature</p></td>
 
−
    <td><p>37 ºC</p></td>
 
−
  </tr>
 
−
    <tr>
 
−
    <td><p>Shake</p></td>
 
−
    <td><p>Double Orbital. 01:00 (MM:SS)</p></td>
 
−
  </tr>
 
−
    <tr>
 
−
    <td><p>Absorbance. Optical Density (OD)</p></td>
 
−
    <td><p>Wavelenght at <b>600 nm</b> emission</p></td>
 
−
  </tr>
 
−
  <tr>
 
−
    <td><p>Excitacion and emission scans</p></td>
 
−
    <td><p>The scans occur between <b>two wavelength limit values</b>. The established range will depend on the theoretical spectrum of the protein.</p></td>
 
−
  </tr>
 
−
  <tr>
 
−
    <td><p>Excitacion and emission wavelengths</p></td>
 
−
    <td><p>These values will depend on the range, and therefore on the spectrum. Values far from the theoretical peak lead to more attenuated fluorescence curves, and values very close to the peak can lead to overlap and error in reading the data. Therefore, a compromise must be reached between curve resolution and reading overlap.</p></td>
 
−
  </tr>
 
−
  <tr>
 
−
    <td><p>Gain (G)</p></td>
 
−
    <td><p>Normally the gain value <b>G = 60</b>, although for proteins with lower fluorescence, it is recommended that G takes higher values.</p></td>
 
−
  </tr>
 
−
</table>
 
−
</p></li>
 
  
−
<li><p>
 
−
The experiment is introduced, and the experimental absorbance data and the fluorescence curves of the samples are obtained with the blank correction applied.
 
−
</p></li>
 
  
−
<li><p>
+
<!----------------------EMPIEZA LA SECCIÓN DE DEBAJO DE LA IMAGEN ----------------------------->
−
The dataset is exported to an Excel file.
+
<div class="col-md-12" style="
−
</p></li>
+
z-index: 99;
 +
position: relative;width: 100%;padding-left: 0;padding-right: 0;">
  
−
<li><p>
+
<section class="imageblock " style="
−
The MATLAB script <a href=""><i>spectrum.m</i></a> for fluorescent proteins is executed:
+
padding-bottom: 0px !important;
−
<ol style="list-style-type: lower-latin;">
+
height: 722px;
−
<li>
+
padding-bottom: 24px;
−
<p>Dataset is extracted from the Excel file.</p>
+
;background-color: #DCDEDC;
−
</li>
+
"><a class="anchorOffset" id="story" data-scroll-id="story" tabindex="-1" style="outline: none;"></a><row>
−
<li>
+
               
−
<p>The fluorescence curves of all samples are averaged, and the result is normalised (from 0 to 100%).</p>
+
               
−
</li>
+
<div class=" col-lg-6 col-md-6" style="
−
<li>
+
float: left !important;
−
<p>Graphs of the normalized absorption and emission spectra are plotted. The X-axis represents the wavelength (nm), and the Y-axis represents the normalized fluorescence intensity (%).</p>
+
padding-right: 0px;
−
</li>
+
padding-left: 0px;
−
</ol>
+
position:  relative;
−
</p></li>
+
float: left;">
 +
                    <div class="row" style="
 +
padding: 5em;
 +
;
 +
display: block;
 +
position: absolute;
 +
height: 100%;
 +
/*! background-color: #DCDEDC; */
 +
">
 +
                        <div class="col-lg-12 col-md-12 mt--12" style="
 +
padding-right: 3em;
 +
display: block;">
 +
                           
 +
                     
 +
                            <div class="modal-instance block">
 +
                               
 +
                               
 +
                               
 +
                                <!--end of modal-container-->
 +
                            </div>
 +
                            <!--end of modal instance-->
 +
                        </div>
 +
                    </div>
 +
<a href="https://2018.igem.org/Team:Valencia_UPV/Description"><img alt="image" src="https://static.igem.org/mediawiki/2018/e/e0/T--Valencia_UPV--ImagenHomeIzq2UPV2018.png" style="
 +
margin-bottom: 0px !important;width: 132em;height: auto;margin-top: 0em;border-radius: 0;overflow;overflow: hidden;" class="visible-xs"></a><a href="https://2018.igem.org/Team:Valencia_UPV/Description"><img alt="image" src="https://static.igem.org/mediawiki/2018/2/2b/T--Valencia_UPV--ImagenHomeIzqUPV2018.png" style="width: 132em;height: auto;margin-top: 0em;border-radius: 0;overflow;overflow: hidden;" class="hidden-xs"></a>
 +
</div>
 +
<div class=" col-lg-6 col-md-6 pos-left" style="
 +
padding-right: 0px;
 +
padding-left: 0px;
 +
position: relative;
 +
height: 100%;
 +
background-color: #DCDEDC;
 +
float: right;">
 +
<a href="https://2018.igem.org/Team:Valencia_UPV/Description"><img alt="image" src="https://static.igem.org/mediawiki/2018/1/12/T--Valencia_UPV--ImagenHomeDerUPV2018.png" style="width: 132em;height: auto;margin-top: 0em;border-radius: 0;overflow;overflow: hidden;" class="hidden-xs"></a>
 +
<img alt="image" src="https://static.igem.org/mediawiki/2018/8/87/T--Valencia_UPV--ImagenHomeDer2UPV2018.png" style="width: 132em;height: auto;margin-top: 0em;border-radius: 0;overflow;overflow: hidden;" class="visible-xs">
  
−
</ol>
+
                   
−
<img src="https://static.igem.org/mediawiki/2018/e/e8/T--Valencia_UPV--sfGFP_spectrumUPV2018.png"<span><p>sfGFP spectra</p></span>>
+
                    <!--end of row-->
 +
                </div>
 +
                <!--end of container--></row>
 +
            </section>
 +
<section class="" style="
 +
padding-top: -1px;
 +
padding-bottom: 0px !important;
 +
height: 722px;
 +
padding-bottom: 24px;
 +
;"><div style="
 +
float: left;">
 +
               
 +
               
 +
<div class=" col-lg-6 col-md-6" style="
 +
top: -7.5em;float: left !important;
 +
padding-right: 0px;
 +
padding-left: 0px;
 +
position:  relative;
 +
float: left;">
 +
                    <img alt="image" loop="infinite" src="https://static.igem.org/mediawiki/2018/archive/4/46/20181017075815%21T--Valencia_UPV--gifhomeUPV2018.jpeg" style="
 +
float: left;
 +
margin-bottom: 0px !important;width: 132em;height: auto;margin-top: 0em;border-radius: 0;overflow;overflow: hidden;">
 +
</div>
 +
<div class=" col-lg-6 col-md-6" style="
 +
top: -7.5em;float: right !important;
 +
padding-right: 0px;
 +
padding-left: 0px;
 +
position:  relative;
 +
float: left;">
 +
                    <div style="
 +
width: 100%;
 +
height: 16%;"><h1 style="
 +
padding-top: 1.8em !important; padding-left: 2em !important; margin: 0em !important; height: 87% !important; margin-bottom: 11em !important;margin-left: 6em; margin-top: 5em; padding-right: 5em !important; /* font-size: 18px !important; */; width: 102%; overflow-x: hidden !important; padding: 0; height: 100%; overflow: scroll; letter-spacing: 0px; line-height: 27px !important; color: white; position: absolute; left: 0em; z-index: 20;">Abstract</h1><p style="
 +
padding-top: 9.5em !important;
 +
padding-left: 6em !important;
 +
margin: 0em !important;
 +
height: 87% !important;
 +
margin-bottom: 11em !important;margin-left: 6em;
 +
margin-top: 5em;
 +
padding-right: 5em !important;
 +
font-size: 18px !important;
 +
width: 102%;
 +
overflow-x: hidden !important;
 +
padding: 0;
 +
height: 100%;
 +
overflow: scroll;
 +
letter-spacing: 0px;
 +
line-height: 27px !important;
  
−
<p>
+
color: white;
−
In practical terms, the protocol has been applied to all of our reporter proteins: <a href="http://parts.igem.org/Part:BBa_K2656022">GFP</a>, <a href="http://parts.igem.org/Part:BBa_K2656013">sfGFP</a>, <a href="http://parts.igem.org/Part:BBa_K2656021">YFP</a> and <a href="http://parts.igem.org/Part:BBa_K2656014">mRFP</a>. All results can be found in our parts collection as well as in the iGEM catalogue.
+
    position: absolute;
−
</p>
+
    left: 0em;
−
<p>
+
    z-index: 20;">
−
In the particular case of a reporter chromoprotein, such as <a href="http://parts.igem.org/Part:BBa_K2656018">amilCP</a>, we do not measure fluorescence, but absorbance. In this case, in rder to obtain the corrected absorbance curve, we must subtract from the cell absorbance data with the reporter protein the absorbance of a medium with cells without chromoprotein. Once the data have been corrected, we normalize them between values of 0 and 100 and with this we elaborate the graph. The protocol used can be found in the MATLAB script <a href=""><i>amilCP_spectrum.m</i></a>.
+
                              Access to Synthetic Biology by an interested layperson is currently hampered by several barriers, including a required background knowledge and availability of expensive and often bulky technological equipment. <font size="+1"><b>Printeria</b></font>  is a fully-equipped bioengineering device able to automate the process of printing genetic circuits in bacteria but made as simple and easy to operate as a domestic desktop printer. It breaks down these barriers using a digital microfluidic system creating little droplets that can be mixed and moved across predefined electrode paths on a PCB surface. Printeria combines this novel system with Golden Gate Technology, low-cost sensors and electronics, and a user-friendly software application. In this way, the user is capable of assembling DNA parts in a one-step reaction and control all steps: from the parts assembly and transformation to perform experiments of the printed genetic circuit with high accuracy.
−
</p>
+
Printeria opens the door to a world of applications affordable for the general public.
−
<p>
+
                            </p></div><img alt="image" loop="infinite" src="https://static.igem.org/mediawiki/2018/3/37/T--Valencia_UPV--ImagenHomeNegroDerUPV2018.jpeg" style="
−
Finally, we have also obtained the spectra of the fluorescein molecule. These spectra have been used to correct the fluorescence data used in the Interlab Study to obtain the Relative Fluorescence Units (RFU) to Molecules of Equivalent Fluorochrome (MEFL) conversion factor. In addition, the <a href="#comparison">comparison</a> between GFP and sfGFP proteins RFU has been possible thanks to fluorescein spectra.
+
margin-bottom: 0px !important;width: 132em;height: auto;margin-top: 0em;border-radius: 0;overflow;overflow: hidden;">
−
<img src="https://static.igem.org/mediawiki/2018/e/e8/T--Valencia_UPV--fluorescein_spectrumUPV2018.png"<span><p>Fluorescein spectra</p></span>>
+
</div>
−
</p>
+
  
−
<h5>Comparison between sfGFP and GFP relative fluorescence intensity</h5>
+
                <!--end of container--></div>
−
<p><a id="comparison"></a></p>
+
            </section></div>
−
<p>
+
−
One of the main problems we encounter when processing the results of experiments in Synthetic Biology are the units of measurement of fluorescence data. Unlike absorbance, where there is a simple conversion between Optical Density (OD) and cell number, there is no direct relationship between the Relative Units of Fluorescence (RFU) and the number of protein molecules in the cell. Moreover, RFUs vary among reporter fluoroproteins: for example, an RFU of the GFP protein does not have to be equivalent to an RFU of the mRFP protein, sfGFP, etc.
+
−
</p>
+
−
<p>
+
−
Thanks to initiatives such as the <a href="">Interlab Study</a>, we have been able to go a step further and obtain a MEFL/RFU<sub>GFP</sub> factor of equivalence between the RFU of the <a href="http://parts.igem.org/Part:BBa_K2656022">GFP</a> protein and the Molecules of Equivalent Fluorochrome (MEFL). This relationship is an important breakthrough, as it can give us a more accurate estimate of the amount of GFP molecules in the cell.
+
−
</p>
+
−
<p>
+
−
However, another of the reporter proteins widely used in the experimentation is the <a href="http://parts.igem.org/Part:BBa_K2656013">sfGFP</a>. This protein has a much faster folding than GFP, which translates into a higher fluorescence intensity per molecule. In order to obtain the MEFL/RFU<sub>sfGFP</sub> factor from sfGFP, the Printeria Modeling and Lab teams have designed a comparative experiment between the both proteins. The experiment consists of designing two identical transcriptional units (TU), changing only the CDS sequence so that each TU will produce GFP and sfGFP, respectively. It should be added that this experiment is based on two fundamental assumptions:
+
−
</p>
+
−
<p>
+
−
<ol style="list-style-type: upper-latin;">
+
−
<li><p>
+
−
The number of GFP molecules produced in the cells is equivalent to the number of MEFL.
+
−
</p></li>
+
−
<li id="cond_equiv_molec"><p>
+
−
Given two TU with identical promoters, RBS and terminators, but with different CDS, under the same experimental conditions, the number of molecules produced by each TU is the same.
+
−
</p></li>
+
−
</ol>
+
−
</p>
+
−
<p>
+
−
Taking these axioms into account, the materials and procedure followed to calculate the MEFL/RFU<sub>sfGFP</sub>factor were as follows:
+
−
</p>
+
−
<p><i>Materials:</i></p>
+
−
<ul>
+
−
<li>
+
−
<p>Measuring equipment: <b>Biotek Cytation3</b></p>
+
−
</li>
+
−
<li>
+
−
<p><b>96 well plate</b></p>
+
−
</li>
+
−
<li>
+
−
<p><b>MATLAB 2018a software</b></p>
+
−
</li>
+
−
</ul>
+
−
<p><i>Procedure:</i></p>
+
−
<ol>
+
−
<li><p>
+
−
From the fluorescein spectrum, and the fluorescence data obtained from the <a href="">Interlab Study experiment</a>, blank, gain and efficiency <a href="#esquema_ops">corrections </a> have been made in the data set.
+
−
</p></li>
+
−
<li><p>
+
−
The data are introduced in the Excel file of the Interlab Study. With them we obtain the factor MEFL/RFU<sub>GFP</sub>. In our case, MEFL/RFU<sub>GFP</sub> = 271.2 (GFP equivalent molecules/RFU)
+
−
</p></li>
+
−
<li><p>
+
−
We establish the protocol of the experiment and the parameters of our equipment. The experiment consists in the measurement of the absorbance and fluorescence of two TU of identical structure, whose CDS codifies for GFP and sfGFP proteins. The most relevant information of the experiment is detailed in the following Table:
+
−
<table style="width:100%">
+
−
  <tr>
+
−
    <th><p>Parameters</p></th>
+
−
    <th><p>Description</p></th>
+
−
  </tr>
+
−
  <tr>
+
−
    <td><p>Time</p></td>
+
−
    <td><p>06:00:00 (HH:MM:SS). Measurement interval: 05:00 (MM:SS)</p></td>
+
−
  </tr>
+
−
  <tr>
+
−
    <td><p>Number of samples</p></td>
+
−
    <td><p>8 samples for each TU. Total samples: 16</p></td>
+
−
  </tr>
+
−
  <tr>
+
−
    <td><p>Temperature</p></td>
+
−
    <td><p>37 ºC</p></td>
+
−
  </tr>
+
−
    <tr>
+
−
    <td><p>Shake</p></td>
+
−
    <td><p>Double Orbital Continuous</p></td>
+
−
  </tr>
+
−
    <tr>
+
−
    <td><p>Absorbance. Optical Density (OD)</p></td>
+
−
    <td><p>Wavelenght at <b>600 nm</b> emission</p></td>
+
−
  </tr>
+
−
  <tr>
+
−
    <td><p>Excitacion wavelength</p></td>
+
−
    <td><p>485 nm</p></td>
+
−
  </tr>
+
−
  <tr>
+
−
    <td><p>Emission wavelength</p></td>
+
−
    <td><p>528 nm</p></td>
+
−
  </tr>
+
−
  <tr>
+
−
    <td><p>Gain</p></td>
+
−
    <td><p>60</p></td>
+
−
  </tr>
+
−
</table>
+
−
</p></li>
+
−
<li><p>
+
−
The experiment is introduced into the equipment and the absorbance and fluorescence curves are obtained, as well as the curve of {Fluorescence F/Absorbance OD} (FOD) ratio with the applied blank correction.
+
−
</p></li>
+
−
<li><p>
+
−
The absorbance and fluorescence data are exported to an Excel file.
+
−
</p></li>
+
−
<li><p>
+
−
Running the MATLAB <a href=""><i>GFP_sfGFP_comparison.m</i></a> script:
+
−
<ol style="list-style-type: lower-latin;">
+
−
<li>
+
−
<p>We extract the FOD data from the GFP and sfGFP from the Excel file.</p>
+
−
</li>
+
−
<li>
+
−
<p>We apply the gain and efficiency <a href="#esquema_ops">corrections </a> of the spectrum to the FOD.</p>
+
−
</li>
+
−
<li>
+
−
<p>We plot the FOD curves and look for a stationary equilibrium time interval in the expression of the GFP and sfGFP proteins. In our <a href="#comp_graph">experiment</a>, we have decided to chose the interval [145,290] min</p>
+
−
</li>
+
−
<li>
+
−
<p>We obtain the average value of both regions.</p>
+
−
</li>
+
−
<li>
+
−
<p>We calculate the number of GFP MEFLs by multiplying the FOD data by the MEFL/RFUGFP factor.</p>
+
−
</li>
+
−
<li>
+
−
<p>If we assume that the number of molecules expressed by both TU is the same, <a href="#cond_equiv_molec">the number of MEFL for the calculated GFP is the same as the number of MEFL for the sfGFP</a>.</p>
+
−
</li>
+
−
<li>
+
−
<p>We calculate the MEFL/RFUsfGFP factor by dividing the MEFL number by the average FOD value of the sfGFP in the stationary region. In our case, MEFL/RFU<s>sfGFP</s> = 121.4.</p>
+
−
</li>
+
−
</ol>
+
−
</p></li>
+
−
</ol>
+
  
−
<img id="comp_graph" src="https://static.igem.org/mediawiki/2018/e/e8/T--Valencia_UPV--comp_graphUPV2018.png"<span><p>sfGFP and GFP FOD (a.u) vs Time (min)</p></span>>
 
  
−
<table style="width:100%">
+
<!--------------------------------------------TEXTO------------------------------------------------>
−
  <tr>
+
−
    <th><p>Reporter protein</p></th>
+
−
    <th><p>MEFL/RFU factor</p></th>
+
−
  </tr>
+
−
  <tr>
+
−
    <td><p>GFP</p></td>
+
−
    <td><p>273.7</p></td>
+
−
  </tr>
+
−
  <tr>
+
−
    <td><p>sfGFP</p></td>
+
−
    <td><p>121.4</p></td>
+
−
  </tr>
+
−
  <tr>
+
−
</table>
+
−
<p>
+
−
With MEFL/RFU factors, FOD data obtained in any experiment in which GFP or sfGFP was used as reporter proteins can be transformed into equivalent fluorescein molecules by applying the following ratio: Molecules = (MEFL/RFU) x FOD.
+
−
</p>
+
−
<p>
+
−
The new data give us a more accurate estimate of the number of molecules in the cell. Consequently, by relating the experimental results with the theoretical mathematical models in the <a href="#optimization">optimization process</a>, the parameters of the model acquire values more consistent with their physical significance, working in equivalent molecules and not in arbitrary units.
+
−
</p>
+
  
  
−
                  <h4>Simulation Tool</h4>
 
−
                    <a class="anchorOffset" id="simtool"></a>
 
−
                    <p>
 
−
                    <!--Contenido de Simulation Tool -->
 
−
                    </p>
 
  
−
              </div>
+
   
−
            </div>
+
<div class="container hashlink" tabindex="-1" style="outline: none;position: relative;">
−
        </div>
+
−
      </div>
+
−
  </div>
+
−
</section>
+
  
  
  
 +
                                   
 +
                                   
 +
<div class="col-md-12" style="padding-top: 1em; padding-right: 0em; padding-left: 0em; position: relative; margin-right: 11em; outline: none;" tabindex="-1">
  
 +
<div style="
 +
margin-top: -14px;"><img src="https://static.igem.org/mediawiki/2018/5/55/T--Valencia_UPV--EsquemaHomeUPV2018.png" style="
 +
margin-bottom: 0px !important;
 +
margin-top: -8em;"><div><a href="https://2018.igem.org/Team:Valencia_UPV/Software"><div style="
 +
position: relative;
 +
z-index: 50;
 +
float: left; width: 52%;;"><img src="https://static.igem.org/mediawiki/2018/b/b5/T--Valencia_UPV--EsquemaHomeSoftUPV2018.png" style="
 +
float: left;
 +
margin-top: 0;
 +
  /* width: 56%; */">
 +
<div class="blue" style="
 +
opacity: 0.2;
 +
height: 100%;
 +
width: 100%;
 +
position: absolute;"></div>
 +
</div></a></div><div><a href="https://2018.igem.org/Team:Valencia_UPV/Parts"><div style="
 +
position: relative; z-index: 50; float: left; width: 47%;;"><img src="https://static.igem.org/mediawiki/2018/5/5a/T--Valencia_UPV--EsquemaHomePartsUPV2018.png" style="
 +
float: right;
 +
margin-top: 0;"><div class="yellow" style="
 +
opacity: 0.2;
 +
height: 100%;
 +
width: 100%;
 +
position: absolute;"></div></div>
  
 +
</a></div>
 +
<a href="https://2018.igem.org/Team:Valencia_UPV/Parts" style="
 +
position: relative; z-index: 50; float: left; width: 52%;;
 +
width: 48%;
 +
float: right;"></a>
  
 +
<a style="
 +
margin-top: 0em;
 +
width: 35%; position: relative; z-index: 50; float: left; /* width: 52%; */;;
 +
float: left;"><img src="https://static.igem.org/mediawiki/2018/1/1c/T--Valencia_UPV--EsquemaHomePrintUPV2018.png" style="
 +
margin-top: 0px;"></a></div><div><a href="https://2018.igem.org/Team:Valencia_UPV/Model"><div style="
 +
position: relative; z-index: 50; float: left; width: 65%;;"><img src="https://static.igem.org/mediawiki/2018/2/2d/T--Valencia_UPV--EsquemaHomeModelUPV2018.png" style="
 +
float: right;
 +
margin-top: 0;"><div class="red" style="
 +
opacity: 0.2;
 +
height: 100%;
 +
width: 100%;
 +
position: absolute;"></div></div>
  
−
        <!--<div class="loader"></div>-->
+
</a></div><div><a href="https://2018.igem.org/Team:Valencia_UPV/Hardware"><div style="
−
        <a class="back-to-top inner-link" href="#start" data-scroll-class="100vh:active" style="font-size: 82%;">
+
position: relative; z-index: 50; float: left; width: 100%;;"><img src="https://static.igem.org/mediawiki/2018/e/ed/T--Valencia_UPV--EsquemaHomeHardUPV2018.png" style="
−
            <i class="stack-interface stack-up-open-big"></i>
+
float: right;
−
        </a>
+
margin-top: 0;"><div class="yellow" style="
 +
opacity: 0.2;
 +
height: 100%;
 +
width: 100%;
 +
position: absolute;"></div></div>
 +
 
 +
</a></div>
 +
 
 +
</div><div class="col-md-12 row" style="
 +
padding-left: 2em;
 +
padding-right: 0em !important;margin-bottom: 5em;">
 +
                   
 +
<div class="col-md-3"><div style="
 +
;
 +
float: left;
 +
border: 1px solid #535353;margin: 5px;padding: 0px;border-radius: 16px; ;"><a href="https://2018.igem.org/Team:Valencia_UPV/Hardware"><div style="
 +
background-position: center center;
 +
background-size: cover;
 +
;
 +
height: 142px !important;
 +
border-top-left-radius: 13px;
 +
border-top-right-radius: 13px;
 +
background-image: url(https://static.igem.org/mediawiki/2018/9/90/T--Valencia_UPV--GifHomeHardwareUPV2018.gif);"></div><p style="
 +
padding: 24px;">Find out how we made possible the automatization of printing genetic circuits on bacteria</p></a>
 +
 
 +
</div></div>
 +
<div class="col-md-3"><div style="
 +
;
 +
float: left;
 +
border: 1px solid #535353;margin: 5px;padding: 0px;border-radius: 16px; ;"><a href="https://2018.igem.org/Team:Valencia_UPV/Software"><div style="
 +
background-position: center center;
 +
background-size: cover;
 +
;
 +
height: 142px !important;
 +
border-top-left-radius: 13px;
 +
border-top-right-radius: 13px;
 +
background-image: url(https://static.igem.org/mediawiki/2018/7/70/T--Valencia_UPV--GifHomeSoftwareUPV2018.gif);"></div><p style="
 +
padding: 24px;">Check out the intuitive software that we have developed to design genetic circuits.</p></a>
 +
 
 +
</div></div>
 +
<div class="col-md-3"><div style="
 +
;
 +
float: left;
 +
border: 1px solid #535353;margin: 5px;padding: 0px;border-radius: 16px; ;"><a href="https://2018.igem.org/Team:Valencia_UPV/Design"><div style="
 +
background-position: center center;
 +
background-size: cover;
 +
;
 +
height: 142px !important;
 +
border-top-left-radius: 13px;
 +
border-top-right-radius: 13px;
 +
background-image: url(https://static.igem.org/mediawiki/2018/b/b2/T--Valencia_UPV--GifHomeDesignUPV2018.gif);"></div><p style="
 +
padding: 24px;">See how we have designed our part collection to facilitate assembly automation.</p></a>
 +
 
 +
</div></div><div class="col-md-3"><div style="
 +
;
 +
float: left;
 +
border: 1px solid #535353;margin: 5px;padding: 0px;border-radius: 16px; ;"><a href="https://2018.igem.org/Team:Valencia_UPV/Model"><div id="btnHomeModel" style="
 +
background-position: center center;
 +
background-size: cover;
 +
;
 +
height: 142px !important;
 +
border-top-left-radius: 13px;
 +
border-top-right-radius: 13px;
 +
background-image: url(https://static.igem.org/mediawiki/2018/2/21/T--Valencia_UPV--GifHomeModelUPV2018.gif);"></div><p style="
 +
padding-bottom: 22px;
 +
padding-top: 24px;
 +
padding-right: 12px;
 +
padding-left: 24px !important;">Do you want to discover the multiple possibilities that Printeria modeling offers you?</p>
 +
 
 +
</a>
  
−
    </body>
+
</div></div>
 +
                   
  
 +
                   
 +
                   
 +
                   
 +
                   
 +
                   
 +
                   
 +
                   
 +
                   
 +
                    </div><!--end of row-->
 +
                                </div></row></div>
 +
</body>
  
 
         <script type="text/javascript"  src="https://2018.igem.org/Template:Valencia_UPV/scriptsJS?action=raw&ctype=text/javascript"></script>
 
         <script type="text/javascript"  src="https://2018.igem.org/Template:Valencia_UPV/scriptsJS?action=raw&ctype=text/javascript"></script>
 
         <script type="text/javascript"  src="https://2018.igem.org/Template:Valencia_UPV/jquery311minJS?action=raw&ctype=text/javascript"></script>
 
         <script type="text/javascript"  src="https://2018.igem.org/Template:Valencia_UPV/jquery311minJS?action=raw&ctype=text/javascript"></script>
−
        <script type="text/javascript"  src="https://2018.igem.org/Template:Valencia_UPV/bootstrapMinJS?action=raw&ctype=text/javascript"></script>
 
 
         <script type="text/javascript"  src="https://2018.igem.org/Template:Valencia_UPV/parallaxJS?action=raw&ctype=text/javascript"></script>
 
         <script type="text/javascript"  src="https://2018.igem.org/Template:Valencia_UPV/parallaxJS?action=raw&ctype=text/javascript"></script>
−
      <script type="text/javascript"  src="https://2018.igem.org/Template:Valencia_UPV/smoothscrollminJS?action=raw&ctype=text/javascript"></script>
+
        <script type="text/javascript"  src="https://2018.igem.org/Template:Valencia_UPV/smoothscrollminJS?action=raw&ctype=text/javascript"></script>
 
       <script type="text/javascript"  src="https://2018.igem.org/Template:Valencia_UPV/jquerystepsminJS?action=raw&ctype=text/javascript"></script>
 
       <script type="text/javascript"  src="https://2018.igem.org/Template:Valencia_UPV/jquerystepsminJS?action=raw&ctype=text/javascript"></script>
−
       
+
<script>
  
 +
(function ($) {
 +
  $(document).ready(function(){
 +
   
 +
// hide .nav-container first
 +
$(".nav-container").hide();
 +
 +
// fade in .nav-container
 +
$(function () {
 +
$(window).scroll(function () {
 +
            // set distance user needs to scroll before we fadeIn navbar
 +
if ($(this).scrollTop() > 100) {
 +
$('.nav-container').fadeIn();
 +
} else {
 +
$('.nav-container').fadeOut();
 +
}
 +
});
  
 +
 +
});
  
−
</html>
+
});
 +
  }(jQuery));
  
 +
</script>
 +
 +
 +
 +
 +
</html>
 
{{Valencia_UPV/footer}}
 
{{Valencia_UPV/footer}}

Latest revision as of 17:17, 7 December 2018

Stack Multipurpose HTML Template

image
image
image

Abstract

Access to Synthetic Biology by an interested layperson is currently hampered by several barriers, including a required background knowledge and availability of expensive and often bulky technological equipment. Printeria is a fully-equipped bioengineering device able to automate the process of printing genetic circuits in bacteria but made as simple and easy to operate as a domestic desktop printer. It breaks down these barriers using a digital microfluidic system creating little droplets that can be mixed and moved across predefined electrode paths on a PCB surface. Printeria combines this novel system with Golden Gate Technology, low-cost sensors and electronics, and a user-friendly software application. In this way, the user is capable of assembling DNA parts in a one-step reaction and control all steps: from the parts assembly and transformation to perform experiments of the printed genetic circuit with high accuracy. Printeria opens the door to a world of applications affordable for the general public.

image

CONTACT US igem.upv.2018@gmail.com