ACSA - ERP Web App Redesign

ACSA is an ERP web app that was developed for Aura Gemilang in 2018. The web app hasn’t gone through any major design iteration. On top of that, board members of the company are not using the app in their day-to-day operation.

ROLE

UI/UX Designer

SERVICES

Web App Redesign

TOOLS

Figma, Miro

MISSION

Improve app usage from board members

Throughout the years, ACSA saw little to no usage from the board members. In this project, I dive into the root cause and discover what could be done to improve the app adoption among the board members.

Project Deliverables

1. Introduce "Board-Member" view

This enables the board members to view the latest insights and metrics about their company.

2. Introduce Steppers component

Introducing Steppers component (in selected flows) to minimize visual clutter and improve the ease-of-use.

3. Design iteration for ACSA with new visuals

Besides giving ACSA a new visual redesign, this redesign also focuses on displaying important metrics for the users.

Design Problem
How might we encourage board members to use ACSA more frequently in their day-to-day operations?
CONSTRAINTS & TRADE-OFFS
Engineering Constraint - Complex Flows

Certain number of flows are tied to complex calculations. For clarity sake, I only design screens that are outside of that constraint.

✷ RESEARCH
RESEARCH

Understanding why board members are not using ACSA

Method - User Surveys

To pinpoin the exact factors, I conducted a survey via Google Form and sent it to Aura Gemilang’s manager. Also, I have outlined multiple research goals and uncovered crucial insights.

Research Goals
  1. Pinpoint the factors that made board members to not use ACSA in their day-to-day operation.
  2. Identify which key business metrics to display on their dashboard view.
  3. Identify which metrics the clerks would wish to view on their dashboard.
  4. Discover opportunities to improve the current app experience.
INSIGHTS

Research insights and findings

1. Absence of crucial data impacted the app usage among board members

Based on the response, board members don’t use the app because they would rather ask their employees/manager upon request.

I have also pinpointed a number of key business metrics that they would consider important.

2. Low Hanging Fruit

Besides that, I have also discovered that clerks considered “Jumlah Advance Semasa” (Total Current Advance) in their dashboard view.

✷ IDEATE
IDEATION

Brainstorm with the Lean UX Canvas

Brainstorming with Lean UX Canvas in Miro
SKETECHES AND WIREFRAME

Starting the design process with sketches and wireframes.

In the early stages of the design, I started with rough sketches on paper to experiment with layouts, later digitizing in it Figma as wireframes.

I also took two magazines (IKEA and B Magazine) as my layout inspo.

Sketches for ACSA's card components.
Wireframes in the early stages of the design process.
✷ FINAL OUTCOME

Final Outcome

Style Guide & Mockups

ACSA was redesigned with a clean, visual look. Previously it had displayed little metrics in the dashboard, rendering it useless from the board member’s perspective.

With the introduction of Board Member view, I hope to increase the app adoption from these group of users.

Old ACSA UI
Some of ACSA's new components for the redesign.
ACSA's Board Member view mocked up on mobile devices.
DESIGNED SCREENS

Here’s a preview of the screens designed for clerks whose main task consists of doing administrative tasks inside ACSA.

PROTOTYPE: STEPPERS

Next Steps

1. Use Maze to gather user feedback & quantifiable insights

For next steps, I would plan to use Maze to gather feedback from the board members, as well as the admin users.

2. Propose to Stakeholders

Eventually, after testing and collecting insights, I would propose this for actual development to AURA once the movement lockdown in Malaysia is lifted.

Back to top