Difference between revisions of "Team:McMaster/Game"

 
(2 intermediate revisions by one other user not shown)
Line 11: Line 11:
  
 
     <h2 style="color: #f2f0f0;">NGS Game — Drylab-Human Practices Collaboration Project</h2>
 
     <h2 style="color: #f2f0f0;">NGS Game — Drylab-Human Practices Collaboration Project</h2>
 +
 +
      <!-- Centered Image 0 -->
 +
    <center><a href = "https://umasehs.github.io/ngs-game/"> <img width = 850px src="https://static.igem.org/mediawiki/2018/9/9b/T--McMaster--Game0.png"></a></center>
 
     <p><span style="color: #f2f0f0;">Drylab team collaborated with the Human Practices team to develop games, that would explain the steps in the Next Generation Sequencing (NGS) process. Meetings with the human practices team helped determine pre-existing games that are analogous to the steps in the NGS process. Using open source software as prototypes to the games, the three games (Fragmentation, Bridge Amplification and Assembly) were developed.</span></p>
 
     <p><span style="color: #f2f0f0;">Drylab team collaborated with the Human Practices team to develop games, that would explain the steps in the Next Generation Sequencing (NGS) process. Meetings with the human practices team helped determine pre-existing games that are analogous to the steps in the NGS process. Using open source software as prototypes to the games, the three games (Fragmentation, Bridge Amplification and Assembly) were developed.</span></p>
  
Line 46: Line 49:
 
     <center><img src="https://static.igem.org/mediawiki/2018/d/da/T--McMaster--Game5.png"></center>  
 
     <center><img src="https://static.igem.org/mediawiki/2018/d/da/T--McMaster--Game5.png"></center>  
  
−
     </br><p><span style="color: #f2f0f0;">The following image is the options page. </span></p></br>
+
     </br></br><p><span style="color: #f2f0f0;">The following image is the options page. </span></p></br></br>
  
 
     <!-- Centered Image 6 -->
 
     <!-- Centered Image 6 -->
Line 57: Line 60:
 
     <center><img width = 850px src="https://static.igem.org/mediawiki/2018/7/7b/T--McMaster--Game7.png"></center> </br>
 
     <center><img width = 850px src="https://static.igem.org/mediawiki/2018/7/7b/T--McMaster--Game7.png"></center> </br>
 
     <!-- Centered Image 8 -->
 
     <!-- Centered Image 8 -->
−
     <center><img width = 850px src="https://static.igem.org/mediawiki/2018/8/89/T--McMaster--Game8.png"></center>  
+
     <center><img width = 850px src="https://static.igem.org/mediawiki/2018/8/89/T--McMaster--Game8.png"></center> </br>
  
 
     </br><p><span style="color: #f2f0f0;">The introduction of each game explains a step of NGS and how to play the game.</span></p>
 
     </br><p><span style="color: #f2f0f0;">The introduction of each game explains a step of NGS and how to play the game.</span></p>

Latest revision as of 03:33, 18 October 2018

NGS Game — Drylab-Human Practices Collaboration Project

Drylab team collaborated with the Human Practices team to develop games, that would explain the steps in the Next Generation Sequencing (NGS) process. Meetings with the human practices team helped determine pre-existing games that are analogous to the steps in the NGS process. Using open source software as prototypes to the games, the three games (Fragmentation, Bridge Amplification and Assembly) were developed.

Fragmentation



The above image shows the starting page of the game.


Fragmentation is analogous to fruit ninja game. In order to score points, the green DNA has to be sliced. The game ends when a red DNA is sliced. Failing to slice the green DNA will result in a loss of lives and each trial has 3 lives. Loss of all three lives will also result in the end of the game.


The game was developed by referencing  the fruit ninja game[1]. The green and red objects of the game were altered  to graphics of DNA molecules. The sizes of these images were adjusted to fit the graphics on screen. High score and cumulative score were added to the game. High score is the score for the current game. Cumulative score is the score across all the games. Music and sound effects from a royalty free website [2] were also added to the game using audio methods in phaser.


The following image shows the end screen of the game with the scores obtained in the game.



Bridge Amplification



The above image is the start screen of the Bridge Amplification game.


This game is similar to knife throw. Clicking the DNA molecule at the bottom of the screen shoots it to a rotating plate with DNA primers. To score points, the DNA should not superimpose another DNA.  Overlay of two DNA molecules on the plate ends the game.


This game was developed by referencing a knife throw game[3]. The graphics of the knife and plate were changed to DNA and rotating plates of primer respectively. The sizes of images were adjusted. Scoring for this game is similar to the fragmentation game.


The following image is how the game looks while playing.


Post Production

After producing the games, a HTML script was written to link the games together. The script has a home screen, options page that links all the games together.


The following image is the home screen.




The following image is the options page.




Title cards and an introduction to each game were also added to the script.


The following images show the title card and the introduction of the fragmentation game.





The introduction of each game explains a step of NGS and how to play the game.


References to the game and music


[1] https://codepen.io/labdev/pen/sCAKe


[2] www.bensound.com


[3] https://www.emanueleferonato.com