Newer
Older
import { ButtonOneEngineering } from "../components/Buttons";
import { H3, H4 } from "../components/Headings";
import { useTabNavigation } from "../utils/TabNavigation";
Liliana Sanfilippo
committed
<br/> <br/> <br/>
<div id="tab-our-cycle" className="enginneeringtab" style={{display: "block"}}>
Liliana Sanfilippo
committed
<section > <br id="obenengineering"/>
Liliana Sanfilippo
committed
<div className="bg-lb box" >
Liliana Sanfilippo
committed
<H3 text="Our cycle" id="ourcycle"></H3>
Liliana Sanfilippo
committed
<p>Hallo Prime Editing diesdas</p>
</div>
<br/>
<div className="row">
<div className="col">
</div>
<div className="col button-left">
<div className="right"><ButtonOneEngineering label="Next" open="proof-of-concept" scrollToId="Proof of Concept"/></div>
</div>
</div>
</section>
</div>
<div id="tab-proof-of-concept" className="enginneeringtab" style={{display: "none"}}>
<section >
<div className="bg-lb box" >
<H3 id="Proof of Concept" text="Proof of Concept"></H3>
<p>To test prime editors, a reliable model system is required. HEK293 cells are a human derived cell line and widely used in a variety of fields in biology[1]. Apart from easy handling and comparatively easy transfection, they have, as we found out in our exchange with Mattijs Bulcaen, one advantage over other models: They are naturally impaired in DNA repair mechanisms and therefore easier to edit. To properly compare editing efficiencies, a high transfection efficiency is of utmost importance. This engineering cycle focuses on our work in simulating prime editing using the PEAR reporter system[2] and optimizing transfection protocols.</p>
<H3 text="Test of Lipofectamine 2000" id="text"/>
<H4 text="Test" id="text"/>
<p>While conducting research on transfection methods for HEK cells, particular attention was devoted to the delivery of the Prime Editing complex into the cells. In the literature, Lipofectamine is described as a common transfection agent. <i>Anzalone et al. 2019</i>[3] describe a transfection of prime-editing complexes with Lipofectamine 2000. The aim of this study is to introduce our prime-editing complex into HEK cells.</p>
<p>Transfection with Lipofectamine 2000 was performed in accordance with the Anzalone protocol. However, the result was characterized by insufficient transfection efficiency.</p>
<H4 text="Learn" id="text"/>
<p>The low efficiency of Lipofectamine 2000 indicated that the product is not optimally suited to the specific conditions under consideration. In contrast, Lipofectamine 3000 is described in the literature as potentially more efficient.</p>
<H4 text="Design" id="text"/>
<p>In light of the aforementioned findings, the decision was taken to test Lipofectamine 3000, given its reputation for greater efficiency. A new test design was devised, utilizing Lipofectamine 3000 with an equivalent quantity of DNA and modified transfection conditions.</p>
<H4 text="Build" id="text"/>
<p>In accordance with the established protocol, the recommended ratio of 1 µg DNA to 2 µl Lipofectamine 3000, as provided by ThermoFisher, is to be employed.</p>
</p>
</div>
<div className="box" >
<p id="cyc2">
<H3 text="Initial Test with Lipofectamine 3000" id="text"/>
<H4 text="Test" id="text"/>
<p>Considering the favorable assessment of Lipofectamine 3000 in the scientific literature, the proof of concept was conducted once more.</p>
<p>The objective of the experiment was to enhance the transfection efficiency of Lipofectamine 3000. The transfection protocol was conducted in accordance with the manufacturer's instructions (1 µg DNA, 2 µl Lipofectamine 3000 reagent).</p>
<p>The outcome revealed that despite the modification, the transfection efficiency remained inadequate, although a marginal improvement was discernible.</p>
<H4 text="Learn" id="text"/>
<p>Although a switch to Lipofectamine 3000 resulted in a marginal improvement, the efficiency fell short of expectations. This indicates that further optimization is required in terms of the amount of Lipofectamine and DNA, as well as the medium used.</p>
<H4 text="Design" id="text"/>
<p>In order to optimize the transfection process, a new optimization test was designed, which incorporates a variable design with regard to the quantity of Lipofectamine 3000 and DNA.</p>
<H4 text="Build" id="text"/>
<p>The protocol entails the utilization of varying concentrations of Lipofectamine 3000, specifically 1 µl and 1.5 µl, with a DNA quantity of 1 µg or 0.5 µg.</p>
</p>
</div>
<div className="box" >
<p id="cyc3">
<H3 text="Optimization of DNA and Lipofectamine Volumes" id="text"/>
<H4 text="Test" id="text"/>
<p>To enhance transfection efficiency, optimization tests were conducted, in which the quantities of Lipofectamine and DNA were varied. The objective of this iteration was to find the optimal ratio of Lipofectamine 3000 to DNA. To this end, 1 µl and 1.5 µl of Lipofectamine 3000 at a DNA concentration of either 1 µg or 0.5 µg were compared with each other.</p>
<H4 text="Learn" id="text"/>
<p>The experiment demonstrated that a quantity of 1 µl Lipofectamine 3000 is sufficient for successful transfection, and that increasing the quantity does not result in a notable difference. Additionally, the findings indicated that an amount of 1 µg DNA exhibited a higher efficiency than an amount of 0.5 µg DNA. It can be reasoned that additional factors may have contributed to the previously observed decline in transfection efficiency. One potential explanation is that the cells may have been in an excessively high passage level.</p>
<p>It can be reasonably deduced that the aforementioned factors may have contributed to the observed decline in transfection efficiency.</p>
<H4 text="Design" id="text"/>
<p>The results obtained were used to develop an optimized protocol that takes into account both the concentration of Lipofectamine and the amount of DNA.</p>
<H4 text="Build" id="text"/>
<p>In the following experiments, a DNA quantity of 1 µg and a defined quantity of 1 µl Lipofectamine 3000 was used.</p>
</p>
</div>
<div className="box" >
<p id="cyc4">
<H3 text="Validation of optimized Protocol" id="text"/>
<H4 text="Test" id="text"/>
<p>Following the series of optimizations, the proof of concept was conducted once more to confirm the efficacy of the optimized protocol. This protocol involved the utilization of 1 µl Lipofectamine 3000, 1 µg DNA, 2 µl Reagent 3000 and Opti-MEM as a medium. The outcomes were encouraging, as the transfection efficiency was markedly enhanced.</p>
<H4 text="Learn" id="text"/>
<p>The utilization of an optimized quantity of 1 µl Lipofectamine 3000, a defined quantity of DNA and the suitable Opti-MEM medium resulted in a notable enhancement in transfection efficiency. This substantiates the assertion that the aforementioned conditions constitute an optimal foundation for the transfection of HEK cells with the prime editing complex.</p>
<H4 text="Design" id="text"/>
<p>This protocol establishes the standard procedure for the transfection of HEK cells with the Prime Editing Complex. The transfection reagent Lipofectamine 3000 is diluted in Opti-MEM to a final volume of 1 µl, and the DNA to be transfected is diluted to a final concentration of 1 µl.</p>
<br/>
<div className="row ">
<div className="col">
<div className="left"><ButtonOneEngineering label="Previous" open="our-cycle" scrollToId="ourcycle"/></div>
</div>
<div className="col button-left">
<div className="right"><ButtonOneEngineering label="Next" open="pe-systems" scrollToId="PE Systems"/></div>
</div>
<div className="enginneeringtab" id="tab-pe-systems" style={{display: "none"}}>
Liliana Sanfilippo
committed
<section id="PE Systems sec" >
<div className="bg-lb box" >
<H3 id="PE Systems" text="PE Systems"></H3>
<H3 text="" id="text"/>
<H4 text="Test" id="text"/>
<p></p>
<H4 text="Learn" id="text"/>
<p></p>
<H4 text="Design" id="text"/>
<p></p>
<H4 text="Build" id="text"/>
<p></p>
</p>
</div>
<div className="box" >
<p id="pe2">
<H3 text="" id="text"/>
<H4 text="Test" id="text"/>
<p></p>
<H4 text="Learn" id="text"/>
<p></p>
<H4 text="Design" id="text"/>
<p></p>
<H4 text="Build" id="text"/>
<p></p>
</p>
</div>
<div className="box" >
<p id="pe3">
<H3 text="" id="text"/>
<H4 text="Test" id="text"/>
<p></p>
<H4 text="Learn" id="text"/>
<p></p>
<H4 text="Design" id="text"/>
<p></p>
<H4 text="Build" id="text"/>
<p></p>
<br/>
<div className="row ">
<div className="col">
<div className="left"><ButtonOneEngineering label="Previous" open="proof-of-concept" scrollToId="Proof of Concept"/></div>
</div>
<div className="col button-left">
<div className="right"><ButtonOneEngineering label="Next" open="nikase" scrollToId="Nikase"/></div>
</div>
<div className="enginneeringtab" id="tab-nikase" style={{display: "none"}}>
Liliana Sanfilippo
committed
<section id="Nikase sec" >
<div className="bg-lb box" >
<H3 id="Nikase" text="Nikase"></H3>
<img src="https://static.igem.wiki/teams/5247/fanzor/movie4-ezgif-com-video-to-gif-converter.gif"></img>
<img src="https://static.igem.wiki/teams/5247/fanzor/movie5-ezgif-com-video-to-gif-converter-2.gif"></img>
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
</div>
<div className="box" >
<p id="nik1">
<h3>nik1</h3>
<LoremShort></LoremShort>
<p><LoremShort></LoremShort></p>
<p><LoremShort></LoremShort></p>
</p>
</div>
<div className="box" >
<p id="nik2">
<h3>nik2</h3>
<LoremShort></LoremShort>
<p><LoremShort></LoremShort></p>
<p><LoremShort></LoremShort></p>
</p>
</div>
<div className="box" >
<p id="nik3">
<h3>nik3</h3>
<LoremShort></LoremShort>
<p><LoremShort></LoremShort></p>
<p><LoremShort></LoremShort></p>
</p>
</div>
<div className="box" >
<p id="nik4">
<h3>nik4</h3>
<LoremShort></LoremShort>
<p><LoremShort></LoremShort></p>
<p><LoremShort></LoremShort></p>
</p>
</div>
<div className="box" >
<p id="nik5">
<h3>nik5</h3>
<LoremShort></LoremShort>
<p><LoremShort></LoremShort></p>
<p><LoremShort></LoremShort></p>
</p>
</div>
<div className="box" >
<p id="nik6">
<h3>nik6</h3>
<LoremShort></LoremShort>
<p><LoremShort></LoremShort></p>
<p><LoremShort></LoremShort></p>
</p>
<br/>
<div className="row ">
<div className="col">
<div className="left"><ButtonOneEngineering label="Previous" open="pe-systems" scrollToId="PE Systems"/></div>
</div>
<div className="col button-left">
<div className="right"><ButtonOneEngineering label="Next" open="pegrna" scrollToId="pegRNA"/></div>
</section>
</div>
<div className="enginneeringtab" id="tab-pegrna" style={{display: "none"}}>
Liliana Sanfilippo
committed
<section id="pegRNA sec" >
<div className="bg-lb box" >
<H3 id="pegRNA" text="pegRNA"></H3>
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
<div className="box" >
<p id="peg1">
<h3>peg1</h3>
<LoremShort></LoremShort>
</p>
<p><LoremShort></LoremShort></p>
<p><LoremShort></LoremShort></p>
</div>
<div className="box" >
<p id="peg2">
<h3>peg2</h3>
<LoremShort></LoremShort>
</p>
<p><LoremShort></LoremShort></p>
<p><LoremShort></LoremShort></p>
</div>
<div className="box" >
<p id="peg3">
<h3>peg3</h3>
<LoremShort></LoremShort>
</p>
<p><LoremShort></LoremShort></p>
<p><LoremShort></LoremShort></p>
</div>
<div className="box" >
<p id="peg4">
<h3>peg4</h3>
<LoremShort></LoremShort>
</p>
<p><LoremShort></LoremShort></p>
<p><LoremShort></LoremShort></p>
</div>
<div className="box" >
<p id="peg5">
<h3>peg5</h3>
<LoremShort></LoremShort>
</p>
<p><LoremShort></LoremShort></p>
<p><LoremShort></LoremShort></p>
</div>
<div className="box" >
<p id="peg6">
<h3>peg6</h3>
<LoremShort></LoremShort>
</p>
<p><LoremShort></LoremShort></p>
<p><LoremShort></LoremShort></p>
</div>
<br/>
<div className="row ">
<div className="col">
<div className="left"><ButtonOneEngineering label="Previous" open="nikase" scrollToId="Nikase"/></div>
</div>
<div className="col button-left">
<div className="right"><ButtonOneEngineering label="Next" open="delivery" scrollToId="Delivery"/></div>
</section>
</div>
<div className="enginneeringtab" id="tab-delivery" style={{display: "none"}}>
Liliana Sanfilippo
committed
<section id="Delivery sec" >
<div className="bg-lb box" >
<H3 id="Delivery" text="Delivery"></H3>
<p><LoremShort></LoremShort></p>
</div>
<div className="box" >
<p id="del1">
<h3>del1</h3>
<LoremShort></LoremShort>
</p>
<p><LoremShort></LoremShort></p>
<p><LoremShort></LoremShort></p>
</div>
<div className="box" >
<p id="del2">
<h3>del2</h3>
<LoremShort></LoremShort>
<p><LoremShort></LoremShort></p>
<p><LoremShort></LoremShort></p>
</p>
</div>
<div className="box" >
<p id="del3">
<h3>del3</h3>
<LoremShort></LoremShort>
</p>
<p><LoremShort></LoremShort></p>
<p><LoremShort></LoremShort></p>
</div>
<br/>
<div className="row ">
<div className="col">
<div className="left"><ButtonOneEngineering label="Previous" open="pegrna" scrollToId="pegRNA"/></div>
</div>
<div className="col button-left">
<div className="right"><ButtonOneEngineering label="Next" open="references" scrollToId="References"/></div>
<div className="enginneeringtab" id="tab-references" style={{display: "none"}}>
Liliana Sanfilippo
committed
<section id="References sec" >
<div className="bg-lb box" >
<H3 id="References" text="References"></H3>
<p><LoremShort></LoremShort></p>
</div>
<br/>
<div className="row ">
<div className="col">
<div className="left"><ButtonOneEngineering label="Previous" open="delivery" scrollToId="Delivery"/></div>
</div>
<div className="col button-left">
</div>
</div>
return(
<svg className="rotate-linear-infinite"
width="100%"
height="100%"
viewBox="0 0 133 133"
id="svg25"
xmlns="http://www.w3.org/2000/svg">
<defs
id="defs1">
</defs>
<g
id="Layer_2"
data-name="Layer 2"
style={{strokeWidth:"6",strokeDasharray:"none"}}>
<g
id="Plasmid"
style={{strokeWidth:"6",strokeDasharray:"none"}}>
<g
id="g25"
transform="translate(7.500978,3.0504898)">
<a typeof="button" className="svg-button" onClick={openElement({elementToOpen: "designing", classToHide: "cycletab"})}>
<path
className="cls-7"
d="m 42.05,115.59 c 27.77,9.19 57.83,-4.79 69.76,-32.23"
id="path22"
style={{stroke:"#f4cc1e",strokeWidth:"15",strokeDasharray:"none",strokeOpacity:"1"}} />
</a>
</g>
<g
id="g26"
transform="translate(8.0019699,2.8418223)"
style={{strokeWidth:"6",strokeDasharray:"none"}}>
<polygon
className="cls-13"
points="112.07,83.36 110.94,76.27 117.65,78.84 "
id="polygon25"
style={{fill:"#850f78",fillOpacity:"1",strokeWidth:"6",strokeDasharray:"none"}}
transform="matrix(2.9806259,0,0,2.9806259,-225.43722,-156.45123)" />
<a typeof="button" className="svg-button" onClick={openElement({elementToOpen: "learning", classToHide: "cycletab"})}>
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
<path
className="cls-12"
d="M 114,78.55 C 123.45,50.86 110,20.75 82.66,8.6"
id="path25"
style={{strokeWidth:"15",strokeDasharray:"none",stroke:"#850f78",strokeOpacity:"1"}} />
<text
style={{fontSize:"17.3333px",lineHeight:"0",fontFamily:"Arial",fill:"#000000",fillOpacity:"1",stroke:"none",strokeWidth:"15",strokeLinecap:"round",strokeLinejoin:"round",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
id="text31"
transform="translate(5.6902194,-0.11551883)"><textPath
xlinkHref="#path25"
id="textPath33">Learn<tspan
id="tspan31" /></textPath></text> </a>
</g>
<g
id="g27"
style={{strokeWidth:"6",strokeDasharray:"none"}}
transform="translate(8.0019699,2.8418223)">
<polygon
className="cls-10"
points="62.53,7.12 63.47,0 69.17,4.37 "
id="polygon23"
transform="matrix(2.7712263,0.58147548,-0.58147548,2.7712263,-96.587828,-39.748071)"
style={{fill:"#a0a7f3",fillOpacity:"1",strokeWidth:"6",strokeDasharray:"none"}}
inkscape:transform-center-x="3.6173751"
inkscape:transform-center-y="5.1978852" />
<a typeof="button" className="svg-button" onClick={openElement({elementToOpen: "testing", classToHide: "cycletab"})}>
<path
className="cls-9"
d="M 78.599111,7.5468264 C 43.820346,-2.6177588 13.956746,14.286046 4.2106281,46.368749"
id="path23"
style={{stroke:"#a0a7f3",strokeWidth:"15",strokeDasharray:"none",strokeOpacity:"1"}} />
<text
style={{fontSize:"17.3333px",lineHeight:"0",fontFamily:"Arial",fill:"#000000",fillOpacity:"1",stroke:"none",strokeWidth:"6",strokeLinecap:"round",strokeLinejoin:"round",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
id="text28"
transform="translate(-0.03023506,-5.9602336)"><textPath
xlinkHref="#path23"
id="textPath28">Test</textPath></text> </a>
</g>
<g
id="g28"
style={{strokeWidth:"6",strokeDasharray:"none"}}
transform="translate(8.0019699,2.8418223)">
<polygon
className="cls-13"
points="117.65,78.84 112.07,83.36 110.94,76.27 "
id="polygon25-6"
style={{fill:"#f57d22",fillOpacity:"1",strokeWidth:"6",strokeDasharray:"none"}}
transform="matrix(-2.9650314,0.30449893,-0.30449893,-2.9650314,364.84067,249.28249)" />
<a typeof="button" className="svg-button" onClick={openElement({elementToOpen: "building", classToHide: "cycletab"})}>
<path
className="cls-11"
d="M 2.6659753,50.953505 C -2.0956694,72.727915 10.936866,102.94273 36.656234,113.62834"
id="path24"
style={{strokeWidth:"15",strokeDasharray:"none",stroke:"#f57d22",strokeOpacity:"1"}} />
<text
style={{fontSize:"17.3333px",lineHeight:"0",fontFamily:"Arial",fill:"#000000",fillOpacity:"1",stroke:"none",strokeWidth:"15",strokeLinecap:"round",strokeLinejoin:"round",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
id="text32"
transform="translate(-5.7110315,1.7453243)"><textPath
xlinkHref="#path24"
id="textPath32">Build<tspan
id="tspan32" /></textPath></text> </a>
</g>
<polygon
className="cls-8"
points="37.22,113.74 44.3,112.56 41.78,119.28 "
id="polygon22"
style={{strokeWidth:"6",strokeDasharray:"none",fill:"#f4cc1e",fillOpacity:"1"}}
transform="matrix(2.8248588,0,0,2.8248588,-67.797781,-207.96977)" />
<a typeof="button" className="svg-button" onClick={openElement({elementToOpen: "designing", classToHide: "cycletab"})}>
<text
style={{fontSize:"17.3333px",lineHeight:"0",fontFamily:"Arial",fill:"#000000",fillOpacity:"1",stroke:"none",strokeWidth:"15",strokeLinecap:"round",strokeLinejoin:"round",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
id="text29"
transform="translate(8.4052921,8.8553334)"><textPath
xlinkHref="#path22"
id="textPath34">Design<tspan
id="tspan29" /></textPath></text> </a>
</g>
</g>
<a typeof="button" className="svg-button" onClick={openElement({elementToOpen: "overview", classToHide: "cycletab"})}>
<circle
style={{opacity:"0.85",fill:"#e2dad7",fillOpacity:"1",strokeWidth:"15",strokeLinecap:"round",strokeLinejoin:"round",paintOrder:"fill markers stroke"}}
id="path1"
cx="67.916214"
cy="63.214005"
r="20" />
<text
style={{fontSize:"8px",lineHeight:"0",fontFamily:"Arial",opacity:"0.85",fill:"#000000",fillOpacity:"1",strokeWidth:"15",strokeLinecap:"round",strokeLinejoin:"round",strokeDasharray:"none",paintOrder:"fill markers stroke"}}
x="50.929825"
y="66.676674"
id="text1">
<tspan
id="tspan1"
x="50.929825"
y="66.676674"
style={{fontSize:"8px"}}>Overview</tspan></text>
</a>
</svg>
)
}