001
ESAV Marrakech
Redesigning the digital presence of a school built around visual culture.

My work went beyond redesigning pages.
It involved rethinking how prospective students discover the school, understand its programs, experience the campus remotely, navigate admissions, and ultimately decide: “This is where I want to study.”
- Website Redesign
- UX/UI Design
- Frontend Development
- Virtual Tour
- SEO
- Content Architecture
- Performance
- Maintenance



Client
ESAV Marrakech — École Supérieure des Arts Visuels de Marrakech
My role
Product Designer & Full-Stack / Frontend Developer. Responsible for UX/UI, development, responsive implementation, content architecture, SEO, performance, the virtual campus, maintenance, and continuous improvement.
Platform
Institutional and admissions website for students interested in cinema, audiovisual production, design, and visual creation.
Scope
Website redesign, UX/UI, development, programs, admissions, virtual campus, SEO, technical maintenance, and iteration.
001 · Overview
A creative school deserves a creative digital experience.
ESAV teaches people to work with images, cinema, photography, sound, animation, illustration, communication, interiors, and storytelling. Its website could not feel like a generic university website.
For many prospective students, the screen is their first encounter with ESAV. It needed to feel visual, creative, contemporary, and alive.

002 · Business context
The website isn’t just information. It’s part of the admissions journey.
Students are not comparing features. They are imagining what they will learn, make, who will teach them, which spaces they will use, and where the education could take them.
The website needed to let students experience ESAV before becoming students.
003 · Understanding ESAV
Translate an existing culture into digital.
ESAV already had architecture, students, films, artwork, workshops, alumni, history, and a visual language. The interface needed to give those things space to speak rather than cover them with unnecessary design.

004 · Product vision
Make the website feel like entering the school.
Don’t explain creativity when you can show it. Large imagery, student work, films, people, movement, and typography become the content; the interface becomes the frame.
The journey changes from navigation and PDFs to discover, explore, experience, understand, and apply.
005 · Information architecture
Creativity still needs structure.
Cinema & Audiovisual and Design & Création Visuelle became clear pathways, allowing students to move progressively from a broad interest toward disciplines and specializations without flattening their identity.

006 · Key decisions
The interface frames creativity. ESAV provides the personality.
001
Let student work sell the school
Show what people create here instead of only promising what they will learn.
002
Treat programs as journeys
Interest first, institutional structure second.
003
Make admissions impossible to miss
Move naturally from inspiration and exploration toward application.
004
Bring the campus online
Let prospective and international students explore ESAV remotely.
005
Design mobile-first discovery
Protect navigation, imagery, typography, and calls-to-action on small screens.
006
Build for evolution
Programs, events, admissions, projects, and news must keep changing without breaking the system.
007 · Virtual campus
Visit ESAV without being in Marrakech.
I created an interactive 360° tour that lets prospective students move through the physical school remotely. For someone living far away, the campus is no longer abstract.

008 · Virtual experience
Exploration, not documentation.
The work combined camera placement, 360° capture, spatial transitions, navigation, image quality, performance, mobile interaction, and website integration. The building became part of the interface.

009 · Program discovery
From “What does ESAV teach?” to “This is what I want to do.”
The architecture progressively increases detail: field, program, specialization, details, admission. Curiosity becomes orientation, and every page offers a meaningful next step.

010 · Visual system
Structure creates freedom.
Strong typography, editorial layouts, large visual surfaces, clear hierarchy, intentional whitespace, responsive grids, and controlled motion create consistency while diverse student work provides personality.

011 · Content architecture
Different audiences. Different questions.
Prospective students, parents, international candidates, current students, professionals, and alumni enter from different places. Each page needed enough context to work as an independent landing experience.

012 · SEO
A beautiful school website is useless if students can’t find it.
Clear page architecture, meaningful titles, program-specific pages, structured content, performance, and responsive implementation make search discoverability part of the product—not an afterthought.
013 · Performance
Visual doesn’t have to mean slow.
Images, films, interaction, and 360° environments all compete for bandwidth. Assets became part of the system: keep the visual impact, remove unnecessary weight.
014 · Continuous evolution
Launch wasn’t the end of the project.
Admissions campaigns, programs, workshops, student work, SEO, content, and technical needs keep changing. Every architectural decision had to answer whether ESAV could keep using it tomorrow.
015 · What was delivered
A complete digital layer for the institution.
002
Program Architecture
003
Admissions Journey
004
Student Work
005
Responsive Experience
006
Virtual Campus
007
SEO
008
Performance
009
Maintenance
016 · Complete journey
From discovering ESAV to imagining yourself there.
A student sees the work, explores a path, discovers a specialization, enters the virtual campus, and moves through Marrakech from hundreds or thousands of kilometers away.
The important conclusion isn’t “This looks like a good school.” It is: “I can imagine myself here.” Then: Apply.

017 · Product philosophy
The best institutional website doesn’t describe the institution. It lets you experience it.
The interface doesn’t manufacture personality. It reveals what is already there. Don’t make ESAV look creative. Let people see that it is.
From institutional website to digital campus.