Hatch

Teaching kids and teens how to code & understand engineering concepts

Role

Branding
UX/UI

Deliverables

Visual Identity, Wireframes, Hi-fidelity screens

Platforms

Web

Hatch

Hatch Coding came to us to refresh their existing product, Coding Studio, as well as their new featured product, Science Studio. Both help teach kids about coding and engineering in fun & engaging ways.

Image displaying Hatch project
Image displaying Hatch project

Science Studio takes students through a series of engineering concepts, and gives players of all ages different areas to explore a single concept in a myriad of different ways, from simple game play or quizzes, all the way to coding exercises that range from absolute beginner to advanced.

Bringing the Science Studio interface to life, we focused on introducing the bright and playful color palette, lots of rounded corners and shapes & a streak system that kept players engaged.

Image displaying Hatch project

In addition to the streak system, we wanted to find a new way to keep players engaged at all levels, throughout the long process of completing all 60+ activities. We threaded in the story of a robot who damaged his brain in an accident. Earning XP helps re-build the robot’s brain, chip by chip, levelling up.

Image displaying Hatch project
Image displaying Hatch project

For more advanced students, or even beginners in the earliest stages of learning to code, is the one of a kind interface that guides users through exercises with a supportive system that allows them to level up at their own pace, and seek support when things are challenging.

Image displaying Hatch project

We have a blast working on products that educate and support younger generations, especially when they make learning fun.