Sugar Labs

Summer of Code/2016/Turtle Confusion/Flags JS: Difference between revisions

← Older editNewer edit →
Tag: visualeditor
Line 31: Line 31:


Turtle Confusion and Turtle Flags
Turtle Confusion and Turtle Flags
'''Describe your project in 10-20 sentences. What are you making? Who are you making it for, and why do they need it? What technologies (programming languages, etc.) will you be using?'''
'''Describe your project in 10-20 sentences. What are you making? Who are you making it for, and why do they need it? What technologies (programming languages, etc.) will you be using?'''


This project aims on porting two sugar activities Turtle Flags and Turtle Confusion to a Javascript based version. Also possible UI enhancements and additional features will be added to them under this project. These two activities help children build a mindset in coding and algorithms by setting up challenges based on drawing shapes and images in a logo like framework. I will be using web technologies like    
This project aims on porting two sugar activities Turtle Flags and Turtle Confusion to a Javascript based version. Also possible UI enhancements and additional features will be added to them under this project.  
I plan on working on this project using Javascript and frontend languages(HTML and CSS). The main functionalities (drawing canvas, block programming) I am going to use are from the turtle blocks JS project.
 
Each visual block will be mapped to a function in JavaScript. Also the generated Javascript code will be shown to kids to get idea of one to one correlation between blocks and functions.
These two activities help children build a mindset in coding and algorithms by setting up challenges based on drawing shapes and images in a logo like framework.   
 
I plan on working on this project using Javascript and frontend languages(HTML and CSS). The main functionalities (drawing canvas, block programming) I am going to use are from the turtle blocks JS project.
 
Each visual block will be mapped to a function in JavaScript. Also the generated Javascript code will be shown to kids to get idea of one to one correlation between blocks and functions.
 
Along with these I'll  be using Inkscape or any other similar tool to produce artworks to make the activities more interactive and attractive for children.   
Along with these I'll  be using Inkscape or any other similar tool to produce artworks to make the activities more interactive and attractive for children.   


Line 41: Line 47:


In my understanding this project requires the following main tasks which can be completed by using the given languages and frameworks:
In my understanding this project requires the following main tasks which can be completed by using the given languages and frameworks:
#Designing the overall architecture or main page module of the activity : Mainly using the web development languages like HTML,CSS and Javascript. Buildup will be on the basic Sugarizer design.
#Getting familiar with the resource book '''''Turtle Confusion: Logo Puzzles and Riddles by Barry Newell''.'''
#Designing the artworks to be used in the games and using the artworks available through various free sources and developing new ones using InkScape.
# Understanding the codebase of Turtle Blocks JS and the already built activities Turtle Flags and Turtle Confusion.
#Writing programs for the games explained above .  
#Designing the artworks to be used in the games and using the artworks available through various free sources and developing new ones using InkScape.
# Designing basic shells and UI to make these activities more illustrative and pedagogic.
#Writing code for the activities and implementation.  


Timeline -  
Timeline -  
Line 52: Line 60:
| April 22-May 22
| April 22-May 22
(Community Bonding period)
(Community Bonding period)
|* Discuss the ideas of the games in the community.  
|
 
*Community Bonding
*Consider possible enhancements and improvised ideas that are suggested.
* Understanding the code for Turtle Blocks JS and the already built activities.
 
* Study about the activities and check for faults that can be removed or features that can be added.  
*Produce and discuss about artworks for giving a common theme to the games. To make the games attractive and interesting for children. 
* Experiment with the code.
* Consider possible enhancements and improvised ideas that are suggested by taking to the mentors.  


*Implement a simple game like Motion Capture which comes in the Reasoning and Understanding Category. Share among the community for review.  
*Produce some illustrations and discuss about the theme of the activity. To make the activity more attractive and interesting for children. 


*Note possible improvements and UI changes depending on the review. So that rest of the games can be designed accordingly.
*Note possible improvements and UI changes depending on the review.


*Develop a clear outline of the project and discuss other technicalities relevant for the project.
*Develop a clear outline of the project and discuss other technicalities relevant for the project.
*Build the activity front-end part and make links to different game pages which will be kind of a subactivity containing game area and instructions for the particular game.
|-
|-
| Week 1 (May 23-May 29)
| Week 1 (May 23-May 29)
| Mental Maths Activity - Polygon Shower:
|  
*Add Tutorial Screen for Polygons at the start.
*
 
*Write the game activity in phaser. Use the artworks produced already, make new ones if required.
 
*Write blog and share the activity through a github page for reviews.
 
Start working on - Reasoning Game - Grammar Game
|-
|-
| Week 2 ( May 30 - June 5)
| Week 2 ( May 30 - June 5)
| Reasoning Game - Grammar Game:
*Writing code to generate random questions by using the basic  sprites(Pre-designed artworks) and question strings.
*Write blog and share the activity through a github page for reviews.
Start Quick Science Game - Quick Time
*Add illustrations with example given in the activity description on the start screen of the game.
|-
|-
| Week 3 (June 6 - June 12)
| Week 3 (June 6 - June 12)
| Finish working on Quick Time
| scdsaas
*Write the game activity in phaser. Write blog and share the activity through a github page for reviews.
 
Work on Memory Game - Flashing Numbers
 
*Write the game activity in phaser.
|-
|-
| Week 4 (June 13- June 20)
| Week 4 (June 13- June 20)
| Finish the code for Game Flashing Numbers.
|'''First Deliverable - Turtle Flags Activity for Sugarizer'''
*Write blog and share the activity through a github page for reviews.
 
'''First Deliverable - Learn for Fun activity with five different games (at least one game under each category)'''
 
Start working on Mental Maths Game - Compare to Conquer
 
Prepare the activity for mid-term Evaluations.
|-
|-
| Week 5 (Midterm Evaluations)
| Week 5 (Midterm Evaluations)
| Finish the code for Compare to Conquer.
*Share the game for review and write blog post.
Reasoning and understanding Game - Color Trio
*Work on the code for g.me
*Share the completed game and write blog post.


|-
|-
| Week 6 (June 29- July 3)
| Week 6 (June 29- July 3)
| Responding to Mid-Term Evaluations:
| Responding to Mid-Term Evaluations:
Going through the evaluations and improving activities and fixing bugs accordingly.
Going through the evaluations and improving activity and fixing bugs accordingly.
|-
|-
| Week 7 (July 4 - July 10)
| Week 7 (July 4 - July 10)
| Quick Science Game - Quick Temp
*Add illustrations with example given in the activity description on the start screen of the game.
*Write the game activity in phaser.
*Write blog and share the activity through a github page for reviews.
|-
|-
| Week 8 (July 11 - July 17)
| Week 8 (July 11 - July 17)
| Memory Game - Mind Math
| ♙df
 
*Write the game activity in phaser.
 
*Write blog and share the activity through a github page for Reviews.
|-
|-
| Week 9 (July 18 - July 24)
| Week 9 (July 18 - July 24)
| Mental Math Game - MasterMind
*Write the game activity in phaser..
*Write blog and share the activity through a github page for Reviews.
|-
|-
| Week 10 (July 25 - July 31)
| Week 10 (July 25 - July 31)
| Quick Science Game- Garden Walk
|'''Second Deliverable - Completed Activities Turtle Flags and Turtle '''
 
*Write the code for generating new random maps.
 
*Write blog and share the activity through a github page for Reviews.
'''Second Deliverable -Completed Learn for Fun activity with 11 games under four different categories.'''
|-
|-
| Week 11 (August 1 - August 7)
| Week 11 (August 1 - August 7)
Line 166: Line 118:
|}
|}


I also plan to implement Hindi Versions of the app using the webL10n if time permits during the project. If not then I plan on implementing them as separate work later. <br />
Other commitments during this period -
Other commitments during this period -


Line 193: Line 144:


My next semester will start from July 25 and as the workload is very less in the starting of the semester I think I can dedicate 7-8 hours daily in this duration (July 25 - August 23).
My next semester will start from July 25 and as the workload is very less in the starting of the semester I think I can dedicate 7-8 hours daily in this duration (July 25 - August 23).
I have also designed illustrations for a few games, to give a better idea -
<br />
Polygon Shower
<br />[[File:Drawing2.png]]
<br /><br />Color Trio
<br />[[File:Drawing3.png]]
<br /><br />Motion Capture
<br />[[File:Leaves.png]]
Retrieved from "https://wiki.sugarlabs.org/go/Summer_of_Code/2016/Turtle_Confusion/Flags_JS"