|
|
Line 26: |
Line 26: |
| <style> | | <style> |
| .texttitle{ | | .texttitle{ |
− | color: #11abb0; | + | color:#6495ED; |
− | font-size: 38px; | + | font-size: 20px; |
| line-height: 48px; | | line-height: 48px; |
| margin-bottom: 12px; | | margin-bottom: 12px; |
Line 35: |
Line 35: |
| text-transform: uppercase; | | text-transform: uppercase; |
| font-weight: 350; | | font-weight: 350; |
− | text-align: center;
| + | text-align:center; |
− | padding-top:40px;
| + | |
| + | padding-top:40px; |
| } | | } |
| sup{font-size:11px;} | | sup{font-size:11px;} |
Line 197: |
Line 198: |
| font-style:italic; | | font-style:italic; |
| float:left; | | float:left; |
− | color:#11abb0; | + | color:#1E90FF; |
| opacity:0.8; | | opacity:0.8; |
| } | | } |
Line 238: |
Line 239: |
| <li><a href="https://2018.igem.org/Team:Peking/Design" class="barfont1">Design</a></li> | | <li><a href="https://2018.igem.org/Team:Peking/Design" class="barfont1">Design</a></li> |
| <li><a href="https://2018.igem.org/Team:Peking/Demonstrate" class="barfont1">Demonstration</a></li> | | <li><a href="https://2018.igem.org/Team:Peking/Demonstrate" class="barfont1">Demonstration</a></li> |
− | <li><a href="https://2018.igem.org/Team:Peking/Prospective" class="barfont1">Prospective</a></li> | + | <li><a href="https://2018.igem.org/Team:Peking/Perspective" class="barfont1">Perspective</a></li> |
| </ul> | | </ul> |
| </li> | | </li> |
| <li class="dropdown menu-3"><a class="dropdown-toggle" data-toggle="dropdown" href="#" >Modeling</a> | | <li class="dropdown menu-3"><a class="dropdown-toggle" data-toggle="dropdown" href="#" >Modeling</a> |
| <ul class="dropdown-menu"> | | <ul class="dropdown-menu"> |
− | <li><a href="https://2018.igem.org/Team:Peking/Model">Overview</a></li> | + | <li><a href="https://2018.igem.org/Team:Peking/Modeling_overview">Overview</a></li> |
| <li><a href="https://2018.igem.org/Team:Peking/SPOT_Formation" class="barfont1">SPOT Formation</a></li> | | <li><a href="https://2018.igem.org/Team:Peking/SPOT_Formation" class="barfont1">SPOT Formation</a></li> |
| <li><a href="https://2018.igem.org/Team:Peking/Application" class="barfont1">Application</a></li> | | <li><a href="https://2018.igem.org/Team:Peking/Application" class="barfont1">Application</a></li> |
Line 276: |
Line 277: |
| <li><a href="https://2018.igem.org/Team:Peking/Collaborations" class="barfont1">Collaborations</a></li> | | <li><a href="https://2018.igem.org/Team:Peking/Collaborations" class="barfont1">Collaborations</a></li> |
| <li><a href="https://2018.igem.org/Team:Peking/Safety" class="barfont1">Safety</a></li> | | <li><a href="https://2018.igem.org/Team:Peking/Safety" class="barfont1">Safety</a></li> |
− | <li><a href="https://2018.igem.org/Team:Peking/Acknowledgement" class="barfont1">Acknowledgement</a></li></ul>
| + | </ul> |
| </li> | | </li> |
| </div> | | </div> |
Line 289: |
Line 290: |
| <div class="row"> | | <div class="row"> |
| <div class="twelve columns centered text-center"> | | <div class="twelve columns centered text-center"> |
− | <h1>Software</h1> | + | <h1>Simulation for phase separation</h1> |
− | <p class="title1" style="text-align:center">In this section, you could see the Software.</p> | + | <p class="title1" style="text-justify:inter-ideograph;">Considering our project is mainly predicated on liquid-liquid phase separation, we simulated phase separation of a ternary mixture in silico for deeper understanding and approximate predictions of our experiments. To better demonstrate, we start with a binary mixture to see why and when will two components separate.</p> |
| </div> | | </div> |
| </div> | | </div> |
Line 303: |
Line 304: |
| | | |
| | | |
| + | <div class="row"> |
| | | |
− | <div class="three columns"> | + | |
| + | |
| + | <div class="three columns"> |
| <div id="page-wrap"> | | <div id="page-wrap"> |
| <div id="sidebar" style="color:#000000"> | | <div id="sidebar" style="color:#000000"> |
− | <h4><a href="https://2018.igem.org/wiki/index.php?title=Team:Peking/Demonstrate#A">Overview</a></h4> | + | <h4><a href="https://2018.igem.org/Team:Peking/Modeling">Overview</a></h4> |
− | <h4><a href="javascript:void(0);" onclick="naver('B')">Phase Separation</a></h4> | + | <h4><a href="https://2018.igem.org/Team:Peking/SPOT_Formation">SPOT Formation</a></h4> |
− | <ul>
| + | <h4><a href="https://2018.igem.org/Team:Peking/Application">Application</a></h4> |
− | <li><a href="javascript:void(0);" onclick="naver('B1')">Spontaneous</a></li>
| + | |
− | <li><a href="javascript:void(0);" onclick="naver('B2')">The formation</a></li>
| + | |
− | </ul>
| + | |
− | <h4><a href="javascript:void(0);" onclick="naver('C')">Functional Organelles</a></h4> | + | |
− | <h4><a href="javascript:void(0);" onclick="naver('D')">Perspective</a></h4>
| + | |
| </div> | | </div> |
| </div> | | </div> |
Line 324: |
Line 326: |
| <div class="nine columns"> | | <div class="nine columns"> |
| | | |
− | <div class="texttitle">Overview | + | <div class="texttitle"> Simulation for phase separation |
| <a id="A"></a></div> | | <a id="A"></a></div> |
| <hr style="border:2px dashed; height:2px" color="#666666"> | | <hr style="border:2px dashed; height:2px" color="#666666"> |
Line 331: |
Line 333: |
| | | |
| <div class="content"> | | <div class="content"> |
− | <p>We produce abundant fluorescent images in our experiments. However, there are many troubles when taking into the processing those data. The data can be extremely large. Even if you just take a 1 hour imaging for 25 positions in 3 channel for every minutes, the microscope will yield 4500 high resolution images. To help with the image processing in such a high throughput, we developed a software aim at microscope images batching.</p> | + | <p>Generally, when intermolecular interaction is neglected (i.e. all molecules can be treated independently), two components tend to mix with each other where entropy reaches its maximum. Homogeneous mixed state remains stable in this case, for instance, water and alcohol mix at random ratio. |
− | </div>
| + | </p> |
− | </div>
| + | <img src= "https://static.igem.org/mediawiki/2018/f/f0/T--Peking--Modeling_SPOT_Formation_1.png"> |
− | <div class="coll"> | + | <div class="coll"> |
| | | |
− | <div class="content"> | + | |
− | <p>This software is wrote just for the problems we meet.</p>
| + | <p>Fig1.A: mixed binary mixture, rounds with different colors denote different molecules. Fig1.B: demixed binary mixture, one component forms a dense liquid droplet |
| + | <br/><br/> |
| + | Things might get a little different when interaction among molecules are considered. Under the conditions of constant temperature, volume and particle numbers, the system is at equilibrium when the Helmholtz free energy F is the lowest. Based on regular solution model, the free energy density f takes the following form in the unit of <I>k<sub>B</sub>T</I>[1]: |
| + | <br/><br/> |
| + | <I>f</I> =<I>ϕ</I> ln<I>ϕ</I> +(1-<I>ϕ</I> )ln(1-<I>ϕ</I> )++<I>χ</I><I>ϕ</I> (1-<I>ϕ</I> )+<I>λ</I>/2 |<I>∇ϕ</I>|<sup>2</sup>, (1) |
| + | <br/><br/> |
| + | where <I>ϕ</I> is the volume fraction of one component (let us say component A), <I>χ</I> is a parameter characterizing the strength of intermolecular interactions and <I>λ</I> is related to the surface tension between interfaces. The volume fraction of A is defined as the volume of A molecules divided by the total volume of the system. In a binary system, the volume fraction of the other component, let us say component B, becomes naturally 1-<I>ϕ</I>. |
| + | <br/> |
| + | First let’s focus on the symmetric part of <I>f</I> , i.e <I>f<sub>0</sub></I> =<I>ϕ</I> ln<I>ϕ</I>+(1-<I>ϕ</I>)ln(1-<I>ϕ</I>)+<I>χ</I> <I>ϕ</I>(1-<I>ϕ</I>), and see how its shape changes as we vary <I>χ</I>. When A and B attract, <I>χ</I> is less than 0; on the contrary, when A and B repulse, <I>χ</I> is greater than 0. Easily seen from fig2, when <I>χ</I><2, <I>f<sub>0</sub></I> only has one minimum; when <I>χ</I>>2, <I>f<sub>0</sub></I> has two minima and one maximum. A bifurcation takes place when <I>χ</I>=2 and essentially alters the feature of free energy density. |
| + | |
| + | |
| + | <img src="https://static.igem.org/mediawiki/2018/c/c2/T--Peking--Modeling_SPOT_Formation_2.png"> |
| + | Fig2: plot of symmetric part of free energy density under various χ |
| + | <br/><br/> |
| + | For better illustration, we scrutinize two typical cases, <I>χ</I>=0 and <I>χ</I>=4. Fig3 shows the free energy density for mixed state in blue solid line and demixed state in green dotted line. Obviously seen from fig3, when <I>χ</I>=0, for any initial concentration represented by <I>ϕ</I><sub>0</sub>, it always requires extra free energy for the system to demix into any two separate states <I>ϕ</I><sub>1</sub> and <I>ϕ</I><sub>2</sub>, where the green dotted line is higher than any point on the blue solid line between <I>ϕ</I><sub>1</sub> and <I>ϕ</I><sub>2</sub>; when <I>χ</I>=4, there exists a range of <I>ϕ</I><sub>0</sub> to separate into two demixed compositions <I>ϕ</I><sub>1</sub> and <I>ϕ</I><sub>2</sub>, where the green dotted line is lower than any point on the blue solid line between <I>ϕ</I><sub>1</sub> and <I>ϕ</I><sub>2</sub>. This is the situation where phase separation could happen spontaneously. |
| + | |
| + | <img src="https://static.igem.org/mediawiki/2018/c/c3/T--Peking--Modeling_SPOT_Formation_3.png"> |
| + | <br/> |
| + | Fig3: The blue solid line and the green dotted line represent the free energy density for mixed state and demixed state respectively. (A)χ=0. The green dotted line is always higher than the blue solid line, indicating an extra energy for separation; (B)χ=4. The green dotted line is below the blue solid line, making spontaneous phase separation possible. |
| + | <br/><br/> |
| + | To be more precious, we can specify the conditions where separation could happen. According to fundamental work on liquid-liquid phase separation, when <I>d</I><sup>2</sup><I>f</I>/<I>d</I><I>ϕ</I><sup>2</sup><0, any local perturbation will result in spontaneous separation, such a formation is named spinodal decomposition; when <I>d</I><sup>2</sup><I>f</I>/<I>d</I><I>ϕ</I><sup>2</sup>>0 and between the two minima, only sufficiently large global perturbation can make phase separation happen, such an approach is called nucleation; and their boundary is named spinodal line. Now, if the free energy density function is symmetric, when <I>ϕ</I> lies outside the two minima, phase separation cannot happen. The boundary between whether phase separation can take place or not is called binodal line. |
| + | <br/><br/> |
| + | Based on the criteria above, we plot the phase diagram of a binary mixture. In fig4, we represent the initial concentration by <I>ϕ</I> in the x-axis and vary χ in the y-axis. The region confined by spinodal line is the unstable region, for separation can take place under any local perturbation. In contrast, the region between the binodal line and the spinodal line is the metastable region, where only sufficiently large global perturbation can initiate separation. |
| + | <img src="https://static.igem.org/mediawiki/2018/4/4e/T--Peking--Modeling_SPOT_Formation_4.png"> |
| + | <br/> |
| + | Fig4: Binary phase diagram. Binodal line shows the boundary between whether phase can separate or not. Spinidal line shows the boundary between two different formations: spinodal decomposition and nucleation. The area confined by spinodal line is the unstable region while the area between bimodal line and spinodal line is the metastable region. |
| + | <br/><br/> |
| + | As aforementioned, our system is a ternary mixture system consisting of two multivalent proteins and water, which is a bit more complicated. To capture the basic feature of three-component phase separation, we use a similar theoretical model for simulation. The free energy density f is now written in the unit of k_B T as: |
| + | <br/><br/> |
| + | f=<I>ϕ</I><sub>1</sub> ln<I>ϕ</I><sub>1</sub> +<I>ϕ</I><sub>2</sub> ln<I>ϕ</I><sub>2</sub> +<I>ϕ</I><sub>3</sub> ln<I>ϕ</I><sub>3</sub> +χ_(1-2) <I>ϕ</I><sub>1</sub> <I>ϕ</I><sub>2</sub>+χ_(1-3) <I>ϕ</I><sub>1</sub> <I>ϕ</I><sub>3</sub> +χ_(2-3) <I>ϕ</I><sub>2</sub> <I>ϕ</I><sub>3</sub> +λ_1/2 |∇<I>ϕ</I><sub>1</sub> |^2+λ_2/2 |∇<I>ϕ</I><sub>2</sub> |^2+λ_3/2 |∇<I>ϕ</I><sub>3</sub> |^2 |
| + | where <I>ϕ</I><sub>1</sub> denotes the first multivalent protein (FKBP for example), ϕ_2 denotes the second multivalent protein (Frb for example) and <I>ϕ</I><sub>3</sub> denotes water. An intrinsic relation of the three is given by: |
| + | ϕ_1+ϕ_2+<I>ϕ</I><sub>3</sub> =1 |
| + | Phenomenologically speaking, <I>ϕ</I><sub>1</sub> and ϕ_2 condensate together and separate from <I>ϕ</I><sub>3</sub> . For computational convenience, χ_(1-2) and χ_(1-3) are taken value above 2 and χ_(2-3) below 2. A ternary phase diagram is calculated in a similar way by determining whether<I>ϕ</I><sub>1</sub> and <I>ϕ</I><sub>3</sub> separate and whether ϕ_2 and <I>ϕ</I><sub>3</sub> separate. The results are shown in fig5. |
| + | <img src="https://static.igem.org/mediawiki/2018/1/1e/T--Peking--Modeling_SPOT_Formation_5.png"> |
| + | <img src="https://static.igem.org/mediawiki/2018/9/9e/T--Peking--Modeling_SPOT_Formation_6.png"> |
| + | <br/> |
| + | Fig5: Ternary phase diagrams. (A)χ_(1-2)=0; χ_(1-3)=8; χ_(2-3)=3; (B) χ_(1-2)=0; χ_(1-3)=8; χ_(2-3)=4. |
| + | <br/><br/> |
| + | The phase diagram only provides a rough approximation on where phase separation can happen, it is insufficient to predict what happens after the separation. Hence, we further recur to the continuum model first proposed by Cahn and Hilliard to simulate a dynamic process. |
| + | <br/> |
| + | ∂c/∂t=∇⋅(M∇μ) |
| + | μ=df/dc-λ∇^2 c |
| + | <br/><br/> |
| + | We use finite element method in a 100×100 mesh and select Neumann boundary condition to solve the partial differential equations above. Crank-Nicolson method is used for time-stepping with a footstep of 2.0×〖10〗^(-3). The initial composition is given by adding a perturbation of strength 〖10〗^(-2) to a homogenous sate. A typical result is given as followed: |
| + | <img src="https://static.igem.org/mediawiki/2018/6/62/T--Peking--Modeling_SPOT_Formation_7.png"> |
| + | <br/> |
| + | Fig6: Simulation for dynamic evolution of phase separation under χ_(1-2)=0, χ_(1-3)=3, χ_(2-3)=4. (A) The concentration distribution of ϕ_1; (B) The centration of ϕ_1 on the sampled red dotted line in (A). |
| + | <br/><br/> |
| + | We further adjust the interaction strength between two proteins, thus affecting both χ_(1-3) and χ_(2-3). As χ increases, indicating a stronger interaction, the time for phase separation to occur is decreased, which is in accordance with our experimental results. |
| + | <img src="https://static.igem.org/mediawiki/2018/d/d5/T--Peking--Modeling_SPOT_Formation_8.png"> |
| + | <br/> |
| + | Fig7: Simulation for phase separation under different interaction strengths. The stronger the interaction, the faster separation emerges. |
| + | <br/><br/> |
| + | |
| + | |
| + | |
| + | </p> |
| + | |
| </div> | | </div> |
− | </div> | + | |
| + | |
| | | |
− | <div class="coll">
| |
− |
| |
− | <div class="content">
| |
− | <p>The first problem we meet is the file name of the exported images are always in massy rules. What’s the most confusing, the rules of number of the positions, channels and time are various in files. Considering the diversity of file names of images derived from different microscopes, we manage to build a naming rule manager, which can create and modify the name rule. The rules can be made are flexible, which can contain up to 4 variables and 4 customized string. Every variables have a customized zero filling function that can solve the problem like the annoying number 01 to 99. The users can also shear their rules in the form of a file, which may benefit group working. Read the user manuals for more detail.</p>
| |
| </div> | | </div> |
| </div> | | </div> |
− | <div class="coll"> | + | <div class="coll"> |
| | | |
− | <div class="content">
| + | |
− | <p>After solving the problem of getting files, we can now stick to the practices functions practical.</p>
| + | |
− | </div>
| + | |
| </div> | | </div> |
| + | |
| <div class="coll"> | | <div class="coll"> |
| | | |
| <div class="content"> | | <div class="content"> |
− | <p>We have built spontaneous and induced synthetic organelles by specific interaction modules, so that we can control the formation process by different ways for demands in biological engineering. Then we characterized the kinetics and properties of synthetic organelles theoretically and experimentally. These results confirm the potential of synthetic organelles in synthetic biology.</p>
| + | |
| </div> | | </div> |
| </div> | | </div> |
| <div class="coll"> | | <div class="coll"> |
| | | |
− | <div class="content">
| + | |
− | <p>The most important difference between fluorescent images of microscope and Ordinary photo is the function of channel. We need to contrast different fluorescent channel to discover the conclusion. However, export a large number of large images could be a time-wasting process. If we can merge channel or convert the images into grayscale after cropping, we will save much time. Thus we add the functions of merging and grayscale to our software first. Read the user manuals for more detail.(此处放处理前后的图)</p>
| + | |
− | </div>
| + | |
| </div> | | </div> |
− | <div class="coll"> | + | <div class="texttitle">References |
− |
| + | <a id="A"></a></div> |
− | <div class="content">
| + | <hr style="border:2px dashed; height:2px" color="#666666"> |
− | <p>For the living organism, if we want to show the dynamic process with video, we will need to fuse the images by order to make video. We wrote the functions to export video by time or by z axis. Read the user manuals for more detail.(此处放导出的视频gif)</p>
| + | |
| + | <div class="coll"> |
| + | <div class="info"> |
| + | <a id="B1"></a> |
| + | |
| </div> | | </div> |
− | </div>
| |
− | <div class="coll">
| |
− |
| |
| <div class="content"> | | <div class="content"> |
− | <p>In science research, cropping are widely used to beautify the images and emphasize the target. To meet the need of flexible cropping, we provide two cropping method. Drawing cropping can draw the range to be cropped while position cropping crop straightly by the given position. Read the user manuals for more detail. (此处放软件使用截图)</p> | + | <p>[1] Joel Berry el.al (2018). Physical principles of intracellular organization via active and passive phase transitions |
− | </div>
| + | |
− | </div>
| + | </p> |
− | <div class="coll">
| + | |
− |
| + | |
− | <div class="content">
| + | |
− | <p>What’s more, sometime the cells float in the process of photographing, which result in the cell drift or even rotate in the video. We will have to make a larger cropping to ensure the cell will not go out of the edge. To solve this problem, We wrote a function that can move the cropping frame with the cell linearly, which can fix the drift of cell to some extent. Also, we can rotate the image by the setting before cropping, by which we may also fix the rotation of the cells. Read the user manuals for more detail. (漂移校正前后对比动图,旋转漂移校正前后对比动图)</p>
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | <div class="coll">
| + | |
− |
| + | |
− | <div class="content">
| + | |
− | <p>Eventually, the microscopy images in science need some information on it before showing up in public. The time scale of every frame and the scale of the cell are the most common features. We can add the time scale information to the image by the given position, start time, interval and unit. And the scale plate, which indicate the scale of the cells, can be added by the given position, total length, length/pixel and unit. Read the user manuals for more detail. (加标尺和时间的动图)</p>
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | <div class="coll">
| + | |
− |
| + | |
− | <div class="content">
| + | |
− | <p>Almost all of the microscopy image shown in our wiki and ppt are processing with this software. It help us a lot and we wish to share it with anyone who need it. If you want more detail, read the user manuals and the software are available here. (Github链接) And if you want a update version after the project freeze after iGEM, check here (另一个Github链接), we will release all the update here.</p>
| + | |
| </div> | | </div> |
| </div> | | </div> |
| + | |
| + | |
| + | |
| + | |
| </div><!--9 columns end--> | | </div><!--9 columns end--> |
| | | |