Webflow redesign:
Find out how Plankton First, which specialises in the use of phytoplankton, has been transformed thanks to a Webflow overhaul and a new graphic identity.
The company
Plankton First is a company specializing in the use of phytoplankton for various purposes such as food supplements, fish feed and cosmetics.
The company has strong values and an important identity, which will be reflected on their new website.
The project
designed pages
SEO optimized
completion time
The project involved a complete redesign of Plankton First s Webflow website.
The company had previously adopted a brand-new graphic identity, so it was necessary to design layouts in line with their charter.
The main challenges of this project were as follows:
- Apply the new graphic charter precisely and adapt it to the website, so that their online presence is perfectly identifiable.
- Make effective use of graphic elements to energize navigation
- To completely rethink the user path to offer visitors a unique experience.
The stages of the project
Wireframes
UI Design
Dev. Webflow
UI/UX Research and Workshop
- Persona identification: We define personas to understand the needs and behaviors of target users.
- UI/UX workshop: We organize a workshop with stakeholders to discuss objectives, functionalities and user flows.
- Competitive analysis: We study competing websites to identify best practices and opportunities.
Tree structure and Wireframing
- Tree design: We create a site tree to define the structure and organization of information.
- Wireframing: We create basic wireframes for each page, based on the tree structure.
Design and Webdesign guidelines on Figma
- Moodboard: We create a moodboard to define the mood and visual style of the site.
- Color palette and typography: We choose a color palette and typography that match the brand s identity.
- Mock-up design: We use Figma to create high-fidelity mock-ups based on wireframes and design guidelines.
- Customer validation: We present the mock-ups to the customer for validation and adjustments.
Webflow development
- Site structure: We establish the basic structure of the site in Webflow.
- Design integration: We integrate design elements down to the pixel.
- Functionality development: We add interactions, animations and more.
- Mobile optimization: We ensure that the site is responsive.
- Technical SEO: We implement elements for SEO.
Testing and Go-Live
- Functional and compatibility testing: We check that everything works as expected on different browsers and devices.
- Audit: We carry out a detailed audit of the site.
- Customer review: We set up a tool to collect customer feedback easily.
- Final modifications: We make the final changes.
- Deployment: We put the site online.
Maintenance phase
- Monitoring and analysis: We use analysis tools to track site performance.
- Support and updates: We provide regular updates based on customer needs and site performance.
The benefits for the customer
Plankton First and its teams can now fully and easily administer their website thanks to the management features offered by Webflow.
Our SEO optimization work and advice enable them to position themselves at the top of search results.
Thanks to an impactful new identity, intelligently transposed onto the site, the company now benefits from an assertive and qualitative online presence.
THE PROJECT IN PICTURES
"With Webflow, Plankton First has become more than a phytoplankton company: it s an innovative platform that puts marine science at the service of sustainability."