Difference between revisions of "Team:Freiburg/Testpage"

Line 2: Line 2:
 
{{Freiburg/Menubar}}
 
{{Freiburg/Menubar}}
 
{{Freiburg/wiki_content_start}}
 
{{Freiburg/wiki_content_start}}
−
<!-- wiki content goes in here -->
 
−
 
 
<html>
 
<html>
  
 
<style>
 
<style>
 
/*========= BEGIN: style for navigation bar ==========*/
 
/*========= BEGIN: style for navigation bar ==========*/
−
#results {
+
#home {
−
     background: url(https://static.igem.org/mediawiki/2015/2/2e/Freiburg_icon_results_active_yellow.png) no-repeat;
+
     background: url(https://static.igem.org/mediawiki/2015/d/d7/Freiburg_icon_home_active.png) no-repeat;
 
}
 
}
  
−
#results a {
+
#home a {
 
     color: #ecdc18;
 
     color: #ecdc18;
−
}s
 
−
 
−
#runningchip {
 
−
    left: 52%;
 
 
}
 
}
 
/*========= END: style for navigation bar ==========*/
 
/*========= END: style for navigation bar ==========*/
  
−
.image_box.left {
+
 
−
    margin-right: 50px;
+
/* =============== BEGIN: Circle of Elements ==================== */
 +
/*
 +
* Mixin to put items on a circle
 +
* [1] - Allows children to be absolutely positioned
 +
* [2] - Allows the mixin to be used on a list
 +
* [3] - In case box-sizing: border-box has been enabled
 +
* [4] - Allows any type of direct children to be targeted
 +
*/
 +
.circle-container {
 +
  position: relative;
 +
  /* [1] */
 +
  width: 30em;                      /* changes size of circle that elements are circling on */
 +
  height: 30em;
 +
  padding: 0;
 +
  border-radius: 50%;              /* switch between circle and Rechteck */
 +
  list-style: none;
 +
  /* [2] */
 +
  -moz-box-sizing: content-box;
 +
  -webkit-box-sizing: content-box;
 +
  box-sizing: content-box;
 +
  /* [3] */
 +
  margin: 5em auto 0;
 +
  /*border: solid 5px #0051A2;*/
 +
  z-index: 500;
 +
}
 +
.circle-container > * {
 +
  /* [4] */
 +
  display: block;
 +
  position: absolute;              /* set absolute to fix elements on circle */
 +
  top: 30%;
 +
  left: 40%;
 +
  width: 260px;                      /* define size of elements */
 +
  height: 200px;
 +
  margin: 0;   
 +
  font-size: 100%;
 +
  text-align: center;
 
}
 
}
  
−
.image_box.right {
+
/* transformations needed for showing the pictures */
−
    margin-left: 50px;
+
.circle-container > *:nth-of-type(1) {
 +
  -moz-transform: rotate(357deg) translate(19em) rotate(-357deg);
 +
  -ms-transform: rotate(357deg) translate(19em) rotate(-357deg);
 +
  -webkit-transform: rotate(357deg) translate(19em) rotate(-357deg);
 +
  transform: rotate(357deg) translate(19em) rotate(-357deg);            /*change translate for defining position of elements*/
 +
}
 +
.circle-container > *:nth-of-type(2) {
 +
  -moz-transform: rotate(45deg) translate(19em) rotate(-45deg);
 +
  -ms-transform: rotate(45deg) translate(19em) rotate(-45deg);
 +
  -webkit-transform: rotate(45deg) translate(19em) rotate(-45deg);
 +
  transform: rotate(45deg) translate(19em) rotate(-45deg);
 +
}
 +
.circle-container > *:nth-of-type(3) {
 +
  -moz-transform: rotate(105deg) translate(18em) rotate(-105deg);
 +
  -ms-transform: rotate(105deg) translate(18em) rotate(-105deg);
 +
  -webkit-transform: rotate(105deg) translate(18em) rotate(-105deg);
 +
  transform: rotate(105deg) translate(18em) rotate(-105deg);
 +
}
 +
.circle-container > *:nth-of-type(4) {
 +
  -moz-transform: rotate(147deg) translate(27em) rotate(-147deg);
 +
  -ms-transform: rotate(147deg) translate(27em) rotate(-147deg);
 +
  -webkit-transform: rotate(147deg) translate(27em) rotate(-147deg);
 +
  transform: rotate(147deg) translate(27em) rotate(-147deg);
 +
}
 +
.circle-container > *:nth-of-type(5) {
 +
  -moz-transform: rotate(180deg) translate(28em) rotate(-180deg);
 +
  -ms-transform: rotate(180deg) translate(28em) rotate(-180deg);
 +
  -webkit-transform: rotate(180deg) translate(28em) rotate(-180deg);
 +
  transform: rotate(180deg) translate(28em) rotate(-180deg);
 +
}
 +
.circle-container > *:nth-of-type(6) {
 +
  -moz-transform: rotate(212deg) translate(27em) rotate(-212deg);
 +
  -ms-transform: rotate(212deg) translate(27em) rotate(-212deg);
 +
  -webkit-transform: rotate(212deg) translate(27em) rotate(-212deg);
 +
  transform: rotate(212deg) translate(27em) rotate(-212deg);
 +
}
 +
.circle-container > *:nth-of-type(7) {
 +
  -moz-transform: rotate(255deg) translate(20em) rotate(-255deg);
 +
  -ms-transform: rotate(255deg) translate(20em) rotate(-255deg);
 +
  -webkit-transform: rotate(255deg) translate(20em) rotate(-255deg);
 +
  transform: rotate(255deg) translate(20em) rotate(-255deg);
 +
}
 +
.circle-container > *:nth-of-type(8) {
 +
  -moz-transform: rotate(310deg) translate(20em) rotate(-310deg);
 +
  -ms-transform: rotate(310deg) translate(20em) rotate(-310deg);
 +
  -webkit-transform: rotate(310deg) translate(20em) rotate(-310deg);
 +
  transform: rotate(310deg) translate(20em) rotate(-310deg);
 
}
 
}
  
 +
.circle-container a {
 +
  /*display: block; */                        /* border around elements */
 +
  border-radius: 8px;                      /* makes border around elements round or Rechteck */
 +
  /*box-shadow: 0 0 0 5px #0051A2;*/
 +
        color: #FFF;
 +
  background-color: #0051A2;
 +
  padding: 1px 10px;
 +
  font-size: 110%;
 +
  border: 5px solid #0051A2;
 +
}
 +
.circle-container > div {
 +
  display: block;
 +
  width: 100%;
 +
  border-radius: 10%;                      /* makes elements round or Rechteck */
 +
  -webkit-filter: grayscale(100%);
 +
  filter: grayscale(100%);
 +
}
 +
.circle-container img:hover {
 +
  -webkit-filter: grayscale(0);
 +
  filter: grayscale(0);
 +
}
  
−
/* ========== Style for Details-Boxes ================*/
+
/* =============== END: Circle of Elements - Positioning ==================== */
  
−
.details_box_trigger{
 
−
    display:inline-block;
 
−
    transition:all linear 0.15s;
 
−
    text-decoration: none !important;
 
−
    color: #0051A2;
 
−
    font-weight: 500;
 
−
    float: right;
 
−
}
 
  
 +
/* =============== BEGIN: Circle of Elements - Element Styling ==================== */
 +
.cool_header {
 +
    text-align: center;
 +
    height: 20px;
 +
    margin-bottom: 3px;
 +
    z-index: 10;
 +
}
  
−
.details_box_trigger.active {
+
.cool_content {
 +
    padding: 1em;
 +
    height: 150px;
 +
    background-color: #FFFFFF;
 +
    text-align: left;
 +
    box-shadow: 1px 1px 10px #888;
 +
    -webkit-box-shadow: 1px 1px 10px #888;
 +
    -moz-box-shadow: 1px 1px 10px #888;
 +
    border-radius: 15px;
 +
opacity: 0;
 +
 +
-webkit-transition: all 0.4s ease-in-out;
 +
-moz-transition: all 0.4s ease-in-out;
 +
-o-transition: all 0.4s ease-in-out;
 +
-ms-transition: all 0.4s ease-in-out;
 +
transition: all 0.4s ease-in-out;
 +
 +
-webkit-transform: scale(0);
 +
-moz-transform: scale(0);
 +
-o-transform: scale(0);
 +
-ms-transform: scale(0);
 +
transform: scale(0);
 +
 +
-webkit-backface-visibility: hidden;
 
}
 
}
  
−
.details_boxes{
+
.cool_container {
−
     padding:15px;
+
     width: 100%;
−
     display: none;
+
     padding-top: 180px;
−
     overflow:hidden;
+
     margin-bottom: -50px;
−
    box-shadow:0px 1px 3px rgba(0,0,0,0.25);
+
−
    border-radius:20px;
+
−
    background:#EEE;
+
 
}
 
}
  
−
/* ========== END: Style for Details-Boxes ================*/
+
/* =============== END: Circle of Elements - Element Styling ==================== */
  
  
−
</style>
+
/* =============== BEGIN: Circle of Elements - Center Image ==================== */
 +
.cool_centerimage {
 +
    margin: 0 auto;
 +
    position: relative;
 +
    width: 40%;
 +
    height: 250px;
 +
    top: -420px;
 +
    text-align: center;
 +
    left: 1%;
 +
    /*border: 1px solid #000;*/
 +
    color: #000;
 +
}
 +
/* =============== END: Circle of Elements - Center Image ==================== */
  
−
<script type="text/javascript">
 
  
−
// JQUERY for Details-Boxes
+
/* =============== BEGIN: Circle of Elements - Hiding Animation ==================== */
 +
.cool_image_blink {
 +
/*box-shadow:
 +
inset 0 0 0 0 rgba(200,95,66, 0.4),
 +
inset 0 0 0 16px rgba(255,255,255,0.6),
 +
0 1px 2px rgba(0,0,0,0.1);*/
 +
        box-shadow: 1px 1px 2px 2px #000;
 +
 +
-webkit-transition: all 0.4s ease-in-out;
 +
-moz-transition: all 0.4s ease-in-out;
 +
-o-transition: all 0.4s ease-in-out;
 +
-ms-transition: all 0.4s ease-in-out;
 +
transition: all 0.4s ease-in-out;
 +
        border-radius: 15px;
 +
}
  
−
$(document).ready(function() {
+
.cool_image_blink:hover {
−
    function close_accordion_section() {
+
/*box-shadow:
−
        $('.details_box_trigger').removeClass('active');
+
inset 0 0 0 110px #0051A2/*rgba(200,95,66, 0.4)*/,
−
        $('.details_boxes').slideUp(300).removeClass('open');
+
inset 0 0 0 16px #0051A2/*rgba(255,255,255,0.8)*/,
−
    }
+
0 1px 2px #0051A2/*rgba(0,0,0,0.1)*/;*/
 +
}
  
−
    $('.details_box_trigger').click(function(e) {
+
.cool_image_blink:hover .cool_content {
−
        // Grab current anchor value
+
opacity: 1;
−
        var currentAttrValue = $(this).attr('href');
+
−
+
-webkit-transform: scale(1);
−
        if($(e.target).is('.active')) {
+
-moz-transform: scale(1);
−
            close_accordion_section();
+
-o-transform: scale(1);
−
        }else {
+
-ms-transform: scale(1);
−
            close_accordion_section();
+
transform: scale(1);
−
+
}
−
            // Add active class to section title
+
−
            $(this).addClass('active');
+
−
            // Open up the hidden content panel
+
−
            $(currentAttrValue).slideDown(300).addClass('open');  
+
−
        }
+
−
+
−
        e.preventDefault();
+
−
    });
+
−
});
+
  
−
// Details-Boxes
+
.element1 {
 +
    background-image: url("https://static.igem.org/mediawiki/2015/b/b7/Freiburg_Own_Device_Foto.jpg");
 +
    background-size: 260px;
 +
    background-position: center;
 +
}
  
−
</script>
+
.element2 {
 +
    background-image: url("https://static.igem.org/mediawiki/2015/4/49/Freiburg_2015_pOP.jpg");
 +
    background-size: 260px;
 +
    background-position: center;
 +
}
  
 +
.element3 {
 +
    background-image: url("https://static.igem.org/mediawiki/2015/1/1f/Freiburg_project-img_0301.jpg");
 +
    background-size: 260px;
 +
    background-position: center;
 +
}
  
−
<div class="kommentar">
+
.element4 {
−
Ramona: Bilder werden noch ersetzt; Text wartet auf Kommentare!
+
    background-image: url("https://static.igem.org/mediawiki/2015/2/29/Freiburg_Modeling_Home.png");
−
<br>
+
    background-size: 260px;
−
Nicole: Hab ich es richtig verstanden, dass hier nur eure Highlights and Ergebnissen dargestellt werden sollen (mit verlinkung zu den anderen Ergebnissen)?
+
    background-position: center;
−
Was haltet ihr von einer kurzen Einleitung... In the last months we (aimed to) developed a diagnostic tool which enables [...] We succeded to detect anti-tetanus antibodies in human serum, develop/generate our own cell-free mix...
+
}
−
<br>
+
−
mehr Formulierungen wie: we demonstrated..., we (successfully) tested, we achieved...
+
−
</div>
+
  
−
<div class="content_box">
+
.element5 {
 +
    background-image: url("https://static.igem.org/mediawiki/2015/7/71/Freiburg_tetanus_home.png");
 +
    background-size: 260px;
 +
    background-position: center;
 +
}
  
−
<h1>Main Results</h1>
+
.element6 {
 +
    background-image: url("");
 +
    background-size: 260px;
 +
    background-position: center;
 +
}
  
−
<div id="anti_tetanus_results">
+
.element7 {
 +
    background-image: url("https://static.igem.org/mediawiki/2015/c/c1/Freiburg_diachip_centcoin.png");
 +
    background-size: 260px;
 +
    background-position: center;
 +
}
  
−
    <div class="kommentar">
+
.element8 {
−
    In den text eine bessere Reihenfolge rein bringen. Es wird vom blut gesprochen, dann Expression in E.coli und dann wieder Blut. </strong>
+
    background-image: url("https://static.igem.org/mediawiki/2015/0/0f/Freiburg_homepage_chip_blood.png");
−
    </div>
+
    background-size: 260px;
 +
    background-position: center;
 +
}
 +
/* =============== END: Circle of Elements - Hiding Animation ==================== */
  
−
    <h2>Detection of anti-Tetanus antibodies in human blood serum</h2>
 
−
    <div class="image_box right">
 
−
        <div class="thumb2 trien" style="width:250px"><div class="thumbinner">
 
−
            <img src="https://static.igem.org/mediawiki/2015/7/74/Freiburg_labjournal-roi_selection_20150817_429.png"></img>
 
−
        </div>
 
−
            <strong>Video 1: Detection of anti-tetanus antibodies in human serum.</strong>
 
−
        </div>
 
−
    </div>
 
  
−
     <p>
+
/* =============== BEGIN: Resetting General CSS ==================== */
 +
.mw-content-ltr ul {
 +
     padding: 0;
 +
    margin: 0 auto;
 +
}
  
−
    <strong>We specifically detected anti-Tetanus antibodies in human blood serum.</strong>
+
/*ul {
−
     To test the DiaCHIP under real-life conditions, we analyzed the blood serum of a vaccinated person for the presence of anti-Tetanus antibodies. We compared blood samples before and after vaccination and could directly detect its effect. To capture the antibodies, the <a href="http://parts.igem.org/Part:BBa_K1621003">corresponding antigen</a> was expressed in <i>E. coli</i>, purified by His-tag affinity purification and spotted on a specific Ni-NTA surface.
+
     line-height: 1em;
−
   
+
}*/
−
    <a class="details_box_trigger" href="#details_box-1">Detailed description.</a>
+
−
    </p>
+
−
 
+
  
−
     <div id="details_box-1" class="details_boxes">
+
.content_box {
−
        <p>
+
     box-shadow: none;
−
        Applying the sample taken three weeks after vaccination to the DiaCHIP resulted in a significant signal at the antigen spot, whereas no signal was obtained with the sample assumed to be negative. But convince yourself of how great the DiaCHIP performed. The video on the right shows these measurements right next to each other in real-time.
+
    padding: 2% 4%;
−
        <br>
+
    margin: 0px;
−
        Besides tetanus, some other antigens of immunological relevance were taken into account. See all the <a href="https://2015.igem.org/Team:Freiburg/Results/Diagnostics">results we obtained in terms of diagnostics</a>, including an approach for quantification of the measurements.
+
}
−
        </p>
+
/* =============== END: Resetting General CSS ==================== */
−
    </div>
+
−
</div>
+
  
−
<div id="agfp_results">
+
</style>
−
    <div class="kommentar"> hier noch rein bringen, dass ihr euren eigenen cell-free mix hergestellt habt und mit diesem auch GFP expremieren könnt und es im array erfolgreich nachweisen könnt</div>
+
−
    <h2>
+
−
        Detection of anti-GFP antibodies in rabbit serum using cell-free expressed GFP
+
−
    </h2>
+
  
−
    <div class="image_box left">
 
−
        <div class="thumb2 trien" style="width:250px"><div class="thumbinner">
 
−
            <img src="https://static.igem.org/mediawiki/2015/7/74/Freiburg_labjournal-roi_selection_20150817_429.png"></img>
 
−
        </div>
 
−
            <strong>Figure 1: Binding of anti-GFP antibodies to cell-free expressed GFP.</strong>
 
−
        </div>
 
−
    </div>
 
  
−
    <p>
+
<div class="cool_container">
−
    To show that cell-free expressed proteins can be immobilized on the protein surface while maintaining their antibody binding properties, the expression mix was spotted on a specific Ni-NTA surface after GFP expression. Cell-free expressed GFP was spotted on a specific Ni-NTA slide and flushed with serum of a rabbit immunized against GFP. The lowest spot consisting of cell-free expressed GFP shows a significant signal compared to the negative control (middle spot).
+
−
    <a class="details_box_trigger" href="#details_box-2">Detailed description.</a>
+
−
    </p>
+
−
 
+
  
−
     <div id="details_box-2" class="details_boxes">
+
     <ul class='circle-container'>
−
      <p>
+
        <li><!--1-->
−
        Serum of a rabbit immunized with GFP was applied to the DiaCHIP, which resulted in a strong signal at the referring spot evoked by antibody binding events (figure 1). Thus, His-tagged GFP was successfully expressed and immobilized on the surface, still enabling anti-GFP antibodies in a serum sample to bind.
+
            <div class="cool_header"><a href='#'>Own Device</a></div>
−
        <br>
+
          <div class="cool_image_blink element1">
−
        Find out more about the <a href="https://2015.igem.org/Team:Freiburg/Results/Assembling">preparation of the DiaCHIP</a> by producing a protein microarray from a DNA template using cell-free expression.  
+
            <div class="cool_content cool_text_blink">We built our own simplified and affordable detection device. Check out the step by step instructions!</div>
−
        </p>
+
          </div>
−
    </div>
+
        </li>
−
</div>
+
        <li><!--2-->
  
−
<div id="device_results">
+
          <div class="cool_header"><a href='#'>Improved iGEM Backbone</a></div>
−
    <h1>
+
          <div class="cool_image_blink element2">
−
        Building our very own, low-cost DiaCHIP measuring device.
+
          <div class="cool_content cool_text_blink">We provided an improved backbone for protein overexpression meeting all the iGEM standards. <br> See how we expanded the iGEM Registry!</div>
−
    </h1>
+
          </div>
−
    <div class="image_box right">
+
         </li>
−
        <div class="thumb2 trien" style="width:250px"><div class="thumbinner">
+
−
            <a href="https://static.igem.org/mediawiki/2015/b/b7/Freiburg_Own_Device_Foto.jpg">
+
−
            <img src="https://static.igem.org/mediawiki/2015/2/2e/Freiburg_Own_Device_Foto_preview.jpg"></img>
+
−
            </a>
+
−
        </div>
+
−
            <strong>Figure 2: Functional, but low-cost variant of the measuring device.</strong>  
+
−
         </div>
+
−
    </div>
+
  
−
    <p>
+
        <li><!--3-->
−
        The measuring device we used in collaboration with the AG Roth (ZBSA) to detect antibody binding events is a really expensive machine, but the physics which it is based on is rather simple. Our self-built device consistent of not much more than two lenses and a camera (A) reliably detected the binding of anti-GFP to GFP (B). To enable future iGEM teams to profit from this label-free detection method as we did, a cost-efficient and easy to rebuild variant of the device was developed (figure 2A).
+
−
        <a class="details_box_trigger" href="#details_box-3">Detailed description.</a>
+
−
    </p>
+
−
 
+
  
−
    <div id="details_box-3" class="details_boxes">
+
          <div class="cool_header"><a href='#'>Human Practice</a></div>
−
        <p>
+
          <div class="cool_image_blink element3">
−
        Figure 2B shows the binding of anti-GFP to GFP as it was established before, measured with our own device.
+
          <div class="cool_content cool_text_blink">What do people think about the DiaCHIP and systems based on synthetic biology? <br> Check out the results of our survey and discussions!</div>
−
        Look here, to see how you can <a href="https://2015.igem.org/Team:Freiburg/Results/Own_Device">build your own device</a> for label-free detection of antibody binding on a protein microarray needing two lenses, a camera and a little bit of fine feeling (??) sensitivety/sensitiveness/finesse/sure instincts.
+
          </div>
−
        </p>
+
        </li>
−
    </div>
+
−
</div>
+
  
−
<div id="specific_surfaces">
+
        <li><!--4-->
−
    <h1>
+
−
        Specific surfaces
+
−
    </h1>
+
−
           
+
  
 +
          <div class="cool_header"><a href='#'>Modeling</a></div>
 +
          <div class="cool_image_blink element4">
 +
          <div class="cool_content cool_text_blink">Modeling the generation of proteins during cell-free expression as well as their diffusion in our system helped us obtaining better results. Get more information here.</div>
 +
          </div>
 +
        </li>
  
−
    <p>
+
        <li><!--5-->
−
        Text
+
−
        <a class="details_box_trigger" href="#details_box-4">Detailed description.</a>
+
−
    </p>
+
  
 +
            <div class="cool_header"><a href='#'>Blood Serum Analysis</a></div>
 +
          <div class="cool_image_blink element5">
 +
            <div class="cool_content cool_text_blink">We successfully detected tetanus antibodies in human blood serum and measured binding of GFP antibodies to cell-free expressed GFP. <br> Visit our results page!</div>
 +
          </div>
 +
        </li>
  
−
    <div id="details_box-4" class="details_boxes">
+
         <li><!--6-->
−
         <p>
+
−
            Subtext
+
−
        </p>
+
−
    </div>
+
  
−
</div>
+
            <div class="cool_header"><a href='#'>Diagnostics today</a></div>
 +
          <div class="cool_image_blink element6">
 +
            <div class="cool_content cool_text_blink">Nowadays, medical diagnoses are mainly based on huge amounts of time-consuming and cost intensive serological tests.
 +
  Read more about the issues we tackled!</div>
 +
          </div>
 +
        </li>
  
−
<div id="own_mix">
+
        <li><!--7-->
−
    <h1>
+
         
−
        Own cell-free mix
+
            <div class="cool_header"><a href='#'>The DiaCHIP</a></div>
−
    </h1>
+
          <div class="cool_image_blink element7">
−
           
+
            <div class="cool_content cool_text_blink">Simultaneous screening for hundreds of diseases within a few hours? <br> Find out about the DiaCHIP's potential to enlighten future diagnostics!</div>
−
    <p>
+
          </div>
−
        Text
+
        </li>
−
        <a class="details_box_trigger" href="#details_box-5">Detailed description.</a>
+
−
    </p>
+
  
 +
        <li><!--8-->
 +
         
 +
            <div class="cool_header"><a href='#'>Our System</a></div>
 +
          <div class="cool_image_blink element8">
 +
            <div class="cool_content cool_text_blink">Generating a protein array on demand via cell-free expression and detecting antigen-antibody interactions label-free and in real-time: The principle behind the DiaCHIP!</div>
 +
          </div>
 +
        </li>
 +
    </ul>
  
−
     <div id="details_box-5" class="details_boxes">
+
     <div class="cool_centerimage">
 +
        <!--<img src="https://static.igem.org/mediawiki/2015/9/91/Freiburg_homepage_Dia_chip.png" width="250px">-->
 +
        <p>Modern everyday life is fast...<br>...too fast for spending unnecessary time at the doctor’s and waiting weeks for your test results. <br> Not to mention spending lots of money on numerous serological tests for your diagnosis. Wouldn't life be easier if a single test was sufficient?
 +
        </p>
 
         <p>
 
         <p>
−
            Subtext
+
This is the reason why we thought about a universally accessible, cost and time efficient diagnostic device and developed the DiaCHIP!
 
         </p>
 
         </p>
 
     </div>
 
     </div>
−
</div>
+
 
 
</div>
 
</div>
  
  
 +
<div class="content_box">
  
−
<div class="content_box">
+
 
−
<div class="flexbox">
+
<h1 class="sectionedit1">DiaCHIP - Enlightening Diagnostics</h1>
−
<a href="https://2015.igem.org/Team:Freiburg/Results/Assembling">
+
<div class="level1">
−
<img src="https://static.igem.org/mediawiki/2015/0/0f/Freiburg_homepage_chip_blood.png">
+
<p>
−
</a>
+
In modern medicine, fast detection and differentiation of diseases is a crucial and fundamental task. Typical ELISA-based assays are time-consuming and expensive. We propose an advanced procedure for the simultaneous detection of various diseases in a fast and inexpensive manner, the DiaCHIP. Our approach is based on the interaction of antibodies with their respective antigens. Different antigens are immobilized on a protein array generated by cell-free protein expression, using the corresponding DNA array as a template. Placed in a microfluidic chamber, the protein array is incubated with a patient’s blood sample. The interaction between an antibody in the sample and the corresponding immobilized antigen results in a local change of the optical thickness of the surface. This change can be detected using a label-free and real-time measurement technology called iRIf (imaging Reflectometric Interference). Offering simultaneous screening for several diseases, our DiaCHIP has strong potential to improve future diagnostics.  
−
</div>
+
</p>
−
<div class="flexbox">
+
−
<a href="https://2015.igem.org/Team:Freiburg/Results/Diagnostics">
+
−
<img src="https://static.igem.org/mediawiki/2015/0/0f/Freiburg_homepage_chip_blood.png">
+
−
</a>
+
 
</div>
 
</div>
−
<p> Click on one of the images to get further insight how we build up our DiaCHIP </p>
 
  
 
</div>
 
</div>
  
 
</html>
 
</html>
−
 
−
<!-- wiki content ends here -->
 
 
{{Freiburg/wiki_content_end}}
 
{{Freiburg/wiki_content_end}}

Revision as of 09:47, 14 September 2015

""

  • Own Device
    We built our own simplified and affordable detection device. Check out the step by step instructions!
  • Improved iGEM Backbone
    We provided an improved backbone for protein overexpression meeting all the iGEM standards.
    See how we expanded the iGEM Registry!
  • Human Practice
    What do people think about the DiaCHIP and systems based on synthetic biology?
    Check out the results of our survey and discussions!
  • Modeling
    Modeling the generation of proteins during cell-free expression as well as their diffusion in our system helped us obtaining better results. Get more information here.
  • Blood Serum Analysis
    We successfully detected tetanus antibodies in human blood serum and measured binding of GFP antibodies to cell-free expressed GFP.
    Visit our results page!
  • Diagnostics today
    Nowadays, medical diagnoses are mainly based on huge amounts of time-consuming and cost intensive serological tests. Read more about the issues we tackled!
  • The DiaCHIP
    Simultaneous screening for hundreds of diseases within a few hours?
    Find out about the DiaCHIP's potential to enlighten future diagnostics!
  • Our System
    Generating a protein array on demand via cell-free expression and detecting antigen-antibody interactions label-free and in real-time: The principle behind the DiaCHIP!

Modern everyday life is fast...
...too fast for spending unnecessary time at the doctor’s and waiting weeks for your test results.
Not to mention spending lots of money on numerous serological tests for your diagnosis. Wouldn't life be easier if a single test was sufficient?

This is the reason why we thought about a universally accessible, cost and time efficient diagnostic device and developed the DiaCHIP!

DiaCHIP - Enlightening Diagnostics

In modern medicine, fast detection and differentiation of diseases is a crucial and fundamental task. Typical ELISA-based assays are time-consuming and expensive. We propose an advanced procedure for the simultaneous detection of various diseases in a fast and inexpensive manner, the DiaCHIP. Our approach is based on the interaction of antibodies with their respective antigens. Different antigens are immobilized on a protein array generated by cell-free protein expression, using the corresponding DNA array as a template. Placed in a microfluidic chamber, the protein array is incubated with a patient’s blood sample. The interaction between an antibody in the sample and the corresponding immobilized antigen results in a local change of the optical thickness of the surface. This change can be detected using a label-free and real-time measurement technology called iRIf (imaging Reflectometric Interference). Offering simultaneous screening for several diseases, our DiaCHIP has strong potential to improve future diagnostics.