Web Application Dashboard Design

APEX is a web application allowing a control body to view information submitted by agriculture companies willing to be benchmarked against a voluntary Sustainable Vanilla Standard (the APEX).

At its core the APEX displays:

  • Summary information about the companies
  • Status of the companies in regards to their application for audit
  • Status of the companies in regards to fulfilment 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
APEX Web Application Design

The Insight

Insight 1: Formal Audit Tool Used By Auditors
This is primarily a formal work tool for auditors therefore it needs to give a strong sense of order and reliability that audit industry is accustomed to.

Insight 2: Refresh a Traditional Setting and Outdated Tools
It needs to refresh the users and be fun and delightful to use for day to day tasks.

Insight 3: Give a Subtle Nod To The Agriculture Industry
The visual language should in some form derive inspiration from the agriculture/vanilla industry.

Apex Logo Design
Login Screen
Apex management application design

I worked on a multidisciplinary team and primarily remotely, having coincided with the COVID-19 lockdown. Our team is made up of front-end and back-end developers and I play the role of UX/UI designer. Our workflow focuses on an agile framework and sprints. I work hand in hand with our developers to deliver both low fidelity and high fidelity mockups that fit into their development cycles and technical constraints.

Responsive web application design

Designing the Brand Identity

Key Words: Integrity . Security . Trust . Dependability . Order . Refreshing . Positivity.

We focussed on benchmarking against a few key industry players to find our brand positioning and unique set of assets and differentiating factors.

Two design directions were proposed and tested based on our insight and understanding of target users – verification officers. The selected design combined aspects of both design suggestions that were married into one visual identity system.

The brand identity reflects a positive, fun and refreshing yet formal personality. We wanted the tone to be friendly, trusted and dependable.

Blue reflects dependability, trust, order and reliability while lime green brings in a youthful energy and refreshing zest with the slightest nod towards the green in agriculture.

Designing the Brand Identity
Brand identity design

We explored various visual styles and iconography. In the end we went for highly stylised icons and the more traditional blue and lime green colour palette.

Designing the User Experience

The user journey and core experience of this web app focusses on the seamless flow of actions and navigation through the four core modules: company application for verification, control body assigning/mandating auditors for verification, planning the verification and viewing the verification results of each operator.

Since the user is dealing with a lot of data, it was key to have a clean and easy navigation. This meant avoiding cluttered UIs and focussing on presenting key information in a straight forward manner. We used a lot of tables and lists for this.

At the same time we needed to break past the mundane and make the UI exciting and enjoyable to use.

web Application Wireframes
Apex Web Application UX/UI design

Leave a Reply