|
|
| Line 12: |
Line 12: |
| | | | |
| | <div class="section"> | | <div class="section"> |
| − | <div class="container header" id="icon-a-thon"> | + | <div class="container header" id="cyan"> |
| − | <h1>Icon-a-thon</h1> | + | <h1>Podcast // Synversations</h1> |
| | </div> | | </div> |
| | </div> | | </div> |
| Line 21: |
Line 21: |
| | | | |
| | <!-- Subsection 1 --> | | <!-- Subsection 1 --> |
| − |
| |
| | <div id="content-cyan" class="subsection"> | | <div id="content-cyan" class="subsection"> |
| − | <h2 class="text-cyan">Icon-a-thon Need subsections</h2> | + | <h2 class="text-cyan">Our Goal</h2> |
| | | | |
| − | <p>In the initial stages of our 2017 project development we noticed gaps in our communications due to the interdisciplinary nature of our team. This is especially true with more specialized information such as the methods and processes of biotechnology. When looking for scientific visual communication aids in open source icon repositories, we noticed that there were very polar representations in concepts such as “gene editing” and “biotechnology;” These would be represented as either research oriented SBOL icons, or oversimplified illustrations of a double helix.</p> | + | <p>Some text</p> |
| | + | </div> |
| | + | <!-- Subsection 1 END--> |
| | | | |
| − | <p>By realizing this problem, we saw a significant need to explore various methods of scientific communication. This would not only benefit our internal project development, but could also have benefits in understanding how the general public engages with biotechnology. Our team developed a unique way to teach and spread the basics of biotechnology and to assist industry professionals and researchers. We did this by tackling the shortage of icons related to biotechnology in icon repositories such as Font Awesome and the Noun Project by holding an Icon-a-thon in the style of popular Hackathons.</p>
| |
| | | | |
| − | <p> During the summer of 2017 we held Icon-a-thon, spending an afternoon with our wet lab team and early education practitioners, UI designers, game developers, illustrators and students sketching out ideas with paper and marker. In our collection of icons, you can see an array of concepts that range from being purely symbolic, to more literal representations. Some designs even pull characteristics from the practice of game design and illustration by personifying organisms, and even referencing pop culture.</p>
| + | <!-- Subsection 2 --> |
| | + | <div id="content-cyan" class="subsection"> |
| | + | <h2 class="text-cyan">Episode 1: Introduction</h2> |
| | | | |
| − | <p>On the day of the event we paired up scientists and creatives to create accurate and aesthetically pleasing icons. Nearly half of the Icon-a-thon participants had indicated that they had a minimal background in postsecondary biology so we began the event with a crash course in biotechnology. Armed with some basic knowledge and paired with scientists we gave participants a list of basic icons related to biotech topics and tools absent from icon repositories specifically related to CRISPR and anti-CRISPR technology such as “model organisms” and “ATPsynthase.”</p> | + | <p>Some text about the podcast</p> |
| | | | |
| − | <p>The final icons created by the pairs were fairly accurate and showcased unique, shorthand ways of clarifying complicated topics . This level of synthesis demonstrated the knowledge of biotechnology these creatives had attained over the course of this event. At the end of the event, those who participated in a detailed survey indicated a high level of engagement and learning as a result of this event. This event was a unique way to attract a scientifically untrained public and proved to be worth it both in terms of engaging the public and educating them in the basics of biotechnology.</p> | + | <!-- podcast ep audio player --> |
| | + | <div class="audio audio-player"> |
| | + | <div class="loading"> |
| | + | <div class="spinner"></div> |
| | + | </div> |
| | + | <div class="play-pause-btn"> |
| | + | <svg xmlns="http://www.w3.org/2000/svg" width="18" height="24" viewbox="0 0 18 24"> |
| | + | <path id="playPause" fill="#566574" fill-rule="evenodd" d="M18 12L0 24V0" class="play-pause-icon"></path> |
| | + | </svg> |
| | + | </div> |
| | + | <div class="controls"><span class="current-time">0:00</span> |
| | + | <div data-direction="horizontal" class="slider"> |
| | + | <div class="progress"> |
| | + | <div id="progress-pin" data-method="rewind" class="pin"></div> |
| | + | </div> |
| | + | </div><span class="total-time">0:00</span> |
| | + | </div> |
| | + | <div class="volume"> |
| | + | <div class="volume-btn"> |
| | + | <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24"> |
| | + | <path id="speaker" fill="#566574" fill-rule="evenodd" d="M14.667 0v2.747c3.853 1.146 6.666 4.72 6.666 8.946 0 4.227-2.813 7.787-6.666 8.934v2.76C20 22.173 24 17.4 24 11.693 24 5.987 20 1.213 14.667 0zM18 11.693c0-2.36-1.333-4.386-3.333-5.373v10.707c2-.947 3.333-2.987 3.333-5.334zm-18-4v8h5.333L12 22.36V1.027L5.333 7.693H0z"></path> |
| | + | </svg> |
| | + | </div> |
| | + | <div class="volume-controls hidden"> |
| | + | <div data-direction="vertical" class="slider"> |
| | + | <div class="progress"> |
| | + | <div id="volume-pin" data-method="changeVolume" class="pin"></div> |
| | + | </div> |
| | + | </div> |
| | + | </div> |
| | + | </div> |
| | + | <audio> |
| | + | <source src="https://static.igem.org/mediawiki/2017/9/93/T--Toronto--Podcast-ep1-intro.mp3" type="audio/mpeg"> |
| | + | </audio> |
| | + | </div> |
| | + | <!-- podcast ep audio player END--> |
| | | | |
| − | <p>After a popular vote within iGEM Toronto the top three icons were #46 Quorum Sensing in third place, #9 Central Dogma in second, and in first place #45 ATP Synthase. We asked one of the winners, Vera Spicki, to write a little bit about her inspiration for Central Dogma-</p>
| + | </div> |
| | + | <!-- Subsection 2 END--> |
| | | | |
| − | <blockquote class="regular">“One of the main challenges of this competition was to create icons that could act as a standard for biology (just like the letter icons are a standard for email in Web applications). Thus the main inspiration behind my ‘Central Dogma’ icon is ease of understanding for the general public. As most people in a biology profession know, the central dogma describes the two step process which is responsible for the flow of genetic information from DNA to RNA in order to create a protein. Similar to a process arrow diagram, by representing each different state in the same body, I hope to convey the proper order of these processes (transcription first, translation next). Additionally I hoped that this simplified design would provoke recognition in both biologists and non-biologists alike and have them chanting the central dogma mantra: ‘DNA to RNA to protein!’”</blockquote>
| |
| | | | |
| − | <p>If you’re interested in setting up your own Icon-a-thon, we recommend populating a list of concepts ahead of time and using paper and marker as the recommended medium to sketch out ideas. Using markers and paper eliminates the barriers of learning graphic design software, and can help creative more inclusive and collaborative environments between researchers and creatives.</p>
| + | <!-- Subsection 3 --> |
| − | </div> | + | <div id="content-cyan" class="subsection"> |
| | + | <h2 class="text-cyan">Our Goal</h2> |
| | | | |
| | + | <p>Some text</p> |
| | + | </div> |
| | + | <!-- Subsection 3 END--> |
| | | | |
| | <!-- Subsection : Reference --> | | <!-- Subsection : Reference --> |
