Letter Ninja
Ontario Engineering Competition - First Place
React.js
Remix
TypeScript
JavaScript
shadcn-ui
Front-End Development
Hackathon
CONTEXT
Attention on the Decline, Dysgraphia on the Rise.
In a post-pandemic world, children are struggling to adjust to a changing classroom environment. With the onset of digital learning tools, young students are beginning to neglect their core motor skills in handwriting when in fact, this skill remains ever important in the real world. This problem is compounded by learning disabilities; presently, 1 in 3 children experience difficulty in writing, which often coincides with dysgraphia. But how can one address the monotony in handwriting with consideration for diminished attention span among youth?
PROPOSED SOLUTION
A Fun Way to Train.
Letter Ninja is an accessible web-based learning experience that plays on the strengths of engaging and repeatable mobile gameplay. Letter Ninja challenges the user to recreate sequences of letters with precision and speed. Compared to traditional tracing books, it brings upon a layer of interactivity and competition with timed challenges and high scores.
IMPLEMENTATION OVERVIEW
A Web Game to Rival CoolMathGames.
Letter Ninja offers a comprehensive GUI that allows for a customizable learning experience. On its central page, users can track their current performance and aim to achieve new high scores. Upon starting a match, waves of letters will appear in random locations on the canvas for the user to trace, and these traces are scored based on their accuracy. New letters will continue to spawn so long as the user continues to trace them out, making the speed of the trace ever important. Letter Ninja can also be tailored to the needs of any user. Using the focus letters input field, the range of letters can be defined to help the user practice the letters they struggle with most.
SCORING ALGORITHM
Precision is Key.
Letter Ninja utilizes a custom scoring algorithm to determine the scores of a match. As the React Canvas used for the project keeps track of drawings using an array of points, we track each point drawn and find the least squared distance to any point on the ideal letter displayed on the screen. By then averaging these distances and square rooting it, we can find the standard deviation of a given drawn point to the ideal point. This must be done in reverse too, comparing the standard deviation from the ideal letter to the drawn line, to prevent players from scoring high by just drawing a single point on the ideal letter rather than tracing the entire letter. Finally, these two deviations are averaged out and can then be scaled and inverted for a score.
The overall accuracy score is determined by scaling the list of drawings on a sigmoid curve. This is done to prevent large outliers from having an excessive effect on the overall accuracy. These considerations were ultimately put in place to allow for a satisfying and rewarding gameplay experience for young students to see their progress firsthand.
FINAL THOUGHTS
Overcome your Struggles before you Know it.
With the release of Letter Ninja, we hope to make the challenge of overcoming dysgraphia more enjoyable and motivating to students of a younger demographic. Referencing the success of classics such as Brain Age, we believe that there is great value in convincing the youth to learn without realizing they are being taught.
CREATED BY DAVID TAM
LONDON, ON, CANADA