About the project
Embedded Files
The 'OnTheGo' project went live 3 years before I joined it. It serves as a platform for easy communication between the employee and the employer (Brillio) on the go—hence the name. This platform has benefitted its users through its ability to adapt to their daily needs, long-term growth, socialisation within the organisation, and any other form of required mediation between colleagues and/employers.
Today, OnTheGO is Brillians' favorite platform to share their achievements, wish colleagues on birthdays, set yearly goals, among other collaborations.
It also provides easy-to-use modules for otherwise repetitive and cumbersome admin tasks like submitting expenses, timesheets, travel requests, etc.
During the second wave of COVID, OnTheGO was instrumental in providing Brillians and their families with essential healthcare support, like setting up vaccine appointments.
This was my first project at Brillio, and so I have a lot to share about it. Let's begin!
NOTE: There will be a lot of details missing from the following presentation due to NDA reasons. Let's talk about those on a call instead :)
The Challenges
External APIs
Use of external APIs, instead of the company's own backend team, added difficulty to universal design changes.No Styleguide
Lack of a Styleguide made cohesivity difficult and increased development costs.Lengthy Design Research Process
Functioning as platform used between different verticals meant talking to all those users, which slowed the implementation process.Inconsistent UI
The mobile and web versions used different color themes which prevented consistency for the user.'Jack of All' Designer
Working as a solo designer on the team meant touching all the bases alone.
Feature video
Attempt towards No UI
Actionable notifications
The API response times on some modules were too long (max 27 seconds), which is a terrible experience for anyone. No UI tries to solve that by delegating most of the cognitive and wait load onto technology instead.
The result:
No loading
No wait time
Less congnitive load
Task completion in one click
Styleguide
Creating the first styleguide of the platform helped in these ways:
Standards for color and text styles
Reusable component library
Focus on interactive states
Reduced development costs
Design Audits
Service Audit
An analysis of existing performance and effectiveness of touchpoints and future potential for the platform.
This helped stakeholders understand what the UX looks like at the moment and what it can be in the future.
Note: Complete analysis is not shown here due to confidentiality concerns. I'm open to talk about it though.
UI Audit
Performed with the feedback from users, complaints to the helpdesk, and interviews with users
Expanded list of issues
A sum total of issues found gave me a lot to work with.
Leave Module Redesign
Existing Design
The leave module was not difficult to begin with. My contribution to the module was to facilitate this simple task through a more intuitive UI. Creating a service blueprint helped in this.
Service Blueprint
Helped gauge exact user problems by following and analysing user's every footsteps. This was made utilising the interviews and feedbacks from users over time.
Visual solutions followed from here!
Some other Examples of Interventions
Expense Module
Existing Design
This was a crucial module for the users given the company-wide increase in reimbursement requests during
the pandemic
Proposed Expense Module
Same process followed as other redesigns.
It works right?
UX writing
"The amount will be credited at 2 May 2024"
to
"Your money will be credited in 2 business days"
A more humane and assistive tone helps develop user's trust and opinion of the product. The gap was found after listening to the users
Homescreen Redesign
Existing design
Homescreen calls for a warm and welcoming screen for the user, but ours was an odd welcome.
Unintuitive direction of interaction
Items are hidden from user
Wastage of real estate
Wrongly positioned filters
Unnecessary scroll areas
Updated homescreen
- 20% more space for tasks
- Everything is visible
- Clear visual hierarchy
- Left to right eye movement
- Feed filters on top of the feed
Other Things that Kinda Matter as Well
Order in Chaos
My component library
Motion Graphics
Reusable interactions set up for the entire platform
Example of reusability of JSONs
What do you think is a better animation to aim for?
VS
There's a lot of things not shown here for confidentiality. Let's talk!
Page updated
Google Sites
Report abuse