Clarifying needs
Familiarisation and needs analysis
To properly understand the challenges and issues of this redesign project, it is essential to take stock of what is in place and to analyse the conservatoire’s overall organisation. A series of interviews with the portal’s target audiences (administrative staff, teachers, students and parents, as well as the general public) is run, allowing us to identify users’ expectations and needs. Varied topics are covered: how people perceive the conservatoire, teaching, cultural events… The feedback helps draw interaction flows between the different profiles and identify digital behaviours. The cherry on top: we took the opportunity to visit the conservatoire to better grasp the internal organisation. This requirements analysis highlights internal and external information and communication issues. The different journey steps that turn out to be the most problematic will feed the thinking during the two user-journey workshops.
Defining the user journeys
Formalising the journeys and the interactions
The first workshop covers the journeys internal to the conservatoire’s organisation. The second focuses on the student and external journeys. The journeys are modelled from the feedback gathered during the interviews. They are presented during the workshop and serve as a basis for collaborative work. The participants modify the journeys by identifying the barriers and needs and by sketching first solution ideas. The key priorities are then ranked: accessing information about available courses, informing students directly, the registration process… The result of these two workshops is then formalised so it can be presented and used internally.
Interaction design: screen mockups
Co-designing the main screens
Before starting to produce the mockups, the project team is brought together again to co-design the main screens. In this workshop, we present the functional review (features, navigation…) and visual review (visual identity, mood, components…) of other websites. This makes it easier for the participants to imagine the result and start exploring ideas.
The main screens are then drawn as sketches individually to start with, before being pooled in order to find the best compromises.
Visual identity
Conveying a more modern image suited to digital supports
When we started exploring and running several tests with the current identity, we quickly realised that the logo was difficult to carry across to desktop and mobile digital use. After several conversations with the team in charge of the conservatoire’s communications, we decided to evolve the identity so that it adapts perfectly to digital, while keeping a link with its DNA. The aim was therefore to simplify and modernise the brand image, while developing its likability. To make the link with the previous logo, we decided to extract the initials C and B while keeping the same typeface, but playing with shapes and counter-shapes so that the B becomes symbolic and poetic (some can see the dots of the F clef or the f-holes of string instruments…). This emblem gives the brand a more institutional weight and offers a simple, identifiable sign for the conservatoire. The whole sits within a circle that anchors it as a mark of quality. 💡 For the curious, we explain our logo-creation process in detail in this blog article.
The typefaces chosen for the new visual identity are “Libre Baskerville” for the headings and “Poppins” for the body text. Specifically designed for on-screen display, they meet the technical needs of a 100% digital project where the application’s interface is at the heart of the user experience.
The brand expression is rounded out by an energetic and refined colour range, to address the conservatoire’s multidisciplinary challenges.
A range of bright colours has been put in place to allow better identification of the areas on the platform.
UI design of the interface
A responsive site
The interface has been designed with simplicity and elegance, leaving plenty of room for the visuals, and conveys the image of a leading, long-standing institution in Bordeaux’s cultural life.
The design meets accessibility standards.