Difference between revisions of "Team:Calgary/Model"

 
(140 intermediate revisions by 5 users not shown)
Line 1: Line 1:
 +
{{:Template:Calgary/Layout}}
 
<html>
 
<html>
 
<head>
 
<head>
 +
<link rel="stylesheet" type="text/css" href="https://2019.igem.org/Template:Calgary/Model-Styling?action=raw&ctype=text/css">
 +
<script src="https://2019.igem.org/Template:Calgary/DynamicSizeModelPage?action=raw&ctype=text/javascript"></script>
 +
<style>
 +
.expand-on-hover:hover {
 +
transform: scale(1.1);
 +
-webkit-transition: transform 500ms linear;
 +
    -ms-transition: transform 500ms linear;
 +
    transition: transform 500ms linear;
 +
cursor: pointer;
 +
}
  
−
<meta name="viewport" content="width=device-width, initial-scale=1.0">
+
.expand-on-hover:hover .icon svg > * {
 +
stroke: #F8B200;
 +
    -webkit-transition: stroke 500ms linear;
 +
    -ms-transition: stroke 500ms linear;
 +
    transition: stroke 500ms linear;
 +
}
  
−
<title>Page Template</title>
+
.expand-on-hover:hover p {
−
 
+
color: #444444;
−
<!-- CSS Dependencies -->
+
    -webkit-transition: color 500ms linear;
−
  <link rel="stylesheet" type="text/css" href="https://2019.igem.org/Template:Calgary/Bootstrap?action=raw&ctype=text/css">
+
    -ms-transition: color 500ms linear;
−
 
+
    transition: color 500ms linear;
−
<!-- In-House CSS -->
+
}
−
  <link rel="stylesheet" type="text/css" href="https://2019.igem.org/Template:Calgary/WikiReset-Styling?action=raw&ctype=text/css">
+
</style>
−
<link rel="stylesheet" type="text/css" href="https://2019.igem.org/Template:Calgary/Banner-Styling?action=raw&ctype=text/css">
+
−
<link rel="stylesheet" type="text/css" href="https://2019.igem.org/Template:Calgary/GeneralSelectionMenu-Styling?action=raw&ctype=text/css">
+
−
<link rel="stylesheet" type="text/css" href="https://2019.igem.org/Template:Calgary/General-Styling?action=raw&ctype=text/css">
+
−
<link rel="stylesheet" type="text/css" href="https://2019.igem.org/Template:Calgary/TemplateSelectionMenu-Styling?action=raw&ctype=text/css">
+
−
<link rel="stylesheet" type="text/css" href="https://2019.igem.org/Template:Calgary/Template-Styling?action=raw&ctype=text/css">
+
−
 
+
−
 
+
−
<!-- Code Dependencies
+
−
<script src="https://2019.igem.org/Template:Calgary/jQuery-Code?action=raw&ctype=text/javascript"></script>
+
−
-->
+
−
<script src="https://2019.igem.org/Template:Calgary/PopperJS-Code?action=raw&ctype=text/javascript"></script>
+
−
<script src="https://2019.igem.org/Template:Calgary/Bootstrap-Code?action=raw&ctype=text/javascript"></script>
+
−
<script src="https://2019.igem.org/Template:Calgary/SmoothScroll-Code?action=raw&ctype=text/javascript"></script>
+
−
 
+
−
<!-- In-House Code -->
+
−
<script src="https://2019.igem.org/Template:Calgary/General-Code?action=raw&ctype=text/javascript"></script>
+
−
<script src="https://2019.igem.org/Template:Calgary/Template-Code?action=raw&ctype=text/javascript"></script>
+
−
<script src="https://2019.igem.org/Template:Calgary/TemplateBase-Code?action=raw&ctype=text/javascript"></script>
+
−
<script src="https://2019.igem.org/Template:Calgary/InitiateTemplate-Code?action=raw&ctype=text/javascript"></script>
+
−
<script src="https://2019.igem.org/Template:Calgary/Definitions-Code?action=raw&ctype=text/javascript"></script>
+
−
        <script src="https://2019.igem.org/Template:Calgary/DynamicSizeModelPage?action=raw&ctype=text/javascript"></script>
+
 
</head>
 
</head>
 
<body>
 
<body>
−
 
+
 
 
<div class="container-fluid">
 
<div class="container-fluid">
  
−
<div class = "fixed" id="fixed-content">
 
−
<nav class="navbar navbar-expand-lg navbar-dark nav-down" id="navbar">
 
−
  <a class="navbar-brand" href="#">yOIL</a>
 
−
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
 
−
    <span class="navbar-toggler-icon"></span>
 
−
  </button>
 
  
−
  <div class="collapse navbar-collapse" id="navbarSupportedContent">
+
<div class="desktop-banner-back">
−
    <ul class="navbar-nav mr-auto">
+
<div class="text-area">
−
      <li class="nav-item">
+
<div class="page-banner">
−
        <a class="nav-link" href="notebook.html">Notebook</a>
+
<h1 class="page-title">Modelling</h1>
−
      </li>
+
</div>
−
      <li class="nav-item dropdown">
+
</div>
−
        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Team</a>
+
−
        <div class="dropdown-menu" aria-labelledby="navbarDropdown">
+
−
          <a class="dropdown-item" href="#">Members</a>
+
−
          <a class="dropdown-item" href="#">Collaborations</a>
+
−
          <div class="dropdown-divider"></div>
+
−
          <a class="dropdown-item" href="#">Sponsors</a>
+
−
        </div>
+
−
      </li>
+
−
      <li class="nav-item dropdown">
+
−
        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Project</a>
+
−
        <div class="dropdown-menu" aria-labelledby="navbarDropdown">
+
−
          <a class="dropdown-item" href="#">Description</a>
+
−
          <a class="dropdown-item" href="#">Design</a>
+
−
          <a class="dropdown-item" href="#">Experiments</a>
+
−
          <div class="dropdown-divider"></div>
+
−
          <a class="dropdown-item" href="#">Modelling</a>
+
−
          <a class="dropdown-item" href="#">Software</a>
+
−
          <a class="dropdown-item" href="#">Hardware</a>
+
−
          <div class="dropdown-divider"></div>
+
−
          <a class="dropdown-item" href="#">Results</a>
+
−
          <a class="dropdown-item" href="#">Improvements</a>
+
−
          <a class="dropdown-item" href="#">Attributions</a>
+
−
        </div>
+
−
      </li>
+
−
      <li class="nav-item dropdown">
+
−
        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Notebook</a>
+
−
        <div class="dropdown-menu" aria-labelledby="navbarDropdown">
+
−
          <a class="dropdown-item" href="#">Entries</a>
+
−
          <a class="dropdown-item" href="#">Protocols</a>
+
−
        </div>
+
−
      </li>
+
−
      <li class="nav-item dropdown">
+
−
        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Human Practices</a>
+
−
        <div class="dropdown-menu" aria-labelledby="navbarDropdown">
+
−
          <a class="dropdown-item" href="#">Human Practices</a>
+
−
          <a class="dropdown-item" href="#">Educational Outreach</a>
+
−
        </div>
+
−
      </li>
+
−
      <li class="nav-item dropdown">
+
−
        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Outreach</a>
+
−
        <div class="dropdown-menu" aria-labelledby="navbarDropdown">
+
−
          <a class="dropdown-item" href="#">Human Practices</a>
+
−
          <a class="dropdown-item" href="#">Educational Outreach</a>
+
−
        </div>
+
−
      </li>
+
−
      <li class="nav-item dropdown">
+
−
        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Outreach</a>
+
−
        <div class="dropdown-menu" aria-labelledby="navbarDropdown">
+
−
          <a class="dropdown-item" href="#">Human Practices</a>
+
−
          <a class="dropdown-item" href="#">Educational Outreach</a>
+
−
        </div>
+
−
      </li>
+
−
    </ul>
+
−
  </div>
+
−
</nav>
+
−
 
+
−
+
 
</div>
 
</div>
  
 +
<div class="interface-group">
 +
<!-- <div class="desktop-section-menu" id="desktop-section-menu">
 +
<div class="sections" id="desktop-sections">
 +
</div>
 +
<div class="back-to-top" id="go-top">
 +
<a class="goto-top" href="#">Back to Top</a>
 +
</div>
 +
</div>-->
 +
<div class="content-area" id="textual-content">
  
−
<body>
 
  
−
<div class="container">
+
<div class="header-area">
−
    <div class="row">
+
<h1>Modelling</h1>
 +
</div>
  
 +
<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.
 +
<br><br>
 +
<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>
  
  
−
    <a href="">
 
−
        <div class="col">
 
−
            <div class="container__sources">
 
−
                <img src="img/PhasePrediction/ternaryPhaseDiagram.gif" height="10%" width="10%">
 
−
                <div class="sources--cms">
 
−
                    <h3>Protein Emulsion Formulation</h3>
 
−
                    <p>Using classification algorithms to design our emulsions.</p>
 
−
                </div>
 
  
−
            </div>
 
−
        </div>
 
−
    </a>
 
  
  
−
    </div>
+
<div class="row">
  
−
    <svg viewBox="0 0 10 100">
+
<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">
−
        <line x1="5" x2="5" y1="0" y2="100"></line>
+
                <div class="container__sources">
−
    </svg>
+
                    <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">
 +
                        <h3 style="text-align:center">ICARUS - <i>Pheophorbide Production</i></h3>
 +
                        <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>
  
−
    <!-- Row 2 -->
+
                </div></a>
 +
</div>
  
−
    <div class="row">
 
−
        <div class="col">
 
−
            <a href="">
 
−
            <div class="container__sources">
 
−
                <img src="img/seedStrip.png" width="50%" height="50%">
 
−
                <div class="sources--cms">
 
−
                    <h3>Standardized Seed grading</h3>
 
−
                    <p>Color grading algorithm with hardware.</p>
 
−
                </div>
 
  
−
            </div>
 
−
            </a>
 
−
        </div>
 
  
−
        <div class="col">
+
<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">
−
            <hr style="width: 100%;
+
                <div class="container__sources">
−
    margin-top: 80%;">
+
                    <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">
 +
                        <h3 style="text-align:center">Emulsion Construction Prediction - <i>Emulsified Proteins</i></h3>
 +
                        <p style="text-align:center">Using machine learning to predict phase of an emulsion at any composition.</p>
 +
                    </div>
  
−
        </div>
+
                </div></a>
 +
           
 +
</div>
  
−
        <div class="col">
+
</div>
−
            <a href="">
+
−
            <div class="container__sources" style="
+
−
    box-shadow: none;
+
−
">
+
  
−
                <img src="img/yoilLogo.png" height="100%" width="100%" style="margin-top: 8vh;  margin-left: auto;
 
−
  margin-right: auto;
 
−
  display: block;">
 
−
            </div>
 
−
            </a>
 
−
        </div>
 
  
−
        <div class="col">
 
−
            <hr style="width: 100%;
 
−
    margin-top: 80%;">
 
  
−
        </div>
 
−
        <div class="col">
 
−
            <a href="">
 
−
            <div class="container__sources">
 
−
                <img src="img/pheophorbide.svg" height=50% width=50%>
 
−
                <div class="sources--cms">
 
−
                    <h3>Chlorophyll Repurposing</h3>
 
−
                    <p>Primary haversting of canola by farmers.</p>
 
−
                </div>
 
  
−
            </div></a>
 
−
        </div>
 
−
    </div>
 
  
−
    <div class="row">
 
−
        <div class="col">
 
−
            <svg style="width: 200px; height: 120px;">
 
−
                <line x1="0" y1="200" x2="200" y2="0" style="stroke:rgb(255,0,0);stroke-width:2"></line>
 
−
            </svg>
 
−
        </div>
 
−
        <div class="col"><svg style="width: 200px; height: 120px;">
 
−
            <line x1="100" y1="0" x2="100" y2="200" style="stroke:rgb(255,0,0);stroke-width:2"></line>
 
−
        </svg></div>
 
−
        <div class="col">
 
−
            <svg style="width: 200px; height: 120px;">
 
−
                <line x1="0" y1="0" x2="200" y2="200" style="stroke:rgb(255,0,0);stroke-width:2"></line>
 
−
            </svg>
 
−
        </div>
 
  
−
    </div>
+
<div class="row" style="margin-bottom:5vh">
  
 +
<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">
 +
                    <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">
 +
                        <h3 style="text-align:center">Directed Protein Structure Modification - <i>ModGIX</i></h3>
 +
                        <p style="text-align:center">Using in silico dynamic simulations to perform informed modifications of amino acids in proteins. </p>
 +
                    </div>
  
−
    <!-- Row 2 -->
+
                 </div></a>
−
    <div class="row">
+
           
−
        <div class="col">
+
</div>
−
            <a href="">
+
−
            <div class="container__sources">
+
−
                 <img src="img/6gix.PNG" width="50%" height="50%">
+
−
                <div class="sources--cms">
+
−
                    <h3>6GIX and MODGIX Model</h3>
+
−
                    <p>Using in silico measurements</p>
+
−
                </div>
+
  
−
            </div>
 
−
            </a>
 
−
        </div>
 
  
−
        <div class="col">
 
−
            <hr style="width: 100%;
 
−
    margin-top: 80%; opacity: 0">
 
  
−
        </div>
+
<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">
 +
                    <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">
 +
                        <h3 style="text-align:center">In Silico Emulsion System Verification - <i>6GIX</i></h3>
 +
                        <p style="text-align:center">Verifying emulsified protein function and structure stability in antagonistic solvents. </p>
 +
                    </div>
  
−
        <div class="col">
+
                 </div></a>
−
            <a href="">
+
              
−
            <div class="container__sources">
+
−
                 <svg viewBox="0 0 100 100">
+
−
                    <circle cx="50" cy="50" r="50"></circle>
+
−
                </svg>
+
−
                <div class="sources--cms">
+
−
                    <h3>Economic Model</h3>
+
−
                    <p>Primary haversting of canola by farmers.</p>
+
−
                </div>
+
−
 
+
−
            </div>
+
−
            </a>
+
−
        </div>
+
−
 
+
−
        <div class="col">
+
−
             <hr style="width: 100%;
+
−
    margin-top: 80%; opacity: 0">
+
−
 
+
−
        </div>
+
−
        <div class="col">
+
−
            <div class="container__sources">
+
−
                <svg viewBox="0 0 100 100">
+
−
                    <circle cx="50" cy="50" r="50"></circle>
+
−
                </svg>
+
−
                <div class="sources--cms">
+
−
                    <h3>HIS tag Optimization</h3>
+
−
                    <p>I don't know a subtitle for this</p>
+
−
                </div>
+
−
 
+
−
            </div>
+
−
        </div>
+
−
    </div>
+
 
</div>
 
</div>
  
−
<div class="mobile-container">
 
−
    <div class="container__sources" style="
 
−
    box-shadow: none;
 
−
">
 
−
 
−
        <img src="img/yoilLogo.png" height="50%" width="50%" style="margin-top: 8vh; text-align: center;">
 
−
 
−
    </div>
 
−
    <div class="list-group">
 
−
        <a href="#" class="list-group-item list-group-item-action">
 
−
            Cras justo odio
 
−
        </a>
 
−
        <a href="#" class="list-group-item list-group-item-action">Dapibus ac facilisis in</a>
 
−
        <a href="#" class="list-group-item list-group-item-action">Morbi leo risus</a>
 
−
        <a href="#" class="list-group-item list-group-item-action">Porta ac consectetur ac</a>
 
−
        <a href="#" class="list-group-item list-group-item-action">Vestibulum at eros</a>
 
−
    </div>
 
  
 
</div>
 
</div>
  
−
+
            </div> </div> 
 
</body>
 
</body>
 
</html>
 
</html>
 +
{{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.

ICARUS - Pheophorbide Production

iGEM Calgary Augmented Repulsion Universal Spacer:
A spacer to his-purify proteins.

Emulsion Construction Prediction - Emulsified Proteins

Using machine learning to predict phase of an emulsion at any composition.

Directed Protein Structure Modification - ModGIX

Using in silico dynamic simulations to perform informed modifications of amino acids in proteins.

In Silico Emulsion System Verification - 6GIX

Verifying emulsified protein function and structure stability in antagonistic solvents.

Project
Human Centered Design
Modelling
Parts
Journal
Team