Walmart Education
Client: Knight Studios
Role: Front-end / interactive developer (solo)
Duration: 22 days
Outcome: Engaging interactive presentation visualising employee education data
Overview
Developed an interactive presentation for Walmart showcasing how their education program supports employees. The project required combining map-based data, animated charts, and slide-by-slide storytelling into a full-screen, infographic-style experience.
Data for the presentation was entered into a WordPress backend and served as JSON to D3.js, which rendered state-by-state maps and charts.
Responsibilities & Solution
Built full-screen, slide-by-slide navigation using Fullpage.js
Controlled animations with GSAP ScrollTrigger and custom JS for charts
Managed layout challenges: ensured all elements fit within one screen for most viewports using careful absolute positioning and max-size constraints
Optimised mobile experience by disabling full-page slides for smaller screens, while maintaining readability and interactivity
Developed chapter navigation synced with GSAP animations, including animation reset per slide
Delivered polished, interactive experience with high performance across desktop and tablet
Outcome
- Successfully communicated complex data in a visually engaging way
- Responsive, performant experience on desktop and tablet
- Full-page infographic format enabled clear storytelling of educational program metrics