Telling Time

May 2019

The Unit11 team initially designed and created this app before the company employed me. The team developed it using standard web technologies and Cordova to allow for cross-platform mobile development.

RobbResearch Ltd assigned me to recreate them using the Unity engine after NetEase's education subsidiary Youdao selected these apps for release in the Chinese app market.

I fundamentally rewrote the structure and code of these apps for the Unity version, leaving the artwork and audio mostly unchanged. As Apple hadn't released higher resolution devices at the original publication time, I did need to replace some low-resolution artwork. I designed the improved art to match the look of the original where possible.

Telling Time is an app developed for young children to learn the essential skill of telling the time by covering all of the fundamental learning phases. It employs repetition to ensure the child's ability and provide the child with plenty of training.

I implemented my Modular Framework for Unity which served as the structural base of the app. One of the key challenges with this app was designing a system for anchoring drag-and-drop elements used extensively to rotate the clock hands.

The player can select which category of time they'd like to practice and then choose between three different game modes. A star is awarded on the selection screen when the player has completed that combination of category and game mode.

I started development by creating a modular clock face that could be updated programmatically by sending hour and minute variables. This system helped implement the three different game modes and kept the clock behaviour consistent across the app. I added this modular clock face to the main menu and updated it with the real-time on the device.

I created a modular question display system to represent the total amount of questions, current question and validation result of previous rounds. The horizontal panel has a variable question count which accepts three sprites; unanswered, correct and incorrect. It populates the panel with objects using the unanswered sprite when a round is loading, and the current object sprite is updated when a question in answered to reflect if they were correct or not.

The first game mode presents the user with a multiple-choice selection of clock faces and time in their chosen category. The user needs to tap the clock face, representing the time shown in the middle of the screen per round.

Level parameters are stored in JSON. This level structure meant that generic scenes could be populated with different graphics and objectives and repeated throughout the app.

The second game mode works in reverse by showing one clock face as the question and giving three possible answers. The user needs to identify which time the clock face shows and tap the appropriate button per round.

Each clock face instance accepts an hour and minute parameter, enabling their use throughout the app. Clock faces store their current hour and minute variables and can be validated against another clock face or hour and minute combination.

The final game mode gives the user a specific time to set the clock face to; the user can then drag the hour and second hands to the correct numbers. The system displays the current number that the clock hand faces in the middle of the clock face for ease of use. Once the user is happy with their choices, they can submit it for validation.