Grammagical Website

Project overview

Grammagical is an educational web platform designed to make grammar, phonics, and English learning engaging for primary school children. Built with a game-first approach, the platform transforms traditionally repetitive literacy exercises into interactive experiences that feel playful, rewarding, and accessible.

The project was created to support children aged approximately 4–9 years old (KS1/KS2), including early readers and children developing confidence in English and SPaG (Spelling, Punctuation and Grammar). The core focus was to create an experience that feels modern, intuitive, and genuinely enjoyable — bridging the gap between education and entertainment.

The website acts as both a marketing platform and a product showcase for the wider Grammagical ecosystem, introducing parents to the learning philosophy, gameplay approach, and subscription offering.

The primary goals of the website are to:

• Introduce the Grammagical brand and learning experience
• Clearly communicate the educational value of the platform to parents
• Showcase gameplay mechanics and interactive learning styles
• Encourage app downloads and subscriptions
• Build trust through polished UX, accessibility, and child-friendly design
• Position Grammagical as a modern alternative to traditional grammar learning tools

Features overview

Responsive Modern UI

• large touch-friendly UI elements
• accessible typography
• visual hierarchy
• animation and motion
• fast-loading page transitions

Interactive Product Showcase

• gameplay previews
• feature highlights
• visual walkthroughs
• educational messaging

Child-Friendly Brand Identity

• mascot integration (Wandy)
• playful typography choices
• colourful visual systems
• engaging illustrations and iconography

SEO & Performance Optimisation

• responsive image handling
• optimised layouts
• semantic structure
• mobile-first considerations
• scalable component architecture

How it works

1. 1

   Landing Experience

   Visitors are introduced to the Grammagical concept through strong visual branding, concise messaging, and educational positioning.

2. 2

   Feature Discovery

   Parents can explore how the learning games work, what age groups the platform supports, and the educational benefits provided.

3. 3

   Product Understanding

   Gameplay explanations and examples demonstrate how children interact with the app through listening, tapping, and problem-solving activities.

4. 4

   Trust Building

   The site reinforces ease of use, child accessibility, and consistent educational value through its design language and structured content flow.

5. 5

   Conversion Pathway

   Users are directed toward downloading or subscribing to the platform through clear calls-to-action integrated throughout the experience.

Impact

The final result is a polished educational product website that successfully combines engaging visual design, child-friendly interaction principles, modern frontend development, and clear educational communication.

The project demonstrates strengths across both development and product thinking — combining technical implementation with UX strategy, branding, and audience-focused design.