A NEW WEBSITE IN ORDER TO DEMAND BETTER
White Space
UX/UI
ILLUSTRATION
MOTION GRAPHICS
After taking care of White Space brand identity, there was a need for a new website that would express their new brand identity.
After the rebranding process, White Space noticed that their webpage did not match and was inconsistent with the guidelines of the new design identity that was built for the company.
Trying to run away from the perceived image of an oil and gas company was necessary, since the storyline of the previous website was centered around a visually illustrated demo of an oil platform.
This major aspect was keeping the company away from new young talent. These brilliant minds that strive for a meaning in every project that they are part of, have a stained image of the oil and gas industry and its impact on the environment. Consequently working in this field is something that they shy away from.
This project is the result of a collaborative effort between me and the founders of White Space, Tom Savels and Norbert Dolle.
Regarding my role, I was responsible for the UI/UX of the website respecting all the guidelines that where created before with constant and regular input from Tom and Norbert. After deciding on all elements, the Figma file was delivered to a design agency for them to build the final result.
In this process, I served as a mediator between the design agency and White Space.
This project is the result of a collaborative effort between me and the founders of White Space, Tom Savels and Norbert Dolle.
Regarding my role, I took the lead throughout all phases with constant and regular feedback from Tom and Norbert.
As a starting point, a rough and simple schematic of the website’s map was elaborated in order to understand the flow.
This allowed us to understand what type of content needed to be present in order to provide all the information as well as a good experience to the user.
This phase started with low fidelity wireframes made quickly by hand with pen and paper in order to explore possible ideas, all of them guided by the brand guidelines.
This phase also allowed us to see the relationships between the different elements as well as creating the concept for the interactive slider of the service provided by the company.
Creating these low fidelity wireframes in Figma allowed us to see if the proportions were correct and to better define some sections that were left open in the previous phase.
The process between this phase and the previous one was not linear. In some occasions, going back to exploring solutions by hand was necessary. These wireframes were re-done to explore different options and then replicated in Figma again to explore their feasibility.
©2021 Samantha Martinho
