← Back to all work
UX/UI · EDIT BOOTCAMP

UX/UI case study: EDIT programme

A walkthrough of process and reasoning, built during the EDIT UX/UI programme, from research to a working prototype.

Role
UX/UI design
Client
EDIT (programme project)
Year
2024

The problem

EDIT's own training managers were coordinating everything (schedules, tutors, student records, payments) across a scramble of disconnected tools: Skype, WhatsApp, email, spreadsheets. Too many channels for too many kinds of information meant things slipped through, and the tools available were, in the team's own words, either unintuitive, slow, expensive or confusing. The brief: propose a single platform, purpose-built for EDIT's own processes, and go through the full process to get there rather than jump straight to screens.

Problem statement slide: three problems (poor team coordination, too many scattered tools, unintuitive platforms) paired with three solutions (centralized app with chat and alerts, centralized management tools, automated processes)

Problem → solution, stated plainly before any screen got drawn.

My role & approach

End-to-end again: research plan, desk research, competitive analysis, interviews, card sorting, persona and journey mapping, then sketches through to a working prototype.

Research

The study plan scoped a moderate research effort across January–March: desk research, a competitive analysis, interviews and card sorting, then persona, empathy map and journey mapping, before moving into the design phase. Desk research turned up a real student complaint about a missed, unrecorded class with no follow-up: concrete evidence the coordination gap wasn't hypothetical. A competitive analysis benchmarked the team's existing "Portal Académico" against Monday and Notion across navigation, dashboards, notifications, chat and course management: the Portal held its own on attendance and course management, but lagged badly on notifications, dashboards and chat.

Competitive analysis table comparing Portal Académico, Monday and Notion across navigation, dashboards, notifications, chat, course and student management, with green/yellow/red status dots
Interview quotes from five EDIT staff members (training managers, a pedagogical assistant, a financial manager) about scattered communication channels and wanting a shared calendar and check-in tool

Competitive analysis against Monday and Notion, alongside interviews with the training managers who'd actually use this daily.

Six interviews with training managers, a pedagogical assistant and a finance manager surfaced the same complaint from different angles: switching between Skype, WhatsApp, email and Slack to reach the same people, and no shared calendar to catch schedule changes before they became a problem. That research converged into a persona, Matilde Freitas, 29, a training manager (Gestora de Formação) based in Porto, whose goals (automate the busywork, centralize communication) and frustrations (a recent team still figuring out its own processes, information scattered across too many tools) were mapped against a Says/Thinks/Does/Feels empathy map, and a current-state user journey walked through her actual worst-case scenario: a tutor cancelling a Friday class by WhatsApp on a Wednesday, and the scramble across Slack, WhatsApp, calls and email that followed.

Persona card for Matilde Freitas, 29, Gestora de Formação in Porto, with goals, frustrations, and a Says/Thinks/Does/Feels empathy map

Persona: Matilde Freitas, 29, Gestora de Formação, Porto.

Current-state user journey map: a tutor cancels a class, and the training manager scrambles across Slack, WhatsApp, calls and email to find a substitute and reschedule, with mostly negative emotions throughout

Current-state journey: a class cancellation, and every channel it takes to resolve one.

From insights to structure

A card-sorting exercise tested how the team itself expected the platform's own sections (profile, students, calendar, tutors, 360º clients, notifications, chat) to be grouped, and that structure became the site map: one dashboard hub branching into calendars, students, tutors, courses, clients, planning and profile, with check-in, notifications, surveys, search and chat as quick-access shortcuts from anywhere.

Card sorting exercise on a tablet: menu items (profile, students, calendar, tutors, clients, notifications, chat) being grouped into categories
Site map diagram: a central dashboard branching into calendars, students, tutors, courses, 360º clients, planning, profile and log in/out, plus quick-access shortcuts for check-in, notifications, surveys and chat

Card sorting → site map: the structure came from how the team itself grouped the pieces, not a guess.

Paper sketches of dashboard, login, calendar and menu screens
User flow diagram: login, check-in, an urgent notification when a tutor cancels, a chat exchange to find a substitute date, a poll sent to students, and the class rebooked on the calendar

Paper sketches, then the user flow for resolving a cancelled class end to end: login → check-in → urgent notification → chat with the tutor → a poll to the affected students → the class rebooked automatically.

Checked back against a future-state version of Matilde's original journey, the new flow cut the same class-cancellation scenario down to two channels (the new platform plus Zoom, instead of Slack, WhatsApp, calls and email), a fixed 10-business-day resolution window instead of an open-ended scramble, and emotions that stayed positive the whole way through, down to Matilde's own closing note: "não preciso fazer mais nada."

Future-state user journey map for the same class-cancellation scenario, now resolved through the new EDIT platform and Zoom alone, with positive emotions throughout and a fixed 10-business-day window

The same scenario, redesigned: two channels and a fixed resolution window instead of an open-ended scramble across four.

Benchmark & UI kit

A functional benchmark (dashboards, calendars, client-management and chat screens from other products) and a separate visual benchmark (colour, typography and imagery references, including an Urbanist-style display font and a bright accent palette) fed into a small UI kit: Poppins across three weights, a palette running from bright yellow through blue, green, red, teal and purple, a matching icon set, and core components (inputs, dropdowns, filters, login and check-in states) built on a 12-column grid before any final screen was drawn.

Functional benchmark: screenshots of dashboard, calendar, client-management and chat interfaces from other products
Visual benchmark: typography, colour and imagery references including a red/yellow/blue/teal/green palette

Functional and visual benchmarks: what other tools got right, and the palette and type direction to borrow from.

UI kit: Poppins typography in three weights, a color palette from yellow to blue, green, red, teal and purple, an icon set, form and filter components, and a dashboard mockup on a 12-column grid

The UI kit: type, palette, icons and components settled before the final screens.

The final prototype

The prototype landed on "Future Proof Education" as the platform's front door, carried through into a full clickable walkthrough:

Full case study walkthrough: research, structuring, iteration and the final prototype, end to end.

Reflection

This project is where the research-first habit really stuck: building the card sort and persona before touching a site map meant the structure that followed was answering a question that had already been asked, not one being guessed at the wireframe stage.

OTHER PROJECTS
01

MyFaceClinic

UX/UI Case Study
02

Mammoth

Brand & Communications

Let's create something worth remembering.

Available for selected freelance projects and full-time opportunities across Belgium and the EU.