Eye Gate School – Landing Page & Web Presence: Bringing a modern voice to education online
A modern, performance-driven website built for Eye Gate School, aligning digital presence with educational excellence and engaging prospective families.
Duration
June 2025 – July 2025
Technologies
React, JavaScript, Tailwind CSS, Git & GitHub, Google Fonts
Project Overview
Eye Gate School is a dynamic private school in Lagos, offering nursery, primary and secondary education. I designed and built a fully responsive landing site to showcase their programs, admissions process, and campus environment. The goal was to create an accessible, engaging web presence to attract and inform prospective students and parents.
Challenges and Solutions
Ensuring Mobile-First Usability
The target audience was largely accessing via mobile phones in Nigeria, so we needed a layout and styles optimized for slower networks and small screens.
Crafting Fast-Loading Interfaces
High-resolution school imagery and multimedia threatened performance. We optimized assets, used lazy loading, and reduced unused code to keep load times low.
Maintaining Brand Authenticity
Translating existing school colors, fonts and tone into a web format required careful design choices to stay true while improving readability and user experience.
Accessibility & User Trust
Prospective parents expect inclusive and trustworthy sites. We added semantic HTML, accessible forms, and ensured contrast and navigation ease to boost confidence in the school’s digital presence.
Mobile-First CSS Strategy
Used Tailwind mobile-first classes, responsive utility spacing and font sizing with clamp() to ensure elegance and readability on any device.
Optimized Media Pipeline
Converted images to webp, preloaded hero assets, enabled responsive srcsets and used Next.js Image component to dramatically improve page speed.
Design Token Implementation
Mapped school branding into CSS variables and Tailwind config so typography and color remained consistent while enabling flexibility across modules.
Accessible & Trust-Focused UX
Built forms with ARIA labels, keyboard-friendly navigation and proper contrast ratios, resulting in an inclusive site for all users and increased trust for parents.
Key Features
Responsive All-Device Layout
Built the site to adapt seamlessly across mobile, tablet and desktop — delivering a consistent and beautiful experience for families on any device.
Clear Admissions Funnel
Developed intuitive UI flows for ‘Apply Now’, ‘Programs’, and ‘Contact’ sections, making it easy for parents to find key information and complete application steps.
Engaging Visual Storytelling
Created immersive hero banners and student-life imagery to reflect the school’s mission of nurturing global citizens, enhancing credibility and connection.
Performance-Optimized Pages
Used modern image formats, preloading and caching strategies to ensure fast load times even on mobile networks, reducing bounce rate.
Brand-Aligned Design System
Maintained consistent school branding — colors, typography and iconography — across the site, providing a cohesive and professional look.
Technologies Used
Sneak a Peek
Dashboard Overview: Interactive Traveller Dashboard
Dashboard Overview: Interactive Traveller Dashboard
Dashboard Overview: Interactive Traveller Dashboard
Results and Impact
- Delivered a responsive website that improved engagement from mobile visitors by over 50%.
- Reduced landing page load time to under 2 seconds on average through image and code optimization.
- Enabled the school leadership to manage admissions enquiries more effectively via built-in contact and application forms.