CodeQuest Gamified Learning

CodeQuest is a gamified education website that makes learning programming languages fun — with courses, tournaments and a blog. I led the project from branding and user flows to the design system, final UI and the admin side.

The challenge › Make learning to code feel like play, not a classroom — while staying easy to navigate.

Before designing anything, the problem was split into its parts:

1. I

   Brand — a bright, playful identity and characters

2. II

   Learning — courses and progress

3. III

   Play — tournaments and challenges

4. IV

   Admin — managing courses, users and content

1. I · Brand

   Created the brand direction: bold colour, gaming energy and friendly characters.

2. II · User flows

   Mapped flows for learners and for the admin side.

3. III · Design system & UI

   Built the design system and designed the website screens.

4. IV · Prototype & QA

   Prototyped and checked the build against the designs.