Difference between revisions of "Team:Cambridge-JIC/Practices"

 
(219 intermediate revisions by 6 users not shown)
Line 1: Line 1:
 
{{:Team:Cambridge-JIC/Templates/Menu}}
 
{{:Team:Cambridge-JIC/Templates/Menu}}
 
<html>
 
<html>
<section style="background-color: #fff">
+
 
     <div class="slide">
+
<section style="background-color: #fff; padding-top:30px">
        <div style="width: 80%; margin: 30px 50px;color:#000;min-height:0px">
+
     <div class="slide" style="min-height:200px">
            <h1>Human Practices: The Open Hardware Revolution</h1>
+
<center>
            <p style="font-size: 120%">In choosing the novel Hardware Track, this years’ Cambridge-JIC iGEM team has come across unexpected challenges. Unsurprisingly perhaps, these have often required us to look into fields of work that we have had little or no previous experience in. This has been particularly true when navigating the world of intellectual property law, including <span class="hl_2">hardware licensing</span> and <span class="hl_2">design copyright</span>. In developing Open Source Hardware (OSH) as part of the competition, we recognised the need for an easily-digestible, comprehensive and hardware-specific guide to ensuring the OSH is accessible to the community.
+
<img src="//2015.igem.org/wiki/images/e/e8/CamJIC-Home_Community.png" style="height:150px;">
</p>
+
</center>
            <h4>Open source hardware is hardware whose design is made publicly available so that anyone can study, modify, distribute, make, and sell the design or hardware based on that design.</h4>
+
    </div>
<h4>OSH is “free as in free speech, not free beer” or more formally <i>Libre</i> rather than <i>Gratis</i>.</h4>
+
</section>
 +
 
 +
<section style="background-color: #c6b2e4">
 +
    <div class="slide" style="background-image:url(//2015.igem.org/wiki/images/2/22/CamJIC-Community_Outreach.png);position:relative">
 +
        <div style="right:37%;top:50%;font-size:20px;position:absolute">
 +
        <a class="btn btn-default btn-lg" href="//2015.igem.org/Team:Cambridge-JIC/Outreach" role="button" style="color:#3d3d3d;border-color:#3d3d3d">Learn More</a>
 +
        </div>
 +
<div style="left:15%;right:50%;top:25%;font-size:20px;position:absolute">
 +
      <p><b>Our survey </b> on the public perception of Synthetic Biology suggested communicating research was a challenge</p>
 +
      <p>By organising workshops for school students, we increased awareness of its potential benefits <b>for future generations</b></p>
 +
        </div>
 +
<div style="left:52%;right:10%;top:25%;font-size:20px;position:absolute">
 +
      <p>We introduced students to programming and modern microscopy techniques, <b> taking them beyond the school syllabus</b><p>
 
         </div>
 
         </div>
 
     </div>
 
     </div>
 
</section>
 
</section>
  
        <style>
+
<section style="background-color: #f3f3f3">
            #cam-quiz {
+
    <div class="slide" style="background-image:url(//2015.igem.org/wiki/images/4/47/CamJIC-Community_Practices.png);position:relative">
                background-color: #fff;
+
        <div style="right:15%;top:67%;font-size:20px;position:absolute">
                border: 5px solid;
+
        <a class="btn btn-default btn-lg" href="//2015.igem.org/Team:Cambridge-JIC/OpenHardwareRevolution" role="button" style="color:#123a68;border-color:#123a68">Learn More</a>
                border-color: #a3c1ad;
+
        </div>
            }
+
<div style="left:60%;right:5%;top:9%;font-size:20px;position:absolute;color:#123a68">
 +
      <p>Developing hardware brings with it issues of <b>licensing, patent and copyright</b></p>
 +
      <p><b>From our experience,</b> navigating the legal jargon and complex procedures can be prohibitively time-consuming</p>
 +
        </div>
 +
<div style="left:40%;right:30%;top:60%;font-size:20px;position:absolute;color:#123a68">
 +
      <p><b>For iGEM teams</b><br>looking to release Open Source Hardware, we have made an interactive guide to use as a starting point</p>
 +
    </div>
 +
</section>
  
            .cam-quiz-question, .cam-quiz-result {
+
<section style="background-color: #b1e7ad">
                border: 5px solid;
+
    <div class="slide" style="background-image:url(//2015.igem.org/wiki/images/a/aa/CamJIC-About_Collaboration.png);position:relative">
                border-color: #a3c1ad;
+
        <div style="right:76%;top:74%;font-size:20px;position:absolute">
                padding: 5px;
+
        <a class="btn btn-default btn-lg" href="//2015.igem.org/Team:Cambridge-JIC/Collaborations" role="button" style="color:#3d3d3d;border-color:#3d3d3d">Learn More</a>
                margin: 0px;
+
        </div>
            }
+
<div style="left:5%;right:40%;top:30%;font-size:20px;position:absolute;color:#1b4f18">
 +
      <p><b>The William and Mary iGEM team</b> are using GFP in the Interlab Measurement study</p>
 +
      <p><b>The Glasgow iGEM team</b> are using GFP and RFP to make bioluminescent bacteria</p>
 +
        </div>
 +
<div style="left:13%;right:20%;top:57%;font-size:20px;position:absolute;color:#1b4f18">
 +
      <p>Collaboration meant confirming the expression of their fluorescent proteins while <b>testing OpenScope's capabilities</b></p>
 +
        </div>
 +
    </div>
 +
</section>
  
            .cam-quiz-question {
+
<section style="background-color:#fff">
                background-color: #fff;
+
    <div class="slide" style="background-image:url(//2015.igem.org/wiki/images/d/d6/CamJIC-Project_Wiki.png); position:relative">
            }
+
         <div style="right:44%;bottom:65%;font-size:20px;position:absolute">
 
+
<a class="btn btn-default btn-lg" href="//2015.igem.org/Team:Cambridge-JIC/Wiki_Design" role="button" style="color:#123a68;border-color:#123a68">Learn More</a>
            .cam-quiz-answer.cam-quiz-selected {
+
        </div>
                font-weight: bold;
+
<div style="left:36%;right:29%;top:75%;font-size:20px;position:absolute;color:#123a68">
            }
+
        <p><b>A map of our entire wiki</b>, in case you can't find what you're looking for</p>
 
+
        <p><b>Some advice</b> for future iGEM teams on making a wiki</p>
            .cam-quiz-result {
+
        </div>
                background-color: #fff;
+
    </div>
            }
+
</section>
        </style>
+
        <script>
+
            quiz = function(elem){
+
                this.elem = $(elem);
+
                this.steps = [];
+
 
+
                this.step = function(question, answers) {
+
                    this.question = question;
+
                    this.answers = {};
+
                    this.bind = function(target, keys) {
+
                        if (typeof keys === "undefined") {
+
                            keys = Object.keys(this.answers);
+
                        }
+
 
+
                        for (var i=0; i<keys.length; i++) {
+
                            key = keys[i];
+
                            this.answers[key].target = target;
+
                        }
+
                    };
+
                    this.elem = function(quiz, index) {
+
                        elem = $('<div class="cam-quiz-question">');
+
                        elem.append($('<h3>').text(this.question));
+
                        for (key in this.answers) {
+
                            elem.append($('<div class="cam-quiz-answer">')
+
                                .text(this.answers[key].answer)
+
                                .data("key", key)
+
                                .data("step", this)
+
                                .data("quiz", quiz)
+
                                .data("index", index)
+
                                .click(function(){
+
                                    key = $(this).data("key");
+
                                    step = $(this).data("step");
+
                                    quiz = $(this).data("quiz");
+
                                    index = $(this).data("index");
+
                                    ref = quiz.steps[index];
+
                                    ref.elem.find('.cam-quiz-selected').removeClass('cam-quiz-selected');
+
                                    $(this).addClass('cam-quiz-selected');
+
 
+
                                    for (var i=quiz.steps.length; --i>index;) {
+
                                        quiz.steps[i].elem.remove();
+
                                        quiz.steps.pop();
+
                                    }
+
 
+
                                    quiz.steps[index].option = key;
+
                                    nstep = step.answers[key].target;
+
                                    switch (typeof nstep) {
+
                                        case "object":
+
                                            var nindex = quiz.steps.length;
+
                                            var nref = {
+
                                                'step': nstep,
+
                                                'elem': nstep.elem(quiz, nindex),
+
                                                'option': undefined
+
                                            };
+
                                            quiz.steps.push(nref);
+
                                            quiz.elem.append(nref.elem);
+
                                            break;
+
                                        case "function":
+
                                            options = [];
+
                                            for (var i=0; i<quiz.steps.length; i++) {
+
                                                options.push(quiz.steps[i].option);
+
                                            }
+
                                            var nref = {
+
                                                'step': undefined,
+
                                                'elem': $('<div class="cam-quiz-result">')
+
                                                    .append(nstep(options)),
+
                                                'option': undefined
+
                                            };
+
                                            quiz.steps.push(nref);
+
                                            quiz.elem.append(nref.elem);
+
                                            break;
+
                                        default:
+
                                            alert("Quiz error! Please contact the site maintainers....");
+
                                            break;
+
                                    }
+
                                }));
+
                        }
+
                        return elem;
+
                    };
+
 
+
                    for (key in answers) {
+
                        answer = answers[key];
+
                        this.answers[key] = {
+
                            'answer': answer,
+
                            'target': undefined
+
                        };
+
                    }
+
                };
+
 
+
                this.start = function(step) {
+
                    index = this.steps.length;
+
                    ref = {
+
                        'step': step,
+
                        'elem': step.elem(this, index),
+
                        'option': undefined
+
                    };
+
                    this.steps.push(ref);
+
                    this.elem.append(ref.elem);
+
                };
+
            };
+
 
+
            $(document).ready(function(){
+
                q = new quiz('#cam-quiz');
+
 
+
                step0 = new q.step("You have developed a new product, complete with design files, source code and documentation.", {
+
                    1: "Proceed"
+
                });
+
                step1 = new q.step("Do you want to release your product for others to remix and customize?", {
+
                    0: "no",
+
                    1: "yes"
+
                });
+
                step2a = new q.step("Do you want complete legal control over your product at all times and to prevent derivatisation?", {
+
                    0: "no",
+
                    1: "yes"
+
                });
+
                step2b = new q.step("Do you want to have the option to legally impose conditions such as attribution?", {
+
                    0: "no",
+
                    1: "yes"
+
                });
+
                step3a = new q.step("Do you want to commercialise your product and make it proprietary?", {
+
                    0: "no",
+
                    1: "yes"
+
                });
+
                step3b = new q.step("Do you want to allow for proprietary derivatives being made from your designs?", {
+
                    0: "no",
+
                    1: "yes"
+
                });
+
                step3c = new q.step("Your product could be released under the CCO 'No Rights Reserved' License, or even unlicensed.", {
+
                    1: "Learn more"
+
                });
+
                step4a = new q.step("Your product could be released under standard commercial license.", {
+
                    1: "OK"
+
                });
+
                step4b = new q.step("Your product could be released under a CC NonCommercial - NoDerivs license.", {
+
                    1: "OK"
+
                });
+
                step4c = new q.step("A Permissive license is most appropriate for your product.", {
+
                    1: "OK"
+
                });
+
                step4d = new q.step("A Copyleft license is most appropriate for your product. This can be general or hardware-specific.", {
+
                    0: "General",
+
                    1: "Hardware-specific"
+
                });
+
                step5a = new q.step("Examples of Permissive licenses include: BSD, MIT and CC Attribution.", {
+
                    1: "Learn more"
+
                });
+
                step5b = new q.step("Learn more about the hardware-specific Copyleft options:", {
+
                    0: "CERN OHL (more widely used)",
+
                    1: "TAPR OHL"
+
                });
+
                step5c = new q.step("Learn more about the general Copyleft options:", {
+
                    0: "GNU GPL (software license)",
+
                    1: "Viral licenses,, eg. CC Attribution - ShareAlike licenses"
+
                });
+
                step5d = new q.step("Your product is no longer open-source hardware (OSH), and should not be labelled as such.", {
+
                    1: "Learn more about OSH"
+
                });
+
 
+
final3c = function(options) {
+
      window.location.href="#CC0";
+
      return $('<h3>').text('You are being redirected to the page with information about the CC0 license.')
+
}
+
 
+
final5a = function(options) {
+
      window.location.href="#permissive";
+
      return $('<h3>').text('You are being redirected to the page with information about Permissive licenses.')
+
}
+
 
+
final5b0 = function(options) {
+
      window.location.href="#CERN";
+
      return $('<h3>').text('You are being redirected to the page with information about the CERN OHL.')
+
}
+
 
+
final5b1 = function(options) {
+
      window.location.href="#TAPR";
+
      return $('<h3>').text('You are being redirected to the page with information about the TAPR OHL.')
+
}
+
 
+
final5c0 = function(options) {
+
      window.location.href="#GNU";
+
      return $('<h3>').text('You are being redirected to the page with information about the GNU GPL.')
+
}
+
 
+
final5c1 = function(options) {
+
      window.location.href="#viral";
+
      return $('<h3>').text('You are being redirected to the page with information about viral licenses.')
+
}
+
 
+
final5d = function(options) {
+
      window.location.href="#OSH";
+
      return $('<h3>').text('You are being redirected to the page with information about OSH.')
+
}
+
 
+
                step0.bind(step1, [1]);
+
                step1.bind(step2a, [0]);
+
                step1.bind(step2b, [1]);
+
                step2a.bind(step2b, [0]);
+
                step2a.bind(step3a, [1]);
+
                step2b.bind(step3c, [0]);
+
                step2b.bind(step3b, [1]);
+
                step3a.bind(step4b, [0]);
+
                step3a.bind(step4a, [1]);
+
                step3b.bind(step4d, [0]);
+
                step3b.bind(step4c, [1]);
+
                step3c.bind(final3c, [1]);
+
                step4a.bind(step5d, [1]);
+
                step4b.bind(step5d, [1]);               
+
                step4c.bind(step5a, [1]);
+
                step4d.bind(step5c, [0]);
+
                step4d.bind(step5b, [1]);
+
                step5a.bind(final5a, [1]);
+
                step5b.bind(final5b0, [0]);
+
                step5b.bind(final5b1, [1]);
+
                step5c.bind(final5c0, [0]);
+
                step5c.bind(final5c1, [1]);
+
                step5d.bind(final5d, [1]);
+
+
                q.start(step0);
+
            });
+
 
+
         </script>
+
 
+
    <section>
+
<div style="width: 80%; margin: 30px 50px;color:#000;min-height:0px">
+
<h2> Find the License for your Project </h2>
+
        <div id="cam-quiz" style="width: 80%; margin: 30px 50px">
+
</div></div>
+
    </section>
+
 
+
 
+
<section style="background-color:#ababab" id="CC0">
+
<div class="slide">
+
<div style="width: 80%; margin: 30px 50px;color:#000;min-height:0px">
+
<h2> CC0 </h2>
+
</div></div></section>
+
 
+
<section style="background-color:#12a34b" id="permissive">
+
<div class="slide">
+
<div style="width: 80%; margin: 30px 50px;color:#000;min-height:0px">
+
<h2> Permissive Licenses </h2>
+
</div></div></section>
+
 
+
<section style="background-color:#ababab" id="CERN">
+
<div class="slide">
+
<div style="width: 80%; margin: 30px 50px;color:#000;min-height:0px">
+
<h2> CERN OHL </h2>
+
</div></div></section>
+
 
+
<section style="background-color:#12a34b" id="TAPR">
+
<div class="slide">
+
<div style="width: 80%; margin: 30px 50px;color:#000;min-height:0px">
+
<h2> TAPR OHL </h2>
+
</div></div></section>
+
 
+
 
+
<section style="background-color:#ababab" id="GNU">
+
<div class="slide">
+
<div style="width: 80%; margin: 30px 50px;color:#000;min-height:0px">
+
<h2> GNU GPL </h2>
+
</div></div></section>
+
 
+
<section style="background-color:#12a34b" id="viral">
+
<div class="slide">
+
<div style="width: 80%; margin: 30px 50px;color:#000;min-height:0px">
+
<h2> Viral Licenses </h2>
+
</div></div></section>
+
  
<section style="background-color:#12a34b" id="OSH">
 
<div class="slide">
 
<div style="width: 80%; margin: 30px 50px;color:#000;min-height:0px">
 
<h2> Open Source Hardware </h2>
 
</div></div></section>
 
  
 
</html>
 
</html>
 
{{:Team:Cambridge-JIC/Templates/Footer}}
 
{{:Team:Cambridge-JIC/Templates/Footer}}

Latest revision as of 00:08, 19 September 2015

Our survey on the public perception of Synthetic Biology suggested communicating research was a challenge

By organising workshops for school students, we increased awareness of its potential benefits for future generations

We introduced students to programming and modern microscopy techniques, taking them beyond the school syllabus

Developing hardware brings with it issues of licensing, patent and copyright

From our experience, navigating the legal jargon and complex procedures can be prohibitively time-consuming

For iGEM teams
looking to release Open Source Hardware, we have made an interactive guide to use as a starting point

The William and Mary iGEM team are using GFP in the Interlab Measurement study

The Glasgow iGEM team are using GFP and RFP to make bioluminescent bacteria

Collaboration meant confirming the expression of their fluorescent proteins while testing OpenScope's capabilities

A map of our entire wiki, in case you can't find what you're looking for

Some advice for future iGEM teams on making a wiki