Ibrahim Mohammed Portfolio - Little Learners School

Work

Little Learners School Responsive Website

Role: UX/UI Designer & Researcher

Client: Little Learners Academy

Project Type: School Landing Page Design

Goal: To create an engaging, user-friendly, and visually appealing landing page that reflects the values of Little Learners Academy, attracts parents, and encourages inquiries or enrolment.Target Audience: Parents of young children (ages 2–6), educators, and caregivers.

Timeline: 3 Weeks

Introduction

Little Learners Academy is an early education institution that provides a nurturing and engaging learning environment for young children. The goal of this project was to design a compelling and user-friendly landing page that effectively communicates theschool's values, offerings, and enrollment process.

Problem Statement

Parents searching for quality early education often struggle to find a website that provides clear information about the school, its curriculum, and the enrolment process. The challenge was to design a landing page that is visually appealing, informative, and easy to navigate.

Parent Interviews 👥

Objective 🌟

To gain insight into what information parents prioritise when choosing a preschool and understand their pain points when navigating educational websites.

Methodology 💫

Conducted 7 structured interviews with parents of preschool-age children.
Questions focused on what they look for in a preschool, how they research schools online, and their frustrations with existing school websites..

Key Findings 🔍

93% of parents want clear and easily accessible enrolment information.
87% of parents prefer websites with a warm, child-friendly design.
80% of parents find it frustrating when websites lack mobile responsiveness.
76% of parents value authentic testimonials and parent reviews.
68% of parents appreciate having a virtual tour or video walkthrough of the school.

Competitor Websites 📱

Objective 🌟

To analyze the websites of other early education institutions and identify industry best practices and areas for improvement.

Methodology 💫

Selected and reviewed five competitor websites based on their reputation and search ranking.
Evaluated them based on design, user experience, accessibility, and information clarity.
Noted standout features and common issues.
The Competitor Websites Analyzed include Montessori Academy (www.montessoriacademy.com), Bright Horizons (www.brighthorizons.com), Kiddie Academy (www.kiddieacademy.com), Primrose Schools (www.primroseschools.com), The Goddard School (www.goddardschool.com)

Key Findings 🔍

100% of the competitor websites had a hero image with a tagline but varied in clarity and impact.
90% included a clear CTA for scheduling a tour, which was effective in engaging users.
75% had mobile-responsive designs, but some struggled with slow load times.
70% featured a blog or resources for parents, adding extra value.
60% provided a virtual tour, which was highly appreciated by parents in our interviews..

Low Fidelity Sketches ✏️

I started with rough sketches to establish the layout and information hierarchy. The goal was to ensure a seamless user journey from discovery to action.

Sitemap ✎

A UI sitemap, or user experience (UX) sitemap, is a diagram that shows how the pages on a website are related to each other. It'salso known as an information architecture (IA) diagram or content outline.

Color Styles 🎨

The primary color used was #FF8D4C, a warm and inviting orange that evokes feelings of friendliness, energy, and enthusiasm—ideal for a children's educational platform.

Typography 🖍

The fonts used were Raleway and Outfit, both modern and highly readable.

Raleway was chosen for headings due to its clean, elegant, and slightly playful nature, making it ideal for educational branding.
Outfit was used for body text, ensuring clarity and readability across all screen sizes.

Icon Style 🖍

All icons used are from Huge Icons Pro Plugin on Figma

Scroll inside the screens

Home Page

Final Testing 👥

Objective 🌟

To evaluate the final landing page design’s effectiveness in terms of usability, accessibility, and user engagement.

Methodology 💫

Conducted tests with about 11 parents

Key Findings 🔍

CTA Placement Impact: The version with the CTA placed in the hero section saw a 35% increase in click-through rate.
Navigation Behaviour: 88% of parents easily found the enrolment section, while 12% required additional guidance.
Visual Appeal: 90% of parents found the design visually engaging and aligned with their expectations
User Engagement: The average time spent on the landing page increased by 22%, indicating improved content engagement.

Reflection ✨

The final design successfully delivers an intuitive and engaging landing page that aligns with parents’ needs. By prioritizing clarity, accessibility, and aesthetics, the Little Learners Academy landing page effectively guides visitors toward learning more about the school and taking action.

More Case Studies

Deema & Co Jewellery App

Jewellery Shopping App

Thrive Dietician Web App

Healthcare

Creque Mobile App

Fintech

Agency Website Template

Agency