The AgilePoint NX app helps to view and manage tasks on mobile devices and access our customer's enterprise applications running on the AgilePoint Platform. The app provides similar functionality to the Modern Work Center (one of the platform components). Our customers can customize the app based on their brand: change the logo, themes, and images that match their company branding with a paid add-on functionality of the AgilePoint NX product - Mobile App Accelerator. The original app was designed five years before this redesign.
Access enterprise apps on your mobile device
View and execute your business tasks
Manage your team’s activities, and collaborate
Reassign, delegate or cancel tasks
Manage tasks efficiently using the day planner
Visualize live business process flow and user participation
UI/UX Designer
Myself / Naveed Akhtar (UX Designer) / Manoj Chandola (Software Engineer) / Harish Lakshman (Project Manager) / Nishant Shrivastava (Head of Product Development)
Sketch, InVision, Figma
3 months
When I joined this project, the team had already started exploring the ideas. I was onboarded with some documentation and thoughts they began coming up with to understand the background better. After all opinions and ideas were collected, we made a document that includes medium fidelity screens with an explanation to review with stakeholders:
Based on the feedback collected, I started creating UI Screens. I wanted to focus on simplicity and functionality, so I have chosen white and light grey as base colors, adding blue as a primary. Also, I defined adding some visual language as illustrations to our app with the hope of creating delight and emotional connection with our customers. At first, I created UI for the five main app screens:
Provides a list of apps that have been published for your use.
Manages business tasks assigned to you with options to reassign, delegate or cancel tasks.
Provides tasks summary statistics, shortcuts, and frequently used apps.
Manage your team’s activities, and collaborate.
Shows eForms and tasks that have been submitted in offline mode. Once the mobile app is online, these forms are synchronized with the AgilePoint NX system.
Then I presented them to the stakeholders for review and got positive feedback, so I was able to finalize the rest of the screens (in total 60+):
I wanted to see the app from a user's perspective, so I made a clickable prototype and tested it, challenging myself to ask the same question on every screen: "Does the user know where to go next from here? If not, what do I need to change to do that?" I also asked the teammates to taste it to collect all opinions. After a few rounds of iterations, I was able to finalize the prototype:
I worked closely with the engineering team to ensure that there was no inconsistency between the design and app implementation. After a few rounds of build review and testing on devices, we were able to update it on App Store - link
As a result of this redesign, our app got consistent aesthetics with improved accessibility. Also, our users got full feature parity with the desktop experience.
One of our new features, a powerful day planner to set reminders to work on tasks, start new requests, or make a note to yourself, got very useful based on what we hear from the customers.
Create a user journey and identify points to introduce little delights (illustrations, feedback screens). Forming a personality for a product is not only fun, but it will engage your users in a whole different way.
Implementing new tools during a live project can overwhelm you, but you don’t always have the time to try them out beforehand. If you have a clue that another tool might work better, use it and avoid the infinite loop of “coulda-shoulda-woulda.”
During the design phase, it is essential to include the engineering team as early as possible to validate the feasibility of the design.