Built with Framer

Dodi International School – Full website redesign & CMS build

Bright

Bright Baiden

Dodi International School – Full website redesign & CMS build (Figma → Framer)

Overview

Dodi International School in Ghana offers a global curriculum from early years through upper secondary. Their old site was static and outdated; it didn’t reflect the school’s vibrant community, made admissions confusing and forced staff to rely on developers for updates. I designed the new experience in Figma and developed it in Framer, creating a modern, mobile-first site with clear pathways for academics, student life, admissions and news. A custom CMS lets staff update events, news/blog posts and career listings without technical help.

My Role

• UX/UI design and prototyping in Figma • Visual design and information architecture • Framer development (responsive build) • CMS integration for events, news and careers • Animation and micro-interaction design

Goals

• Position DIS as a world-class school and build trust with parents and students • Simplify navigation across academics, student life, admissions and events • Provide an interactive admissions process with clear calls to action and forms • Allow staff to easily update events, news/blogs and job openings via CMS • Ensure responsive, accessible design across devices

Challenges

• Large volume of content spanning programs, student life, admissions and events • Need to integrate video testimonials, sliders and overlays without affecting performance • Unifying design across dynamic events, news and careers while keeping navigation intuitive • Creating admissions forms and timelines that feel seamless on mobile and desktop • Enabling non-technical staff to publish events, news and job openings quickly

Solutions / Process

• Restructured navigation into clear sections: About, Academics, Student Life, Admissions and News & Events • Designed modern layouts in Figma with hero video, vibrant imagery and strong calls to action • Built a dynamic admissions timeline and tuition tabs; created an overlay inquiry form with multi-step fields • Added video testimonial modals for parents, students and teachers, plus sliders for after-school clubs and the house system • Integrated a load-more events list with date/time cards and a “Schedule a Visit” call to action • Set up a CMS for events, news/blog posts and careers so staff can edit content without coding • Implemented responsive design and subtle animations in Framer to create a polished, modern feel

Impact

The new site offers a clear, engaging journey for families. Parents can easily explore programs and student life, watch video testimonials and submit admissions inquiries. Events and job openings are always current thanks to the CMS. The animations and interactive sections build trust and highlight the school’s community, while the clean responsive build elevates DIS’s brand. Staff now manage content efficiently, ensuring timely updates and a professional digital presence.
Like this project

Posted Aug 22, 2025

Redesigned and built Dodi International School website in Figma and Framer with modern UI, admissions timeline, video testimonials and CMS capabilities.

Likes

0

Views

4

Timeline

Mar 25, 2025 - Apr 15, 2025