Difference between revisions of "Team:Valencia UPV/Human Practices"

(Undo revision 190171 by Carolinarp (talk))
Line 1: Line 1:
 
{{Valencia_UPV/bootstrap.css}}
 
{{Valencia_UPV/bootstrap.css}}
<!--{{Valencia_UPV/bootstrapMin.css}}-->
 
 
{{Valencia_UPV/custom.css}}
 
{{Valencia_UPV/custom.css}}
 
{{Valencia_UPV/flickity.css}}
 
{{Valencia_UPV/flickity.css}}
Line 8: Line 7:
 
{{Valencia_UPV/stackinterface.css}}
 
{{Valencia_UPV/stackinterface.css}}
 
{{Valencia_UPV/theme.css}}
 
{{Valencia_UPV/theme.css}}
{{Valencia_UPV/navBar}}
 
  
<html>
 
<style>
 
  
#home_logo, #sideMenu { display:none; }
 
#sideMenu, #top_title, .patrollink  {display:none;}
 
#content { margin-left:0px; margin-top:-30px; padding:0px; width:100%;}
 
  
</style>
 
  
 +
<html>
 +
    <style>
 +
    #home_logo, #sideMenu { display:none; }
 +
    #sideMenu, #top_title, .patrollink  {display:none;}
 +
    #content { margin-left:0px; margin-top:-30px; padding:0px; width:100%;}
 +
    </style>
 
     <head>
 
     <head>
 
         <meta charset="utf-8">
 
         <meta charset="utf-8">
Line 28: Line 26:
 
         <link href="https://fonts.googleapis.com/css?family=Lato:400,700,900" rel="stylesheet">
 
         <link href="https://fonts.googleapis.com/css?family=Lato:400,700,900" rel="stylesheet">
 
         <link href="https://2018.igem.org/Template:Valencia_UPV/fontAwesome?action=raw&ctype=text/css" rel="stylesheet" type="text/css">
 
         <link href="https://2018.igem.org/Template:Valencia_UPV/fontAwesome?action=raw&ctype=text/css" rel="stylesheet" type="text/css">
 
 
 
 
 
          
 
          
 
     </head>
 
     </head>
  <body class="" style="background-color:#353535;">
+
    <body class="" style="background-color:#353535;">
         <a class="anchorOffset" id="start"></a>
+
         <a id="start"></a>
 
+
        <div class="nav-container" style="margin-bottom: 1.85714286em;">
 
+
             <div class="bar bar--sm visible-xs">
<!--------- NAVBAR-------------------------------------------------------------------------------------------------------------------------------------------------------------->
+
                <div class="container">
 
+
                    <div class="row">
 
+
                        <div class="col-3 col-md-2">
     
+
                            <a href="index.html">
 
+
                                <img class="logo logo-dark" alt="logo" src="https://static.igem.org/mediawiki/2018/d/d6/T--Valencia_UPV--textoPrinteria.png">
 
+
                            </a>
 
+
                        </div>
<!------------CONTENEDOR PRINCIPAL ---------------------------------------------------------------------------------------------------------------------------------->
+
                        <div class="col-9 col-md-10 text-right">
 
+
                            <a href="#" class="hamburger-toggle" data-toggle-class="#menu1;hidden-xs">
 
+
                                <i class="icon icon--sm stack-interface stack-menu"></i>
<div class="main-container">
+
                            </a>
   
+
                        </div>
            <section style="/* background-color: #353535; *//* background-image: url(&quot;https://previews.123rf.com/images/bogdanhoda/bogdanhoda1504/bogdanhoda150400014/38730978-test-tubes-in-clinic-pharmacy-and-medical-research-laboratory-with-male-scientist-using-pipette.jpg&quot;); *//* background-size: 100%; */height:44.2em;margin-top: 0em;padding-top: 1.1em;" class="height-90 parallax">
+
                    </div>
              <div class="main-container" style="
+
                    <!--end of row-->
height: 100%;">
+
                </div>
              <center style="
+
                <!--end of container-->
height: 100%;">
+
              <div class="col-md-10" style="
+
height: 100%;margin-top: 4em;">
+
<div id="logoPrinteria" class="item" style="
+
background-image: url(http://via.placeholder.com/1155x666);
+
height: 100%;
+
width: 100%;background-attachment: fixed; background-position: center; background-position-y: 100px; background-repeat: no-repeat">
+
   
+
    <div style="/* position: absolute; *//* top: 81%; *//* padding-left: 31em; */">
+
<a class="btn down inner-link active" href="#story" style="font-size: 82%;/* position: fixed; *//* bottom: 7%; */top: 541px;z-index: 99;background-color: white;position: relative;border-radius: 80%;width: 3.8em;height: 3.8em;padding: 0;padding-top: 14px;">
+
             <i class="stack-interface stack-down-open-big"></i>
+
        </a>
+
</div>
+
   
+
</div>
+
</div>
+
               
+
              </center>
+
             
+
</div>
+
 
+
 
+
 
+
              </section>
+
          </div>
+
 
+
<!-- FIN MAIN CONTAINER -->
+
 
+
<a class="anchorOffset" id="story"></a>
+
<section class="feature-large" style="padding-top: 6em; padding-bottom: 50px; outline: none;" data-scroll-id="story" tabindex="-1">
+
  <div class="container">
+
  <div class="row">
+
      <div class="col-md-3" style="
+
        margin-left: 0em;
+
        padding-right: 0px;
+
        padding-left: 0.2em;">
+
        <div class="tabs-container tabs--vertical page-navigator" style="position: -webkit-sticky;position: sticky;padding-bottom: 0px;margin-top: 11.4em;">
+
            <h4 style="
+
              padding-left: 1em;
+
              ">Index</h4>
+
            <ul class="lateral">
+
              <li class="lateral" style="margin-bottom: 0px;padding-bottom: 1em;padding-top: initial;padding-left: 1em;">
+
                  <div class="tab__title" style="
+
                    line-height: 1.3em;
+
                    ">
+
                    <a href="#Overview" class="lateral inner-link" style="
+
                        color: #353535;
+
                        opacity: 1;
+
                        list-style-type: circle;
+
                        ">Human Practices</a>
+
                  </div>
+
              </li>
+
              <li class="lateral">
+
                  <div class="tab__title" style="
+
                    line-height: 1.3em;
+
                    ">
+
                    <a href="#BioArt" class="lateral inner-link" style="
+
                        color: #353535;
+
                        opacity: 1;
+
                        ">Integrated Human</a>
+
                  </div>
+
              </li>
+
              <li class="lateral">
+
                  <div class="tab__title" style="
+
                    line-height: 1.3em;
+
                    ">
+
                    <a href="#Generations" class="lateral inner-link" style="
+
                        color: #353535;
+
                        opacity: 1;
+
                        ">Social Engagement</a>
+
                      </div>
+
                    </li>         
+
          <li class="lateral">
+
                  <div class="tab__title" style="
+
                    line-height: 1.3em;
+
                    ">
+
                    <a href="#Generations" class="lateral inner-link" style="
+
                        color: #353535;
+
                        opacity: 1;
+
                        ">Collaborations</a>
+
                      </div>
+
                    </li>
+
              <li class="lateral">
+
                  <div class="tab__title" style="
+
                    line-height: 1.3em;
+
                    ">
+
                    <a href="#European" class="lateral inner-link" style="
+
                        color: #353535;
+
                        opacity: 1;
+
                        ">Safety</a>
+
                  </div>
+
              </li>
+
            </ul>
+
            <ul class="tabs-content">
+
            </ul>
+
        </div>
+
      </div>
+
      <div class="col-md-9 col9Phone" style="padding-left: 6em;padding-right: 2em;">
+
        <div>
+
          <!--BOTONES PARA MOVERSE POR LA PÁGINA -->
+
            <!--Los enlaces están bien pero los ids a donde apuntan están descuadrados adrede para que al pulsar lleve un poco por encima del contenido -->
+
            <div id="" data-scroll-id="" tabindex="-1" style="outline: none; margin-top: 1em;" class="row">
+
              <div class="col-md-3" style="text-align: center;">
+
                  <a class="inner-link" href="#Human"><img class="fotosAttr" src="FOTO"></a>
+
                  <h6 style="text-align: center !important;"></h6>
+
              </div>
+
              <div class="col-md-3" style="text-align: center;">
+
                  <a class="inner-link" href="#Integrated"><img class="fotosAttr" src="FOTO"></a>
+
                  <h6 style="text-align: center !important;"></h6>
+
              </div>
+
              <div class="col-md-3" style="text-align: center;">
+
                  <a class="inner-link" href="#Social"><img class="fotosAttr" src="FOTO"></a>
+
                  <h6 style="text-align: center !important;"></h6>
+
              </div>
+
              <div class="col-md-3" style="text-align: center;">
+
                  <a class="inner-link" href="#Collaborations"><img class="fotosAttr" src="FOTO"></a>
+
                  <h6 style="text-align: center !important;"> </h6>
+
              </div>
+
              <div class="col-md-3" style="text-align: center;">
+
                  <a class="inner-link" href="#Safety"><img class="fotosAttr" src="FOTO"></a>
+
                  <h6 style="text-align: center !important;"> </h6>
+
              </div>
+
             
+
 
             </div>
 
             </div>
             <!--FIN BOTONES PARA MOVERSE POR LA PÁGINA -->
+
             <!--end bar-->
 +
            <div class="col-md-12" style="padding: 0px;margin: 0 auto;">
 +
                <nav id="menu1" class="bar bar--sm bar-1 hidden-xs bg--light" style="
 +
                    height: 120px; padding: 0px; background-color: rgb(53, 53, 53); margin: 0px auto; text-align: center;">
 +
                    <div class="container" style="
 +
                        height: 100%;
 +
                        padding-top: 10px;
 +
                        ;lute;">
 +
                        <div class="row" style="
 +
                            height: 100%; padding-top: 1.85em;">
 +
                            <div class="col-lg-3 col-md-3 hidden-xs" style="
 +
                                height: 100%;
 +
                                position: absolute;padding-left: 0px;display: flex;">
 +
                                <img class="" src="https://static.igem.org/mediawiki/2018/8/8a/T--Valencia_UPV--pruebaPrinteriaWhiteUPV2018.png" style="
 +
                                height: 64px; width: 224px; margin-top: 0; !important ">
 +
                                <!--end module-->
 +
                            </div>
 +
                            <div class="col-lg-12 col-md-12 text-right text-left-xs text-left-sm">
 +
                                <div class="bar__module" style="
 +
                                    padding-top: 10px; float: right;">
 +
                                    <ul class="menu-horizontal text-right">
 +
                                        <li class="dropdown dropdown--hover">
 +
                                            <span class="dropdown__trigger navLinks">Team</span>
 +
                                            <!--
 +
                                            <div class="dropdown__container">
 +
                                                <div class="container">
 +
                                                    <div class="row">
 +
                                                        <div class="col-md-3 col-lg-2 dropdown__content">
 +
                                                            <ul class="menu-vertical">
 +
                                                                <li>
 +
                                                                    Team
 +
                                                                </li>
 +
                                                            </ul>
 +
                                                        </div>
 +
                                                    </div>
 +
                                                </div>
 +
                                            </div>
 +
                                            -->
 +
                                        </li>
 +
                                        <li class="dropdown">
 +
                                            <span class="dropdown__trigger navLinks">Project</span>
 +
                                           
 +
                                            <!--end dropdown container-->
 +
                                        </li>
 +
                                        <li class="dropdown">
 +
                                            <span class="dropdown__trigger navLinks">Wet Lab</span>
 +
                                           
 +
                                            <!--end dropdown container-->
 +
                                        </li>
 +
                                        <li class="dropdown">
 +
                                            <span class="dropdown__trigger navLinks">Dry Lab</span>
 +
                                           
 +
                                            <!--end dropdown container-->
 +
                                        </li>
 +
                                        <li class="dropdown">
 +
                                            <span class="dropdown__trigger navLinks">Human Practices</span>
 +
                                           
 +
                                            <!--end dropdown container-->
 +
                                        </li>
 +
                                    </ul>
 +
                                </div>
 +
                                <!--end module-->
 +
                            </div>
 +
                        </div>
 +
                        <!--end of row-->
 +
                    </div>
 +
                    <!--end of container-->
 +
                </nav>
 +
            </div>
 +
            <!--end bar-->
 +
        </div>
 +
        <div class="main-container">
 
              
 
              
             <!------------------------------------------------------------------------Overview------------------------------------------------------------------->
+
             <section style="
        </div>
+
                ; ; background-size: 100%;height: 44.2em;margin-top: 0em;padding-top: 1.1em;" class="height-90 parallax">
        <!--ENLACE DE DESTINO: overview -->
+
                <div class="main-container" style="
        <a class="anchorOffset" id="Overview"></a>
+
                    height: 100%;">
        <!--FIN ENLACE DE DESTINO -->
+
                    <center style="
        <div style="
+
                    height: 100%;">
            margin-top: 50px;" class="hashlink">
+
                    <div class="col-md-10" style="
            <div class="row">
+
                        height: 100%;margin-top: 4em;">
              <div class="col-md-3">        
+
                        <div id="logoPrinteria" class="item" style="
              </div>
+
                            background-image: url(https://static.igem.org/mediawiki/2018/3/3b/T--Valencia_UPV--laboratorioAdrianUPV2018.jpeg);
              <a class="anchorOffset" id="Human"></a>
+
                            height: 100%;
              <div class="col-md-9">
+
                            width: 100%;background-attachment: fixed;background-size: cover;">
                  <h3>Human Practices</h3>
+
                           
           
+
                            <div style="/* position: absolute; *//* top: 81%; *//* padding-left: 31em; */">
                  <p> Science and technology have always been prompted by a desire of solving social issues. Therefore, science would be nothing if it doesn’t exist a relationship with people. </p>
+
                                <a class="btn down inner-link active" href="#story" style="font-size: 82%;right: 50%;/* position: fixed; *//* bottom: 7%; */top: 85.2%;z-index: 99;background-color: white;position: absolute;border-radius: 80%;width: 3.8em;height: 3.8em;padding: 0;padding-top: 14px;">
                  <h4><b><i>How your project affects the world and how the world affects it? </i></b><h4>
+
                                    <i class="stack-interface stack-down-open-big"></i>
                 
+
                                </a>
        </div>
+
                            </div>
        <!-----------------------------------------------------------------------Integrated-------------------------------------------------------------------------->
+
                           
        <!--ENLACE DE DESTINO: Integrated -->
+
                        </div>
        <a class="anchorOffset" id="Integrated"></a>
+
                    </div>
        <!--FIN ENLACE DE DESTINO -->
+
                   
        <div style="
+
                    </center>
            margin-top: 50px;">
+
                   
            <div class="row">
+
                    </div><div class="all-page-modals"></div><div class="all-page-modals"></div>
              <div class="col-md-3">
+
                    <div class="all-page-modals"></div>
              </div>
+
                </section></div>
              <div class="col-md-9">  
+
               
                   <p> When creating a new scientific device, the existence of political, economic and social frameworks leads into the necessity of an in-depth analysis of how your creation would affects the world and how the world affects it. Thus, we first decided to analyze Printeria main applications among society, which finally were clasificated as:
+
                <section id="story" class="feature-large" style="padding-top: 6em; padding-bottom: 50px; outline: none;" data-scroll-id="story" tabindex="-1">
 +
                    <div class="container">
 +
                        <div class="row">
 +
                            <div class="col-md-3" style="
 +
                                margin-left: 0em;
 +
                                padding-right: 0px;
 +
                                padding-left: 0.2em;
 +
                                ">   
 +
                                <div class="tabs-container tabs--vertical page-navigator" style="position: -webkit-sticky;position: sticky;padding-bottom: 0px;margin-top: 11.4em;">
 +
                                    <h4 style="
 +
                                    padding-left: 1em;
 +
                                    ">Index</h4>
 +
                                    <ul class="lateral">
 +
                                        <li class="lateral" style="margin-bottom: 0px;padding-bottom: 1em;padding-top: initial;padding-left: 1em;/* color: #353535; */">
 +
                                            <div class="tab__title" style="
 +
                                                line-height: 1.3em;
 +
                                                /* padding-left: 0.5em; */
 +
                                                ">
 +
                                                <a class="lateral" style="
 +
                                                    /* color: #ffffff; */
 +
                                                    opacity: 1;
 +
                                                    list-style-type: circle;
 +
                                                ">Human Practices</a>
 +
                                            </div>
 +
                                           
 +
                                        </li>
 +
                                        <li class="lateral">
 +
                                            <div class="tab__title" style="
 +
                                                line-height: 1.3em;
 +
                                                ">
 +
                                                <a class="lateral" style="
 +
                                                    color: #353535;
 +
                                                    opacity: 1;
 +
                                                ">Integrated Human</a>
 +
                                            </div>
 +
                                           
 +
                                        </li>
 +
                                        <li class="lateral">
 +
                                            <div class="tab__title" style="
 +
                                                line-height: 1.3em;
 +
                                                ">
 +
                                                <a class="lateral" style="
 +
                                                    color: #353535;
 +
                                                    opacity: 1;
 +
                                                ">Social Engagement</a>
 +
                                            </div>
 +
                                           
 +
                                        </li>
 +
                                        <li class="lateral">
 +
                                            <div class="tab__title" style="
 +
                                                line-height: 1.3em;
 +
                                                ">
 +
                                                <a class="lateral" style="
 +
                                                    color: #353535;
 +
                                                    opacity: 1;
 +
                                                ">Collaborations</a>
 +
                                            </div>
 +
                                           
 +
                                        </li>
 +
                                        <li class="lateral">
 +
                                            <div class="tab__title" style="
 +
                                                line-height: 1.3em;
 +
                                                ">
 +
                                                <a class="lateral" style="
 +
                                                    color: #353535;
 +
                                                    opacity: 1;
 +
                                                ">Safety</a>
 +
                                            </div>
 +
                                           
 +
                                        </li>
 +
                                    </ul><ul class="tabs-content"></ul>
 +
                                   
 +
                                   
 +
                                </div>
 +
                               
 +
                               
 +
                            </div>
 +
                            <div class="col-md-9" style="
 +
                                /* margin-left: 0px; */
 +
                                padding-left: 6em;
 +
                                padding-right: 2em;
 +
                                ">
 +
                                <div style="
 +
                                    ">
 +
                                    <!--<h1 style="
 +
                                    color: #353535;
 +
                                    ">Lorem ipsum</h1>-->
 +
                                    <!--<h2 style="
 +
                                    color: #353535;
 +
                                    ">Lorem ipsum</h2>-->
 +
                                    <h3 style="
 +
                                    color: #353535;
 +
                                    font-weight: 700;
 +
                                    font-size: 40px;
 +
                                    margin-bottom: 0.2em;
 +
                                    ">Human Practices</h3>
 +
                                   
 +
                                    <!--<h5 style="
 +
                                    color: #353535;
 +
                                    font-size: 16px;
 +
                                    font-weight: 750;
 +
                                    ">Lorem ipsum</h5>-->
 +
                                    <!--<h6 style="
 +
                                    color: #797979;
 +
                                    ">Lorem ipsum</h6>-->
 +
                                    <p style="
 +
                                        line-height: 1.7;
 +
                                        margin-bottom: 0;
 +
                                        color: #353535;">Science and technology have always been prompted by a desire of solving social issues. Thus, they science would be nothing if it doesn’t exist a relationship with people. </p>
 +
                   <h4><b><i>How your project affects the world and how the world affects it? </i></b></h4></p>
 +
                                    <p> When creating a new scientific device, the existence of political, economic and social frameworks leads into the necessity of an in-depth analysis of how your creation would affects the world and how the world affects it. Thus, we first decided to analyze Printeria main applications among society, which finally were clasificated as:
 
</p>
 
</p>
 
<p> <ul>
 
<p> <ul>
 
   <li>
 
   <li>
     <p><b>Research groups</b>. Printeria automatizes time-consuming protocols, so enhancing the intellectual task and increasing the experiments reproducibility</p>
+
     <p><b>Research groups</b>. Printeria automatizes time-consuming protocols, so enhancing the intellectual task and increasing the experiments reproducibility.</p>
 
   </li>
 
   </li>
 
   <li>
 
   <li>
     <p><b>Education</b>. With a friendly-user software, Printeria is also designed to be an educational tool, as a fully equipped device is introduced inside classrooms without the necessity of high-cost technologies </p>
+
     <p><b>Education</b>. With a friendly-user software, Printeria is also designed to be an educational tool, as a fully equipped device is introduced inside classrooms without the necessity of high-cost technologies. </p>
 
   </li>
 
   </li>
 
   <li>
 
   <li>
 
     <p><b>Bio Art</b>. Printeria offers a compact and friendly toolkit to have a complete palette of pigmented bacteria for the bioartist disposal. </p>
 
     <p><b>Bio Art</b>. Printeria offers a compact and friendly toolkit to have a complete palette of pigmented bacteria for the bioartist disposal. </p>
 
   </li>
 
   </li>
</ul>-  
+
</ul>
 
+
<p>During the design phase our product, we had many questions about how to fulfill the different <b>stakeholders demands</b>. In order to get first-hand answers, our human practices team conducted several interviews with each target group, so we could realize which where the real <b>user necessities</b> in relation to topics such as software functionalities, external design, DNA parts toolkit and biosafety measurements. In these interviews, we talked with the Spanish microbiologist PhD. Francis Mojica, and with bioartists such as <a href="http://mariapenilcobo.com/bioart">María Peñil</a>. We also received feedback from an open-talk with high schools last year students.  Moreover, microfluidic system experimental design was thoughtfully implemented with the advice of electronic engineering professionals from the microfluidic market niche.
 +
You can see our complete Integrated Human page by <a href="">clicking here</a>.
 
  </p>
 
  </p>
<p>During the design phase our product, we had many questions about how to fulfill the different <b>stakeholders demands </b>. In order to get first-hand answers, our human practices team conducted several interviews with each target group, so we could realize which where the real user necessities in relation to topics such as software functionalities, external design, DNA parts toolkit and biosafety measurements. In these interviews, we talked with the Spanish microbiologist PhD. Francis Mojica, and with bioartists such as <a href="http://mariapenilcobo.com/bioart">María Peñil</a>. We also received feedback from an open-talk with high schools last year students.  Moreover, microfluidic system experimental design was thoughtfully implemented with the advice of electronic engineering professionals from the microfluidic market niche.
+
<p></p>
You can see our complete Integrated Human page by <a href="">clicking here</a>
+
  <h4><b><i>Is our work responsible and good enough for the world? </i></b></h4>
  </p>
+
     
+
         
+
        </div>  
+
        <!--ENLACE DE DESTINO: Social-->
+
        <a class="anchorOffset" id="Social"></a>
+
        <!--FIN ENLACE DE DESTINO -->
+
        <div style="
+
            margin-top: 50px;">
+
            <div class="row">
+
              <div class="col-md-9">
+
                  <h4>Is our work responsible and good enough for the world?
+
 
+
</h4>
+
 
                
 
                
 
                   <p>Printeria was born with the aim of knocking down the barriers that prevent people from coming into Synthetic Biology. However, these barriers are not only related with the high-cost technology, but also with the society lack of awareness.  
 
                   <p>Printeria was born with the aim of knocking down the barriers that prevent people from coming into Synthetic Biology. However, these barriers are not only related with the high-cost technology, but also with the society lack of awareness.  
Line 244: Line 283:
  
 
</p>
 
</p>
                   <p> Thus, we realized it was necessary to promote a critical thinking atmosphere before integrating Printeria. In this context, one of our main concerns was to introduce an artistic approach to become SynBio a closer and familiar concept. This included a Bio Art workshop and a collaboration with the famous valencian artist José María Yturralde. Moreover, several talks were given to different target groups to divulgate SynBio and so <b>fight against misinformation</b>. See the full activities carried out in our a <a href=https://2018.igem.org/Team:Valencia_UPV/Public_Engagement ">Education and Public Engagement page</a>.  
+
                   <p> Thus, we realized it was necessary to promote a <b>critical thinking</b> atmosphere before integrating Printeria. In this context, one of our main concerns was to introduce an <b>artistic approach</b> to become SynBio a closer and familiar concept. This included a Bio Art workshop and a collaboration with the famous valencian artist José María Yturralde. Moreover, several talks were given to different target groups to divulgate SynBio and so <b>fight against misinformation</b>. See the full activities carried out in our a <a href=https://2018.igem.org/Team:Valencia_UPV/Public_Engagement ">Education and Public Engagement page</a>.  
            </div>
+
                    <h4>Collaborations</h4>
        </div>
+
   <p>Synthetic biology builds are the result of collaborations across many fields, including institutional, industrial, scientific, and technical developments (1). In the same way, sharing and collaborating are some of the <b>core values</b> of the iGEM community.  
        <!--------------------------------------------------------------------Collab------------------------------------------------------------------>
+
We were delighted to part of this collaborative approach, so you can all read the collaborations we carried out with other iGEM teams by going to our <a href=https://2018.igem.org/Team:Valencia_UPV/Collaborations"> Collaborations page</a>.
        <!--ENLACE DE DESTINO: ERN-->
+
        <a class="anchorOffset" id="Collaborations"></a>
+
        <!--FIN ENLACE DE DESTINO -->
+
        <div style="
+
            margin-top: 50px;">
+
            <div class="row">
+
              <div class="col-md-9">
+
             
+
                  <h4>Collaborations </h4>
+
   <p>Synthetic biology builds are the result of collaborations across many fields, including institutional, industrial, scientific, and technical developments (1). In the same way, sharing and collaborating are some of the core values of the iGEM community.  
+
We were delighted to part of this collaborative approach, so you can all read the collaborations we carried out with other iGEM teams by going to our Collaborations page.
+
 
                   </p>
 
                   </p>
        </div>
+
                   <h4> Biosafety </h4>
 
+
<!--------------------------------------------------------------------Safety----------------------------------------->
+
 
+
<!--ENLACE DE DESTINO: HARVARD -->
+
        <a class="anchorOffset" id="Safety"></a>
+
        <!--FIN ENLACE DE DESTINO -->
+
        <div style="
+
            margin-top: 50px;">
+
            <div class="row">
+
              <div class="col-md-9">         
+
                    
+
<h4> Biosafety </h4>
+
 
<p>Biosafety measurements are completely necessary during any lab research, like the one carried out by our team. Moreover, safety considerations in relation to Printeria sterilization and biocontention measurements is essential if we want to introduce a bio-engineering device as Printeria is in non-scientific places.  
 
<p>Biosafety measurements are completely necessary during any lab research, like the one carried out by our team. Moreover, safety considerations in relation to Printeria sterilization and biocontention measurements is essential if we want to introduce a bio-engineering device as Printeria is in non-scientific places.  
 
You can read our safety practices and the safety considerations we have established in regard to our device by going to the <a href="https://2018.igem.org/Team:Valencia_UPV/Safety">Safety page</a>.
 
You can read our safety practices and the safety considerations we have established in regard to our device by going to the <a href="https://2018.igem.org/Team:Valencia_UPV/Safety">Safety page</a>.
 
+
<p></p>
 
  </p>
 
  </p>
 
+
                                   
                      
+
                            </div>
      </div>
+
                        </div>
  </div>
+
                       
 
+
                     </div>
 
+
                </div>
 +
               
 +
            </div>
 +
           
 +
           
 +
        </section>
 +
    </div>
 +
    <!--end of row-->
 +
</div>
 +
<!--end of container-->
 
</section>
 
</section>
  
  
 
+
<footer style="
 
+
    background-color:#353535;" class="footer-3 text-center-xs space--xxs ">
 
+
    <div id="logoPrinteria" class="item" style="
 
+
        position: relative;text-align: center;lign: center;height: 50vh;">
 
+
         <div class="bar bar--sm&nbsp;bar-1 hidden-xs hidden-sm bg--light" style="
         <!--<div class="loader"></div>-->
+
            position: absolute;&nbsp;align-items: right;margin-top: 10%;; width: 100%;padding-left: 10%;">
         <a class="back-to-top inner-link" href="#start" data-scroll-class="100vh:active" style="font-size: 82%;">
+
            <p style="
             <i class="stack-interface stack-up-open-big"></i>
+
            color: white;margin-left: 480px;margin-bottom: 3px;;">Contact us:</p><ul>
 +
           
 +
            <li style="
 +
                float: left;margin-left: 480px; left;">
 +
                <a style="
 +
                    color: white;float: left;;">
 +
                </a><div style="
 +
                float: left;"><div style="
 +
                    color: white;float: left;display: block;">
 +
                    <i><img style="
 +
                    height: 40px;float: left; display= flex" src="https://static.igem.org/mediawiki/2018/2/2a/T--Valencia_UPV--mailUPV2018.png">
 +
                    </i>
 +
                    <p style="
 +
                        margin-left: 60px;margin-top: 11px;;
 +
                    ;">igem.upv.2018@gmail.com</p></div>
 +
                </div>
 +
               
 +
            </li>
 +
           
 +
         </ul>
 +
    </div>
 +
    <div class="bar bar--sm&nbsp;bar-1 hidden-xs hidden-sm &nbsp;bg--light" style="
 +
        position: absolute;&nbsp;align-items: right;margin-top: 10%;; width: 60%;padding-left: 10%;dding-left: 10%;height: 50vh;/* margin-bottom: 1; *//* margin-bottom: 10; */; /* margin-bottom: 10p; */margin-bottom: 10px;">
 +
        <p style="
 +
        color: white;margin-bottom: 2px;;"> Follow us at <b> @upvigem </b></p><ul style="list-style: none;">
 +
       
 +
        <li style="
 +
            float: left; margin-right: 40px;">
 +
            <a href="https://twitter.com/upvigem?lang=es" style="
 +
                color: white;;">
 +
                <i>
 +
                <img src="https://static.igem.org/mediawiki/2018/d/de/T--Valencia_UPV--twitterUPV2018.png" style="
 +
                height: 40px; ;" ;"=""></i>
 +
            </a>
 +
           
 +
        </li><li style="
 +
        float: left; margin-right: 40px;">
 +
        <a href="https://es.linkedin.com/company/valencia-upv-igem" style=" color: white;;">
 +
             <i>
 +
            <img style="
 +
            height: 40px;
 +
            ;" src="https://static.igem.org/mediawiki/2018/f/f4/T--Valencia_UPV--linkedinUPV2018.png">
 +
            </i>
 
         </a>
 
         </a>
 
+
    </li><li style="
     </body>
+
    float: left;margin-right: 40px;">
 
+
     <a href="https://es-es.facebook.com/ValenciaUPViGEM/" style=" color: white;;">
 
+
        <i>
         <script type="text/javascript" src="https://2018.igem.org/Template:Valencia_UPV/scriptsJS?action=raw&ctype=text/javascript"></script>
+
        <img src="https://static.igem.org/mediawiki/2018/6/6d/T--Valencia_UPV--facebookUPV2018.png" style="
        <script type="text/javascript"  src="https://2018.igem.org/Template:Valencia_UPV/jquery311minJS?action=raw&ctype=text/javascript"></script>
+
        height: 40px;
        <script type="text/javascript"  src="https://2018.igem.org/Template:Valencia_UPV/bootstrapMinJS?action=raw&ctype=text/javascript"></script>
+
        ;">
        <script type="text/javascript"  src="https://2018.igem.org/Template:Valencia_UPV/parallaxJS?action=raw&ctype=text/javascript"></script>
+
         </i>
      <script type="text/javascript"  src="https://2018.igem.org/Template:Valencia_UPV/smoothscrollminJS?action=raw&ctype=text/javascript"></script>
+
    </a>
      <script type="text/javascript"  src="https://2018.igem.org/Template:Valencia_UPV/jquerystepsminJS?action=raw&ctype=text/javascript"></script>
+
</li><li style="
       
+
float: left;margin-right: 40px; left;">
 
+
<a href="https://www.instagram.com/upvigem/?hl=es" style=" color: white;;">
 
+
    <i>
 
+
    <img src="https://static.igem.org/mediawiki/2018/c/ca/T--Valencia_UPV--instagramUPV2018.png" style="
 +
    height: 40px;
 +
    ;">
 +
    </i>
 +
</a>
 +
</li>
 +
</ul>
 +
</div><div class="bar bar--sm&nbsp;bar-1 hidden-md hidden-lg &nbsp;bg--light" style="
 +
position: absolute;&nbsp;align-items: right;margin-top: 20%;; width: 100%;padding-left: 10%;dding-left: 10%;height: 50vh;">
 +
<p style="
 +
color: white;margin-bottom: 20px;;"> Follow us at <b> @upvigem </b></p><ul>
 +
<li style="
 +
float: left; /* margin-right: 40px; */">
 +
<a href="https://twitter.com/upvigem?lang=es" style="
 +
color: white;;">
 +
<i>
 +
<img src="https://static.igem.org/mediawiki/2018/d/de/T--Valencia_UPV--twitterUPV2018.png" style="
 +
height: 40px; ;" ;"=""></i>
 +
</a>
 +
</li><li style="
 +
float: left; /* margin-right: 40px; */">
 +
<a href="https://es.linkedin.com/company/valencia-upv-igem" style=" color: white;;">
 +
<i>
 +
<img style="
 +
height: 40px;
 +
;" src="https://static.igem.org/mediawiki/2018/f/f4/T--Valencia_UPV--linkedinUPV2018.png">
 +
</i>
 +
</a>
 +
</li><li style="
 +
float: left;/* margin-right: 40px; */margin-top: 2;margin-top: 20;margin-top: 20p;/* margin-top: 20px; */">
 +
<a href="https://es-es.facebook.com/ValenciaUPViGEM/" style=" color: white;;">
 +
<i>
 +
<img src="https://static.igem.org/mediawiki/2018/6/6d/T--Valencia_UPV--facebookUPV2018.png" style="
 +
height: 40px;
 +
;">
 +
</i>
 +
</a>
 +
</li><li style="
 +
float: left;/* margin-right: 40px; *//* margin-top: 20px; */ left;">
 +
<a href="https://www.instagram.com/upvigem/?hl=es" style=" color: white;;">
 +
<i>
 +
<img src="https://static.igem.org/mediawiki/2018/c/ca/T--Valencia_UPV--instagramUPV2018.png" style="
 +
height: 40px;
 +
;">
 +
</i>
 +
</a>
 +
</li>
 +
</ul>
 +
</div>
 +
<img class="&nbsp;bar--sm bar-1 hidden-xs hidden-sm bg--light" src="https://static.igem.org/mediawiki/2018/f/f9/T--Valencia_UPV--footerUPV2018.png" alt="image">
 +
<img class="&nbsp;bar--sm bar-1 hidden-md hidden-lg bg--light" src="https://static.igem.org/mediawiki/2018/0/07/T--Valencia_UPV--footerMovilUPV2018.png" alt="image">
 +
</div>
 +
</footer>
 +
</div>
 +
<!--<div class="loader"></div>-->
 +
<a class="back-to-top inner-link" href="#start" data-scroll-class="100vh:active" style="font-size: 82%;">
 +
<i class="stack-interface stack-up-open-big"></i>
 +
</a>
 +
</body>
 +
<script type="text/javascript"  src="https://2018.igem.org/Template:Valencia_UPV/scriptsJS?action=raw&ctype=text/javascript"></script>
 +
<script type="text/javascript"  src="https://2018.igem.org/Template:Valencia_UPV/jquery311minJS?action=raw&ctype=text/javascript"></script>
 +
<script type="text/javascript"  src="https://2018.igem.org/Template:Valencia_UPV/parallaxJS?action=raw&ctype=text/javascript"></script>
 +
<script type="text/javascript"  src="https://2018.igem.org/Template:Valencia_UPV/smoothscrollminJS?action=raw&ctype=text/javascript"></script>
 +
<script type="text/javascript"  src="https://2018.igem.org/Template:Valencia_UPV/jquerystepsminJS?action=raw&ctype=text/javascript"></script>
 
</html>
 
</html>
 
{{Valencia_UPV/footer}}
 

Revision as of 15:43, 2 October 2018



Stack Multipurpose HTML Template

Human Practices

Science and technology have always been prompted by a desire of solving social issues. Thus, they science would be nothing if it doesn’t exist a relationship with people.

How your project affects the world and how the world affects it?

When creating a new scientific device, the existence of political, economic and social frameworks leads into the necessity of an in-depth analysis of how your creation would affects the world and how the world affects it. Thus, we first decided to analyze Printeria main applications among society, which finally were clasificated as:

  • Research groups. Printeria automatizes time-consuming protocols, so enhancing the intellectual task and increasing the experiments reproducibility.

  • Education. With a friendly-user software, Printeria is also designed to be an educational tool, as a fully equipped device is introduced inside classrooms without the necessity of high-cost technologies.

  • Bio Art. Printeria offers a compact and friendly toolkit to have a complete palette of pigmented bacteria for the bioartist disposal.

During the design phase our product, we had many questions about how to fulfill the different stakeholders demands. In order to get first-hand answers, our human practices team conducted several interviews with each target group, so we could realize which where the real user necessities in relation to topics such as software functionalities, external design, DNA parts toolkit and biosafety measurements. In these interviews, we talked with the Spanish microbiologist PhD. Francis Mojica, and with bioartists such as María Peñil. We also received feedback from an open-talk with high schools last year students. Moreover, microfluidic system experimental design was thoughtfully implemented with the advice of electronic engineering professionals from the microfluidic market niche. You can see our complete Integrated Human page by clicking here.

Is our work responsible and good enough for the world?

Printeria was born with the aim of knocking down the barriers that prevent people from coming into Synthetic Biology. However, these barriers are not only related with the high-cost technology, but also with the society lack of awareness. The lay-public do not usually know what SynBio and, when having heard about it, several misconceptions are commonly extended.

Thus, we realized it was necessary to promote a critical thinking atmosphere before integrating Printeria. In this context, one of our main concerns was to introduce an artistic approach to become SynBio a closer and familiar concept. This included a Bio Art workshop and a collaboration with the famous valencian artist José María Yturralde. Moreover, several talks were given to different target groups to divulgate SynBio and so fight against misinformation. See the full activities carried out in our a Education and Public Engagement page.

Collaborations

Synthetic biology builds are the result of collaborations across many fields, including institutional, industrial, scientific, and technical developments (1). In the same way, sharing and collaborating are some of the core values of the iGEM community. We were delighted to part of this collaborative approach, so you can all read the collaborations we carried out with other iGEM teams by going to our Collaborations page.

Biosafety

Biosafety measurements are completely necessary during any lab research, like the one carried out by our team. Moreover, safety considerations in relation to Printeria sterilization and biocontention measurements is essential if we want to introduce a bio-engineering device as Printeria is in non-scientific places. You can read our safety practices and the safety considerations we have established in regard to our device by going to the Safety page.