APEX – is a web-based vanilla auditing tool designed for ECOCERT in Madagascar.

It allows the control body to view information submitted by agriculture companies to be benchmarked against a voluntary Sustainable Vanilla Standard (the APEX).

Web-based Auditing Tool Design

How it works

At its core the APEX web application displays:

  • Summary information about the companies
  • Status of the companies in regards to their application for audit
  • Status of the companies in regards to fulfillment of the voluntary standard

APEX also allows the control body to:

  • Manage/view its audit plan
  • Auto-send application documents to the companies
  • Exchange information with Metajua standard ERP via a 2-way API

My direct contributions

I worked on a remote multidisciplinary team, having coincided with the first wave of COVID-19 lockdowns. Our small agile team was made up of 2 front-end developers, 1 back-end developer, myself in UX/UI design role, a scrum master and the product owner. We used an agile framework and worked in sprints.

I was responsible for:

  • Designing all conceptual frameworks, flows, wireframes, low and high fidelity prototypes and mockups in line with development sprints.
  • Designing the brand identity
  • Designing and maintaining the integrity of the design system that was shared by the team over the course of the project and would carry into future evolution.
  • Planning the design sprints and presenting both low and high fidelity prototypes for timely user testing
  • Adjusting designs based on constraints that the development team faced
Apex Login Page

Brand Identity

The brand identity needed to conform to a formal environment but bring in a refreshing and distinctive visual language. We benchmarked against key industry players to find our brand positioning and differentiating factors. I explored broadly different takes on visual language and our key associations and in the end tested two contrasting design directions with the client based on our insight and understanding of the target users.

Key Words: Inspiring . Dependable . Trustworthy . Secure . Analytical

Apex Brand Identity Design
Apex Brand Identity Design

Designing the UX/UI

At macro level the user journey and experience focussed on seamless navigation through four core modules: application for verification, control body assigns/mandates auditors for verification, control body plans the verification and control body views verification results.

To help manage the extensive data I avoided cluttered UIs and simplified micro tasks using simplified patterns and stripping UIs down to the absolutely essential data only. I maintained the traditional use of tables and lists to organize the audit data but balanced that by introducing exciting dashboard elements, graphical representation and distinctive iconography.

Wireframes Design
Clickable Prototypes
Apex Clickable Prototype Design
Mobile Design

Design System

I built the design system from the onset of the UI design phase, to house all style guidelines, UI components, libraries and patterns. The design system was shared in Figma with the team giving the developers access to the CSS and ensuring consistency and adherence to the cohesive design standards.

Design System

Final Designs

Web-based Auditing Tool Design
Web-based Auditing Tool Design