biobot.farm software
JAN 2020 - OCT 2022
biobot.farm is a Hardware and Software company focused on smart agriculture to give farmers more time to live by automizing and managing their crops with data-based decisions.
Role
User Research, Prototyping, Design System Building, Brand Design, Web Design, Frontend Development, App publishing, Graphic Design, Social media, Document Design.
01
Challenge
The app must effectively integrate with physical sensors and devices that gather environmental and crop data.
The app must present complex data like soil conditions and irrigation patterns in a way that's simple to understand and act upon
Many farming areas may have limited internet connectivity, so the app must be able to function offline or with intermittent connections, syncing data when a stable connection is available.
02
Key Features
Tracks soil moisture, temperature, humidity, and more using BOTLOG and BOTIOT devices
Manage irrigation systems remotely, adjusting speed and coverage areas
Records detailed data on crop diseases, treatments, and harvests
Analyzes collected data over time, offering insights to improve crop management
03
Usability Test
At first the idea of the app was an infinite scroll with all the information of the user's crops. This wasn't a good long term solution because when a certain type of user had a large number of crops the Framework we used crashed and the time for the user to complete their workflow was high. An A/B test was made with a Home menu redesign:
Things that worked
60% Faster load time
The redesign allowed users to complete tasks faster by organizing information more efficiently
Users found the menu more intuitive, making it easier to access specific crop information without endless scrolling.
Things that didn't worked
The redesign required more navigation steps to access certain data, which frustrated users who preferred direct access through infinite scrolling.
Solutions
Keep the new Home layout and transfer the infinite scroll section to the crops menu with a dropdown so the user can expand only the information of the crop it wants to see, keeping the performance of the app.
Add customizable shortcuts to the Home menu, allowing users to access frequent tasks with fewer clicks.
04
Offline Compatibility
One of the most important things that users told us was that on the field they can't use the app because at first it was wifi-dependant. We took the feedback seriously and implemented an offline mode in Framer where the app would detect there is not wifi signal and asked the user to switch to offline mode where the user could add field measurements manually and log books. When the device is again reconnected it would send the stored data to the cloud without friction.
UI kit
For this specific project a custom design system was made based on Material Design 2, which then was migrated to MD3. This was made because the app needed really specific but modular components for IoT actuators. The result was a scalable design system for light and dark mode with biobot custom components.
biobot.farm Design System 2.0
Figma File
biobot.farm Website
Framer Development
Website Design
The Landing Page for biobot.farm was made with the objective of promoting and selling the deviced and for the users to download the app. The website was made with the firsts versions of Framer, and connected to a Wix store that tried to imitate the style of the landing page for a seamless integration between the two pages.