Article | Short length
Foreground: design is more than just brand identity
Design is still sometimes understood by some as simply applying a brand identity to a product or service. But a brand's identity is not just embodied in its visual codes. Of course, the design approach is illustrated in the implementation of these codes, but also and above all in the impressions and emotions felt when using the product or service. This is illustrated by the redesign of the Foreground website, during which the marketing team was persuaded to use the full potential of the design approach right from the start of the project.
Involving a project team in a design process
When I started working on the Foreground project in July 2019, I quickly realised that beyond simply bringing the website in line with the Orange brand identity, thorough design work was necessary. Foreground is a B2B website. It allows IoT professionals to present their catalogue of products, services and solutions online. Enterprise customers, in addition to the Orange sales force looking for equipment, can thus consult a catalogue of several hundred references. The IoT suppliers are called “partners” and it is they who create and administer their catalogue directly on the platform.
When I joined the project, the website was already accessible to the public and was to be presented at an upcoming trade show. Initially, in order to meet the urgent deadline, only the website’s home page was graphically upgraded to bring it into line with the brand’s identity: positioning of the header, adjustment of the typography and restructuring of the headings on the page for better identification of the content.
But, beyond ensuring a minimum adherence to the brand identity in the short term, I considered it essential to get the project team to give themselves the time and means to become more deeply involved in the user experience of the site. An audit highlighted a number of shortcomings which were all areas for improvement. First of all, a lack of evidence of the value proposition. Then, poorly prioritised information, unclear navigation, poor implementation of interface components, and accessibility that could be improved.
Taking a step back to clarify ambition
The existing version of the website had been produced in direct development by the project team, without the methodology and expertise of a designer. I set out to demonstrate how design expertise would benefit the users of the website and the quality of the entire service. I had to clarify the whys and wherefores of the user-centred design approach, as well as the difference between UX and UI; and how taking the time to analyse it would save time later on.
A workshop was co-organised with an external UX designer. In my opinion this is a fruitful and fundamental stage, as it allows the designer to take ownership of the marketing strategy as much as possible in order to fully understand its present and future ambitions and objectives. Indeed, a website like Foreground is part of an ecosystem of Orange websites dedicated to the Internet of Things, and it was therefore vital to clarify its positioning and check that it was unanimously shared by the project team. Moreover, during this workshop, we discovered that this was not exactly the case. This therefore made it possible to clearly delineate the offer and its audience, in addition to the service offered on the website. This moment in the project is essential for the team, who are able to step back and concisely express the vision, principles and action plan. It is then clear that the appreciation of what already exists is not necessarily the same; that ambitions and priorities are not shared by everyone in the same way. Design facilitates the identification and reconciliation of this together.
Deploying the method
From then on, a phase of listening to the website’s users can be carried out and makes it possible not only to confirm certain hypotheses put forward at the start of the project, but also to bring out essential expectations to be realised in order to encourage wider adoption, use and promotion.
The synthesis of these marketing and experience elements makes it possible to:
– identify the key user journeys,
– determine the nature and hierarchy of the information to be displayed with a new navigation taking into account the two types of user
– clarify the entry points for the different task paths
– simplify and break down the data entry process into clear steps
– streamline templates to save development time
– guarantee the capacity to increase the catalogue and enhance the functionality of the website.
After the delivery of the wireframes, which concludes the UX phase, comes the interface design phase to deliver the final graphic mock-ups. Two tools are used: Sketch for the graphic mock-up and Zeplin for the interface with the developers located in Cairo and Paris. The Web UI Kit serves as a resource for all the interface components used. As this is a B2B project, some components do not yet exist in the Kit. These components have been created and specified for the project and will be available in the next version of the Web UI Kit.
You can visit the new website at: www.foreground.orange.com
This project team had never worked with a designer before. The trust they placed in me enabled me to take up the challenge, by implementing a design process that was enriching for everyone.