Mana Farms developed an indoor farming system for the hospitality and gastronomy industry. The farms, used by several German Fortune 500 companies, are analyzed and monitored by Mana. They need to update, observe, and adapt settings to the the farms to ensure optimal and smooth operations.
THE PROBLEM
The current tracking process couldn’t be done by every team member and required coding skills.
With their current setup only their CTO, the only team member with coding skills, was able to set up and manage the farms.
Besides that, there wasn’t a organized system, which empowered them to keep track of all the farms, their locations, and company owners. To simplify the process and empower other team members to have access, the company wanted to have an Admin Panel that kept everything in one place, and had a UI that every team member could intuitively use.
THE SOLUTION
Creating an Admin Panel, to simplify the tracking process and make it accessible for every team member.
Together with the stakeholder and the developer, I designed an Admin Panel for the company’s internal use.
It’s intuitive and self explaining, so that every employee will be able to work with it. For example, instead of modifying the farms through coding alone, they can now easily change the settings of every farm. The table format also gives a neat overview for each of the views and works intuitively as well.
MVP (Minimum Viable Product)
The given MVP was to design the “Farms” and “Owners” overview screens, with a product detail screen. And additionally to design a simple solution to add and remove users.
For the product detail screen the company needed a creative and intuitive UI solution for laying out and updating the settings of the Farms.
Key Features
Login/ Logout
Add new user/ remove user
Add new farm
Add new owner
User Flow Diagram
THE PREVIOUS TRACKING SYSTEM
…required coding skills and was therefore only possible to use by a single team member.
To simplify the process, a new, more accessible, and intuitive solution was needed.
FIRST IDEAS & SKETCHES
First ideas were already drawn by the CTO of the company.
These gave me some insights on how some parts needed to be laid out, as well as, an understanding of the technology behind it.
Based on these examples, I drew some more sketches to find the best possible solution for both layout and functionality.
Low-Fidelity-Wireframes
I decided for a dashboard design, as this will give the project the best structure and also leaves room for future improvement and expansion, as the project was projected to grow more complex over time.
Mid-Fidelity-Wireframes
TESTING & FEEDBACK IMPLEMENTATION
In this stage the design and it’s functionality went through a few rounds of testing and feedback implementation together with the stakeholder and the developer.
Style Guide
I applied the branding guidelines from the company and implemented the colours as well as the font and the buttons according their corporate identity.
I searched out and matched icons to how I interpreted their style, approving it with their Brand Marketing Owner, as they made the design more accessible and intuitive.
Layout and Grid Sytems
To ensure consistency and organization, I layed out my screen in 3 main sections:
Sidebar
Headerbar
Main content section
Throughout the whole screen, I applied an 8px grid system which helps maintaining consitency in spacing and structure.
High-Fidelity-Wireframes
TESTING & FEEDBACK IMPLEMENTATION
In the high fidelity stage, we again went through a few rounds of testing and design improvements together with the stakeholder and the developer.
The whole project evolved smoothly over time and was built together with the team.
Mockups
NEXT STEPS
As soon as the developer is finishing coding the project, the Admin Panel will be used by the company internally. Together with the developer, I will get to give every team member an introduction to their new system.
This UI implementation will make the company’s process of working with and monitoring the devices much easier and more accessible and intuitive.
Changes will continue to be implemented while testing the project internally and future improvements will be done along the way.
For the next iteration we plan on implementing a dashboard screen for a detailed overview / snapshot of their products.