November 18, 2024 3 min read

UniferX

About the client

UniferX is an international distributor of organic fertilizers for crops, aiming to combat the climate crisis by offering solutions that aid plants in adjusting to shifting environmental conditions.


Challenge

The company’s website has long been out of date, no longer meeting modern standards, and an updated brand identity. Our challenge was to give the site a complete overhaul, enhancing both functionality and aesthetics.

  • Our challenge was to create a functional and visually attractive site at the same time. Let’s add here the client’s ambition to make it one of the best on the market. Another powerful motivation for us.
  • The Goodface team aimed to showcase the client’s products effectively making info easier for customers to access. In our design philosophy, functionality alone isn’t enough; it has to have that wow factor.
  • Due to the large system of data, we had to fine-tune how they interacted to make it user-friendly.
UniferX website: UX/UI design and web development for a distributor of fertilizers – Goodface agency  - goodface.agency

Solution

Discovery

We started with market research and competitor analysis to understand the needs of the target audience and found some insights. Based on them we developed the user flow and site map.

Project plan

UniferX website: UX/UI design and web development for a distributor of fertilizers – Goodface agency  - goodface.agency

Target audience groups

UniferX website: UX/UI design and web development for a distributor of fertilizers – Goodface agency  - goodface.agency

User flow

UniferX website: UX/UI design and web development for a distributor of fertilizers – Goodface agency  - goodface.agency

Wireframes

At the visualization stage, we created detailed wireframes. It brought a clear vision of how the information will be located on the pages.

Then the development team created a specification with requirements for the functionality of the site.

Design concepts

The next step was the creation of design concepts. We pitched two different styles inspired by mood boards.

  • The first embodied modern approaches to design: a combination of simple geometric shapes in a non-standard form, big fonts, animations, and dynamic grids. 
  • The second one was done in darker colors, embracing the sleek Bento UI trend.
UniferX website: UX/UI design and web development for a distributor of fertilizers – Goodface agency  - goodface.agency

Design

In the design stage, we worked on several key features, like advanced search and an interactive map for fast-finding distributors.

  • We improved filters to streamline product selection on the revamped site.
  • And those smooth scroll animations add a touch of fluidity, guaranteeing a more interesting user experience.
UniferX website: UX/UI design and web development for a distributor of fertilizers – Goodface agency  - goodface.agency
UniferX website: UX/UI design and web development for a distributor of fertilizers – Goodface agency  - goodface.agency
UniferX website: UX/UI design and web development for a distributor of fertilizers – Goodface agency  - goodface.agency
UniferX website: UX/UI design and web development for a distributor of fertilizers – Goodface agency  - goodface.agency

Development

Our technical implementation unfolded in three phases: Frontend, Backend, and Quality Assurance.

Using React.js for the Frontend and Laravel PHP for the Backend, we ensured scalability, speed, and optimization. These technologies empowered our developers to handle large data volumes efficiently.

UniferX website: UX/UI design and web development for a distributor of fertilizers – Goodface agency  - goodface.agency

Frontend

During the Frontend stage, we devised a scalable component system and seamlessly integrated engaging animations without compromising performance or SEO.

UniferX website: UX/UI design and web development for a distributor of fertilizers – Goodface agency  - goodface.agency
UniferX website: UX/UI design and web development for a distributor of fertilizers – Goodface agency  - goodface.agency
UniferX website: UX/UI design and web development for a distributor of fertilizers – Goodface agency  - goodface.agency

Backend

Our Backenders developed cross-country functionality with multilingualism, enabling the site to dynamically adapt content based on the user’s location and language preferences.

UniferX website: UX/UI design and web development for a distributor of fertilizers – Goodface agency  - goodface.agency

Сontent

We streamlined navigation with an advanced search feature, simplifying information retrieval from extensive document repositories.

Our team meticulously crafted an architecture to manage relationships between various data objects such as products, cultures, outcomes, and countries.

Despite the complicity of data on the platform, we maintained our user-centric approach. So the content remains structured and convenient to manage.

UniferX website: UX/UI design and web development for a distributor of fertilizers – Goodface agency  - goodface.agency
UniferX website: UX/UI design and web development for a distributor of fertilizers – Goodface agency  - goodface.agency
UniferX website: UX/UI design and web development for a distributor of fertilizers – Goodface agency  - goodface.agency
UniferX website: UX/UI design and web development for a distributor of fertilizers – Goodface agency  - goodface.agency

Result

As a result, we achieved a new vibrant website, boasting enhanced navigation, interactive features, and animations. It effectively engages users, encouraging them to explore the site. 

Thanks to optimization, it is swift and accessible. And of course, it’s pretty easy for content management.

UniferX website: UX/UI design and web development for a distributor of fertilizers – Goodface agency  - goodface.agency

CSS Design awards

The website got CSS Awards in Best UI Design, Best UX Design, and Best Innovation nominations.

UniferX website: UX/UI design and web development for a distributor of fertilizers – Goodface agency  - goodface.agency

Don’t want to miss anything?

Subscribe to keep your fingers on the tech pulse. Get weekly updates on the newest stories, case studies and tips right in your mailbox.