Difference between revisions of "Team:Calgary/Model"

 
(37 intermediate revisions by 4 users not shown)
Line 5: Line 5:
 
<script src="https://2019.igem.org/Template:Calgary/DynamicSizeModelPage?action=raw&ctype=text/javascript"></script>
 
<script src="https://2019.igem.org/Template:Calgary/DynamicSizeModelPage?action=raw&ctype=text/javascript"></script>
 
<style>
 
<style>
.content-panel.project-icons {
+
.expand-on-hover:hover {
background-color: #f3f3f3;
+
}
+
 
+
.content-panel.project-icons .component-holder {
+
display: flex;
+
flex-direction: column;
+
margin-top: 120px;
+
}
+
 
+
.content-panel.project-icons .component-holder .component-row {
+
display: flex;
+
flex-direction: row;
+
margin-bottom: 40px;
+
margin-left: auto;
+
margin-right: auto;
+
}
+
 
+
.content-panel.project-icons .component-holder .component-row:last-child {
+
margin-bottom: 0px;
+
}
+
 
+
.content-panel.project-icons .component-holder .component-row > * {
+
margin-right: 40px;
+
}
+
 
+
.content-panel.project-icons .component-holder .component-row > *:last-child {
+
margin-right: 0px;
+
}
+
 
+
.content-panel.project-icons .component-holder .component-row .project-component {
+
text-align: center;
+
max-width: 260px;
+
padding: 30px;
+
transform: scale(1);
+
-webkit-transition: transform 1000ms linear;
+
    -ms-transition: transform 500ms linear;
+
    transition: transform 500ms linear;
+
cursor: pointer;
+
background-color: white;
+
}
+
 
+
.content-panel.project-icons .component-holder .component-row .project-component:hover {
+
 
transform: scale(1.1);
 
transform: scale(1.1);
 
-webkit-transition: transform 500ms linear;
 
-webkit-transition: transform 500ms linear;
Line 55: Line 13:
 
}
 
}
  
.content-panel.project-icons .component-holder .component-row .project-component:hover .icon svg > * {
+
.expand-on-hover:hover .icon svg > * {
 
stroke: #F8B200;
 
stroke: #F8B200;
 
     -webkit-transition: stroke 500ms linear;
 
     -webkit-transition: stroke 500ms linear;
Line 62: Line 20:
 
}
 
}
  
.content-panel.project-icons .component-holder .component-row .project-component:hover p {
+
.expand-on-hover:hover p {
 
color: #444444;
 
color: #444444;
 
     -webkit-transition: color 500ms linear;
 
     -webkit-transition: color 500ms linear;
 
     -ms-transition: color 500ms linear;
 
     -ms-transition: color 500ms linear;
 
     transition: color 500ms linear;
 
     transition: color 500ms linear;
}
 
 
.content-panel.project-icons .component-holder .component-row .project-component p {
 
text-align: center;
 
color: #AAAAAA;
 
-webkit-transition: color 500ms linear;
 
    -ms-transition: color 500ms linear;
 
    transition: color 500ms linear;
 
}
 
 
.content-panel.project-icons .component-holder .component-row .project-component h2 {
 
 
    font-weight: 600;
 
    font-size: 16px;
 
    line-height: 24px;
 
    text-transform: uppercase;
 
    font-variant: small-caps;
 
margin-bottom: 5px;
 
 
}
 
 
.content-panel.project-icons .component-holder .component-row .project-component .icon {
 
margin-bottom: 20px;
 
}
 
 
.content-panel.project-icons .component-holder .component-row .project-component .icon svg > * {
 
stroke: #00C2FF;
 
    -webkit-transition: stroke 1000ms linear;
 
    -ms-transition: stroke 1000ms linear;
 
    transition: stroke 1000ms linear;
 
}
 
 
@media only screen and (max-width: 750px) {
 
 
    .content-panel.project-icons .component-holder .component-row {
 
        flex-direction: column;
 
        margin-bottom: 40px;
 
        margin-left: auto;
 
        margin-right: auto;
 
    }
 
 
    .content-panel.project-icons .component-holder .component-row > * {
 
        margin-right: 0px;
 
margin-bottom: 40px;
 
    }
 
 
    .content-panel.project-icons .component-holder .component-row > *:last-child {
 
        margin-right: 0px;
 
margin-bottom: 0px;
 
    }
 
 
}
 
 
 
.content-panel.pipeline > h1, .content-panel.highlights > h1, .content-panel.project-icons > h1 {
 
 
display: flex;
 
 
font-family: Barlow SemiBold;
 
font-style: normal;
 
font-weight: 600;
 
font-size: 48px;
 
 
color: rgb(68, 68, 68);
 
 
line-height: 58px;
 
letter-spacing: 0.2em;
 
text-transform: uppercase;
 
justify-content: center;
 
text-align: center;
 
 
}
 
 
.content-panel.pipeline > h2, .content-panel.highlights > h2, .content-panel.project-icons > h2 {
 
 
display: flex;
 
 
font-family: Barlow Medium;
 
font-style: normal;
 
font-weight: 500;
 
font-size: 36px;
 
 
color: rgba(68, 68, 68, 0.5);
 
 
line-height: 43px;
 
justify-content: center;
 
letter-spacing: 0.1em;
 
text-align: center;
 
 
margin-bottom: 80px;
 
 
}
 
 
.content-panel.dynamic-padding {
 
padding: 80px;
 
}
 
 
@media only screen and (max-width: 900px) {
 
 
.content-panel.dynamic-padding {
 
padding: 50px;
 
}
 
 
}
 
 
@media only screen and (max-width: 600px) {
 
 
.content-panel.pipeline > h1, .content-panel.highlights > h1, .content-panel.project-icons > h1 {
 
 
        font-size: 36px;
 
 
        line-height: 50px;
 
 
    }
 
 
    .content-panel.pipeline > h2, .content-panel.highlights > h2. .content-panel.project-icons > h2 {
 
 
font-size: 30px;
 
 
        line-height: 45px;
 
 
    }
 
 
}
 
 
@media only screen and (max-width: 400px) {
 
 
#bodyContent .content-panel.pipeline > h1, .content-panel.highlights > h1, .content-panel.project-icons > h1 {
 
 
        font-size: 30px;
 
 
        line-height: 40px;
 
 
    }
 
 
    #bodyContent .content-panel.pipeline > h2, .content-panel.highlights > h2, .content-panel.project-icons > h2 {
 
 
font-size: 24px;
 
 
        line-height: 35px;
 
 
    }
 
 
 
}
 
}
 
</style>
 
</style>
Line 217: Line 32:
 
<div class="container-fluid">
 
<div class="container-fluid">
  
<div class = "fixed" id="fixed-content">
 
 
 
<div class="mobile-banner-back" id="banner">
 
<div class="page-banner">
 
<h2 class="page-subtitle">Section &nbsp;&nbsp;/&nbsp;&nbsp; <span class="emphasis">Page</span></h2>
 
<img src="Navigation Section.svg">
 
</div>
 
</div>
 
 
<div class="progress-container">
 
<progress value="0" max="100" id="bar"></progress>
 
</div>
 
 
</div>
 
  
 
<div class="desktop-banner-back">
 
<div class="desktop-banner-back">
 
<div class="text-area">
 
<div class="text-area">
 
<div class="page-banner">
 
<div class="page-banner">
<h1 class="page-title"><img src="https://static.igem.org/mediawiki/2019/f/fc/T--Calgary--yoilLogo.png" width="30%" style="margin-left: auto;
+
<h1 class="page-title">Modelling</h1>
  margin-right: auto;
+
  display: block;"/></h1>
+
 
</div>
 
</div>
 
</div>
 
</div>
<div class="overlap-area" id="overlap"></div>
 
 
</div>
 
</div>
  
Line 256: Line 53:
  
 
<div class="header-area">
 
<div class="header-area">
<h2>Modelling</h2>
+
<h1>Modelling</h1>
 
</div>
 
</div>
  
<p style="margin-bottom:5vh">Blurb about why modelling is so important</p>
+
<p style="margin-bottom:5vh"><b>Modelling is an extremely powerful aspect of every iGEM project.</b> Models can verify a teams knowledge of their system, and they can also be integral to a projects overall design. We decided early on that for our system to be successful we would have to integrate modelling into the design of every facet of our project. This included the dynamic understanding of our chlorophyll binding protein(6GIX), the informed engineering of 6GIX, the characterization and optimization of our emulsion systems, and the development of the Icarus spacer.
<img src="https://static.igem.org/mediawiki/2019/7/72/T--Calgary--MODFLOW.svg" width="66%" style="margin-left: auto; margin-right: auto; display: block;"/>
+
<br><br>
<p>The workflow of iGEM's Calgary modelling team followed a natural progression to inform both the wetlab and the wetlab informing our modelling.</p>
+
<b>To ensure that we fully utilize the models we generate,</b> a standardized modelling workflow was developed. This workflow was designed to confirm that the models generated actually have a tangible integration into the wetlab portion of the project. Along with the integration into the wetlab, this workflow also allowed for us to take advantage of the wetlabs experience and knowledge at multiple stages. Below is a diagram that illustrates our workflow.
 +
</p>
 +
<img src="https://static.igem.org/mediawiki/2019/7/72/T--Calgary--MODFLOW.svg" width="66%" style="margin-left: auto; margin-right: auto; display: block;"/><br>
 +
<p>This workflow ensured that as we developed models we did not lose sight of the main goal behind these models. Ultimately each modelling component was generated to impact and integrate into the final project. Along with keeping each model focused on integration, the inclusion of our wetlab at multiple steps allowed the team to build familiarity and confidence in the developed model.
 +
</p>
 +
<p style="margin-bottom:5vh">An examplar of this workflow is the <a class="abody" href="https://2019.igem.org/Team:Calgary/Model/EmulsionPrediction" target="_blank">Emulsion Construction Prediction model</a>. Problems in predicting emulsion behaviour in silico led to wet lab data collection to then feed the model. Using the model we could then collect more data in the wet lab, and this cycle was iterated thoroughly. This model was invaluable in <a class="abody" href="https://2019.igem.org/Team:Calgary/Demonstrate" target="_blank">demonstrating</a> our protein's function in emulsions.</p>
 +
 
 +
 
 +
 
 +
 
 +
 
 
<div class="row">
 
<div class="row">
  
<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12" > <a href="https://2019.igem.org/Team:Calgary/Model/ICARUS">
+
<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12 expand-on-hover" > <a target="blank" href="https://2019.igem.org/Team:Calgary/Model/ICARUS">
 
                 <div class="container__sources">
 
                 <div class="container__sources">
 
                     <img src="https://static.igem.org/mediawiki/2019/9/9b/T--Calgary--newICARUS.png" width="28%" style="margin-left: auto; margin-right: auto; display: block;"/>
 
                     <img src="https://static.igem.org/mediawiki/2019/9/9b/T--Calgary--newICARUS.png" width="28%" style="margin-left: auto; margin-right: auto; display: block;"/>
 
                     <div class="sources--cms">
 
                     <div class="sources--cms">
                         <h3>ICARUS - <i>Pheophorbide Production</i></h3>
+
                         <h3 style="text-align:center">ICARUS - <i>Pheophorbide Production</i></h3>
                         <p><b>i</b>GEM <b>C</b>algary <b>A</b>ugmented <b>R</b>epulsion <b>U</b>niversal <b>S</b>pacer: <br/>A spacer to his-purify proteins.</p>
+
                         <p style="text-align:center"><b>i</b>GEM <b>C</b>algary <b>A</b>ugmented <b>R</b>epulsion <b>U</b>niversal <b>S</b>pacer: <br/>A spacer to his-purify proteins.</p>
 
                     </div>
 
                     </div>
  
Line 277: Line 84:
  
  
<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12" > <a href="https://2019.igem.org/Team:Calgary/Model/EmulsionPrediction">
+
<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12 expand-on-hover" > <a target="blank" href="https://2019.igem.org/Team:Calgary/Model/EmulsionPrediction">
 
                 <div class="container__sources">
 
                 <div class="container__sources">
 
                     <img src="https://static.igem.org/mediawiki/2019/3/31/T--Calgary--ternaryPhaseGIF.gif" width="25%"style="margin-left: auto; margin-right: auto; display: block;"/>
 
                     <img src="https://static.igem.org/mediawiki/2019/3/31/T--Calgary--ternaryPhaseGIF.gif" width="25%"style="margin-left: auto; margin-right: auto; display: block;"/>
 
                     <div class="sources--cms">
 
                     <div class="sources--cms">
                         <h3>Emulsion Construction Prediction - <i>Emulsified Proteins</i></h3>
+
                         <h3 style="text-align:center">Emulsion Construction Prediction - <i>Emulsified Proteins</i></h3>
                         <p>Using machine learning to predict phase of an emulsion at any composition.</p>
+
                         <p style="text-align:center">Using machine learning to predict phase of an emulsion at any composition.</p>
 
                     </div>
 
                     </div>
  
Line 298: Line 105:
 
<div class="row" style="margin-bottom:5vh">
 
<div class="row" style="margin-bottom:5vh">
  
<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12"> <a href="https://2019.igem.org/Team:Calgary/Model/DirectedProteinModification">
+
<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12 expand-on-hover"> <a target="blank" href="https://2019.igem.org/Team:Calgary/Model/DirectedProteinModification">
 
                 <div class="container__sources">
 
                 <div class="container__sources">
 
                     <img src="https://static.igem.org/mediawiki/2019/1/1b/T--Calgary--Tobeyfromtheoffice.png" width="60%"style="margin-left: auto; margin-right: auto; display: block;"/>
 
                     <img src="https://static.igem.org/mediawiki/2019/1/1b/T--Calgary--Tobeyfromtheoffice.png" width="60%"style="margin-left: auto; margin-right: auto; display: block;"/>
 
                     <div class="sources--cms">
 
                     <div class="sources--cms">
                         <h3>Directed Protein Structure Modification - <i>modGIX</i></h3>
+
                         <h3 style="text-align:center">Directed Protein Structure Modification - <i>ModGIX</i></h3>
                         <p>Using in silico dynamic simulations to perform informed modifications of amino acids in proteins. </p>
+
                         <p style="text-align:center">Using in silico dynamic simulations to perform informed modifications of amino acids in proteins. </p>
 
                     </div>
 
                     </div>
  
Line 312: Line 119:
  
  
<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12"> <a href="https://2019.igem.org/Team:Calgary/Model/InSilicoEmulsionSystemVerification">
+
<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12 expand-on-hover"> <a target="blank" href="https://2019.igem.org/Team:Calgary/Model/InSilicoEmulsionSystemVerification">
 
                 <div class="container__sources">
 
                 <div class="container__sources">
 
                     <img src="https://static.igem.org/mediawiki/2019/d/d9/T--Calgary--WIKIDYNAMICS-Icon.png" width="29%"style="margin-left: auto; margin-right: auto; display: block;"/>
 
                     <img src="https://static.igem.org/mediawiki/2019/d/d9/T--Calgary--WIKIDYNAMICS-Icon.png" width="29%"style="margin-left: auto; margin-right: auto; display: block;"/>
 
                     <div class="sources--cms">
 
                     <div class="sources--cms">
                         <h3>In Silico Emulsion System Verification - <i>6GIX</i></h3>
+
                         <h3 style="text-align:center">In Silico Emulsion System Verification - <i>6GIX</i></h3>
                         <p>Verifying emulsified protein function and structure stability in antagonistic solvents. </p>
+
                         <p style="text-align:center">Verifying emulsified protein function and structure stability in antagonistic solvents. </p>
 
                     </div>
 
                     </div>
  
Line 326: Line 133:
  
 
</div>
 
</div>
<div class="interface-group">
+
 
<div class="content-panel highlights dynamic-padding">
+
            </div> </div>   
<h1>Project Highlights</h1>
+
<div class="article-holder">
+
<div class="emphasis-quote" data-link="https://2019.igem.org/Team:Calgary/Modelling/StandardizedSeedGrading">
+
<img class="quotation" src="https://static.igem.org/mediawiki/2019/a/a8/T--Calgary--quotation.svg">
+
<p class="quote">Green is the different between profit and loss.</p>
+
<img class="quotation" src="https://static.igem.org/mediawiki/2019/a/a8/T--Calgary--quotation.svg">
+
</div>
+
<div class="articles">
+
<div class="article-row">
+
<div class="article" data-link="https://2019.igem.org/Team:Calgary/Anti-Fungal">
+
<h2>Chlorophyll Repurposing</h2>
+
<h1>An Anti-Fungal Treatment</h1>
+
<p>Fungus growth has proven to be a destructive condition for canola plants and we may have found a solution.</p>
+
</div>
+
<div class="article" data-link="https://2019.igem.org/Team:Calgary/Model/InSilicoEmulsionSystemVerification">
+
<h2>Modelling</h2>
+
<h1>Understanding our protein in different environments</h1>
+
<p>With the direction, knowledge, and tools supplied by Dr. Anderson we were off to design the experiments that would allow for the better understanding of the 6GIX protein in multiple systems.</p>
+
</div>
+
</div>
+
<div class="article-row" data-link="https://2019.igem.org/Team:Calgary/Software">
+
<div class="article">
+
<h2>Software</h2>
+
<h1>Optimizing the production and synthesis of DNA</h1>
+
<p>Codon optimization is a standard problem in synthetic biology. We created a tool that removes repeats, hairpins, and keeps GC richness below a certain percentage.</p>
+
</div>
+
<div class="article" data-link="https://2019.igem.org/Team:Calgary/Entrepreneurship">
+
<h2>Entrepreneurship</h2>
+
<h1>Commercializing our Project</h1>
+
<p>Over the summer, we examined the entrepreneurial aspects of our project and navigated intellectual property regulations and market analysis techniques.</p>
+
</div>
+
</div>
+
</div>
+
</div></div>
+
    </div>
+
  </div>
+
</div>
+
            </div>   
+
 
</body>
 
</body>
 
</html>
 
</html>
 
{{Calgary/Footer}}
 
{{Calgary/Footer}}

Latest revision as of 03:02, 22 October 2019

Modelling

Modelling

Modelling is an extremely powerful aspect of every iGEM project. Models can verify a teams knowledge of their system, and they can also be integral to a projects overall design. We decided early on that for our system to be successful we would have to integrate modelling into the design of every facet of our project. This included the dynamic understanding of our chlorophyll binding protein(6GIX), the informed engineering of 6GIX, the characterization and optimization of our emulsion systems, and the development of the Icarus spacer.

To ensure that we fully utilize the models we generate, a standardized modelling workflow was developed. This workflow was designed to confirm that the models generated actually have a tangible integration into the wetlab portion of the project. Along with the integration into the wetlab, this workflow also allowed for us to take advantage of the wetlabs experience and knowledge at multiple stages. Below is a diagram that illustrates our workflow.


This workflow ensured that as we developed models we did not lose sight of the main goal behind these models. Ultimately each modelling component was generated to impact and integrate into the final project. Along with keeping each model focused on integration, the inclusion of our wetlab at multiple steps allowed the team to build familiarity and confidence in the developed model.

An examplar of this workflow is the Emulsion Construction Prediction model. Problems in predicting emulsion behaviour in silico led to wet lab data collection to then feed the model. Using the model we could then collect more data in the wet lab, and this cycle was iterated thoroughly. This model was invaluable in demonstrating our protein's function in emulsions.