Back to school
made easy!
THE Goal
Building a new website to help students, teachears and professors to have a good undertanding of where to buy ERPI products, how to sign up and navigate into ERPI e-space, how to request adapted material for children with special needs or register in some of ERPI workshops.
The problem
Every beginning of the school year, ERPI receives a high number of calls related to the user difficulties following the good steps to use their products.
Pain point
Difficulty in connecting the access code or creating an account
Pain point
Teachers and students are unaware of the digital tools available
Pain point
Difficulty in understanding how to obtain ERPI products or request materials for students with special needs.
User Personas
Leonie
Age: 11
Occupation: Student
Level: Elementary school - Grade 6
Leonie needs to sign up into
e-space to access the interactive exercises of her book class.
Raphael
Age: 19
Occupation: Student
Level: University (Nursing sciences)
Raphael needs to buy the mobile App of his class material and create a new account.
Philippe
Age: 40
Occupation: Teacher
Level: High School
Philippe has a student with special needs and need educational material in digital media.
Sylvie
Age: 55
Occupation: Professor
Level: University
Sylvie would like easily to share information about print and digital books with her students.
My role
My role in this project was to act as a Visual and Interaction Designer.
Briefing
Creating a user-friendly website whose the visual fits from Primary school until University.
​
Avoid:
-
A too charged visual
-
Illustrations that target one sector more than others
​
Development: Edito CMS (In-house built CMS)
WEBSITE USER FLOW
To outline the information needed for the website, a simple flow diagram was created with the main tasks the user can do.
Edito
Edito is a CMS built especially to help the ERPI marketing sector managing their websites. I was responsible for designing a generic grid with 3 or 2 columns for Edito that could fit several projects, including the "Back to school".
​
Based on these basic grids (2 or 3 columns), the marketing sector is able to create their own wireframes.
UI DESIGN Style guide
accessibility Analysis
In this phase of the project, all foreground and background colours were tested with the Colour Contrast Analyser, an application that allows you to check the contrast ratio and see if they comply with the Web Content Accessibility Guidelines (WCAG)
Prototype
