The BlueForests project seeks to advance the science and test technological innovations to rebuild Portuguese marine forests and to value their ecosystem services.
Project ManagementUX & UI DesignFrontend Development
Create a straightforward website that presents the importance of seagrasses and macroalgae, the objectives and projects that are being developed.
We combined blue and green tones to represent the project’s area of intervention: marine forests.
We chose Restora as the main font family due to its title’s organic strokes and serif that blend so well with the maritime theme. Combined with a simpler font, we aimed to bring elegance to an already minimalist website that has great readability.
Graphically, we chose to adapt some illustrative elements of seaweed that the client provided to reinforce the project’s core concept.
Once we defined the project’s design elements, we created the design system: the set of reusable components that could be assembled together like puzzle pieces to build new, consistent looking pages within the same style.
We decided to make a simple grid, a 12-column grid with 20 gutters for desktop and then adapt it to the rest of the devices.
We chose to make an immediate impact on the user by communicating the BlueForests’ mission straight away. To give even more emphasis to the projects area of intervention, we highlighted its keywords “marine forests” and “ecosystem services”, and added animated bubbles that convey the idea of being underwater.
Each topic has its own modals: the user can navigate between them by using the arrows on their keyboard, which simplifies the navigation experience.
To make the listing page more dynamic, we highlighted two featured news articles at the top that are followed by the remaining news articles. For an improved navigation experience, the user has the possibility to navigate between the individual news pages without having to return to the list.
All pages were designed and implemented to be fully responsive so that users in different devices all have the best possible experience.
“Concealed provided an excellent delivery of the website according to our communicated objectives and budget. We were very pleased with their workflow and timely execution of tasks as well as their enthusiasm of working on a website with an environmental focus. Concealed developed a design and functionality to effectively communicate the project’s objectives to a wider audience and thereby contribute to increasing ocean literacy.”
Pål Bakken, CEO-Founder, BlueForest
A simple, yet creative website that showcases the BlueForests project and its work to investigate and test technological innovations that rebuild the Portuguese marine forests and value their ecosystem services.