Enhancing Accessibility and Usability in FIELD

As a UX/UI Designer, I led the rebranding and UI improvements of the FIELD app, used by farmers to track plant health and tasks. I designed a new UI Kit, ensuring accessibility for colorblind users and applied the design across all app modes to create a seamless experience. The project aimed to refresh the interface while maintaining usability and ensuring a smooth transition to the new branding.

The main goal was to update the FIELD app with Adaviv’s new branding while ensuring it remained user-friendly across different modes. It was crucial to make the app accessible for colorblind users and adaptable to the unique lighting conditions in greenhouse environments.

Company

Adaviv

Adaviv

Adaviv

Date

2024

2024

2024

Industry

AgTech

AgTech

AgTech

Role

UX/UI Designer

UX/UI Designer

UX/UI Designer

Project Type

App Rebranding and UI Improvement

App Rebranding and UI Improvement

App Rebranding and UI Improvement

Context

Adaviv, a U.S.-based company focused on Lean Cultivation powered by AI, helps farmers optimize plant health and productivity through data-driven insights. Their FIELD app, a key tool for tracking plant health and farm tasks, needed a redesign to integrate a new brand identity while improving the user experience. While updating the UI without disrupting functionality, I also worked on enhancing the layout to address specific user pain points, making the app more intuitive.

The redesign had to address all aspects of the app, including critical features like dark mode, light mode, and accessibility for colorblind users. Ensuring the app’s usability in diverse environments, particularly greenhouses with specialized lighting, was essential to making the updated design both functional and user-friendly for all users.

Research Methods

Interviews to understand user satisfaction with the previous app design and identify pain points.

Usability tests with real users to assess how they interacted with the platform and pinpoint issues, particularly with color modes.

Secondary research on color blindness statistics and accessibility requirements to inform design choices.

Key Research Findings

The research uncovered several crucial insights that directly impacted the redesign. First, users working in greenhouses with specialized lighting for plant growth found dark mode to be essential for visibility, as it provided a more comfortable viewing experience in these unique lighting conditions.

On the other hand, light mode presented challenges, as it wasn’t fully refined and often made it difficult for users to discern key actions and tasks. This lack of clarity hindered users' ability to navigate the app efficiently, slowing down task completion.

Additionally, colorblind users faced accessibility issues due to insufficient contrast and color differentiation, further emphasizing the need for improved color modes and a more inclusive design. These findings led to critical design adjustments to improve both usability and accessibility across all modes.

Process

User Research: Conducted interviews and usability tests with real users to understand their pain points and how they interacted with the app. We gathered key insights on challenges in both light and dark modes, as well as the specific needs of colorblind users. This research informed the redesign by identifying critical areas for improvement in accessibility and usability.


UI Kit Creation: Based on the updated branding and user feedback, I designed a comprehensive UI Kit that prioritized accessibility, particularly for colorblind users. This included color palettes, typography, buttons, and other components to ensure consistency across the app while adhering to the new visual identity.


Prototype & Testing: Redesigned app prototypes with a focus on enhancing the layout and ensuring responsiveness across different color modes. I applied design tokens for consistency and tested prototypes in scenarios that mimicked real user environments, including greenhouse conditions, to ensure practicality and ease of use.


Development: I created the source color code files, which included design tokens and variables for each color mode (light, dark, and accessibility modes), ensuring all elements were consistent with the new UI Kit. These files were then handed over to the development team, who integrated them into the app's existing codebase, ensuring seamless implementation without disrupting the app's functionality.


Launching & Testing: The rebranded app was launched and released to customers, where we conducted post-launch testing to gather feedback on the new design. We continuously collected user insights to further refine the app’s usability and make adjustments based on real-world use and feedback.

Results

The rebranding and UI improvements significantly enhanced the FIELD app’s accessibility and user experience. Key improvements included a more robust color mode accessibility, with a stronger focus on colorblind users across all modes.

The app’s visual identity was fully aligned with Adaviv’s branding, elevating the overall user experience. Navigation issues were resolved, especially in the farm maps and plant health tagging sections. Additionally, the app’s layout and responsiveness were improved, resulting in smoother functionality. As a result, 100% of customers reported satisfaction with the new UI, light mode usage increased by 50%, and overall user experience improved by 90%.

50%

Increase in Light Mode

90%

Improved User Experience

Conclusion

This project demonstrated the impact of thoughtful UX/UI design on improving usability, accessibility, and brand alignment. By leveraging user feedback, applying accessibility principles, and ensuring that the new design met the needs of all users, we successfully enhanced the FIELD app. The project not only elevated Adaviv's brand identity but also created a more efficient and accessible tool for farmers, ultimately improving their ability to manage plant health and tasks more effectively.