2 of 14

Goal and Motivation

Same as the previous semester:
Issue

Children want to learn how to code in text, but there are no sufficient tools for transitioning them from a block based system like Scratch, which many kids use as a first coding experience, to a higher level language like Python.

Solution

Produce a system of tutorials and hands on practice problems that can instruct children in Python from a block-based language baseline.
Include basic knowledge like data types, arrays, and loops alongside abstract knowledge like naming conventions, commenting, and consistency.

3 of 14

Approach

Key Features	Explanation
Teach the basic coding skills for kids in middle and high school.	By using in-depth and interactive tutorials the users should have an easy time learning both new and helpful programming practices as well as gaining experience in using text-based languages before beginning the coding activity.
Ability to code with blocks and text in the same program.	Transition between blocks and text in the same program gives the users more choice as they build confidence and gain a better understanding of both Python and text.
Interactive visuals to help the user “see” what the program is doing.	Create a grid world that the user can perform actions in, like “pick flowers” or “look at flower color”, to help show them what the code is doing. These actions also help the users learn to code by linking visuals to the more abstract coding concepts.

4 of 14

Novel Features

Most block-based languages are not based in a traditional text-based coding language so by linking out blocks closer to Python it should help users learn text-based coding faster.
User is able to use both blocks and text in the same program to help develop skills needed to transition to fully text-based coding.

5 of 14

Technical Challenges

Little experience in educational or tutorial writing in any manner.
Lack of experience in creating websites or using languages needed for web-based apps like HTML and CSS.
No experience in designing pleasant looking UIs.
No experience in designing a system to save a user’s code, their progress going through the tutorials, and other user authentication.

6 of 14

System Architecture Diagram

7 of 14

Evaluation

Track the time it takes for a user to read through the tutorials and complete the try-it sections.
Measure the user’s accuracy in the try-it sections
Survey the users to get their opinion on the UI of the application, ease of use, and the quality of the tutorials.
Plan to recruit users by asking local middle schools if they would be willing to participate in the evaluation process.

8 of 14

Progress Summary

Module / Feature	Completion %	To Do
Web Page UI	50%	Update the web pages to be more pleasant looking and of a higher quality.
Tutorial’s text based information	20%	Only really done work on Branching Tutorials, need to expand a lot for other sections of coding concepts.
Tutorial’s Try-It Sections	10%	Expand “try-it” sections to our other tutorials and get the grid world implemented in the “try-it” sections
Grid World Visuals	80%	Need to update the visuals to make sure all the textures are of a consistent quality and easy to understand.
Grid World Animations.	75%	Adding more animations would be good to make the grid world more engaging but it is very costly in development time.

9 of 14

Progress Summary

Module / Feature	Completion %	To Do
Blocks for Coding Concepts	99%	Need to implement comment blocks and a couple of more relational blocks.
Blocks for Grid World Interaction	20%	We only have the movement blocks, and the picking one flower block fully finished while there are a lot more to implement to give the user sufficient interactive capabilities.
Coding with Text and Blocks	0%	Should be fast to implement.
Displaying the Python program created from the blocks in real time.	0%	Should be fast to implement.

10 of 14

Progress Summary

Module / Feature	Completion %	To Do
Saving and Loading the User’s Work	80%	The actual saving and loading section is completed it just needs user authentication to be completed so it can determine the difference between users and a way for the users to see what files they have saved on the server.
User Authentication	0%	Everything.

11 of 14

Milestone 4

Redesign the UI of the application to make it more visually appealing for middle to high school aged kids.
Begin adding in the evaluation tools, timers, surveys, and a way to collate the data.
Finish implementing a lot of the grid world related blocks like “Checking if you are facing a flower” and “Check Flower Color”. We would also like to implement blocks like “Check for Snake (enemy)”, “Collect Treasure”, and “Collect Berries”.
Move on to other tutorials, looping.
Create a consistent visual for the gridworld as currently the character you control and the flowers do not match visually. Find a suitable replacement for the character.
Implement hybrid mode where the user can do block and text programming in the same piece of code.

12 of 14

Milestone 5

Continue to work on writing and improving the tutorials along with their try-it sections.
Add more grid world specific blocks to allow for more in depth interaction.
Complete the rudimentary code saving system and user authentication system.
Users are able to code with just blocks, hybrid blocks and text, and just text.
Fix any issues with the Evaluation system and work on improving Results
Create poster for Senior Design Showcase

13 of 14

Milestone 6

Finish the last tutorials.
Finish any blocks that haven’t been completed yet.
Search for bugs and other issues in the code.
Clean up any coding artifacts left over from the previous milestones.
Make sure all arithmetic (+, -, /, *, decrement, increment, modulus), relational (==, !=, <, <=, >, >=), and logical (and, or, not) operators are implemented.
Test/Demo of the entire system.
Fix any issues with the Evaluation system and work on improving Results
Create User/Developer Manual.
Create Demo Video.

1 of 14

2 of 14

3 of 14

4 of 14

5 of 14

6 of 14

7 of 14

8 of 14

9 of 14

10 of 14

11 of 14

12 of 14

13 of 14

14 of 14