Approximately 7 minutes read
October 2019- March 2020
Project overview and goal
The purpose of this project was to Design and Deliver an intuitive SAAS product that captures user requirements for Cloud Managed Network products by reducing the manual activities involved in the process and deploy the product faster to the customers.
My role and the wider team
I worked on the UX/UI side of things and the other members included a CX person, Network Engineer, Solution Consultant, Product Owner and End to End Architects.
Organisation big vision
To help all of New Zealand win big in the digital world.
Design Process
We adopted the agile working model to achieve our project goal. The Design thinking framework we followed was called Five D's which translates to Discover, Define, Develop, Deliver and Determine.
The Five ‘D’ process
Discovery phase- Qualitative research
The main purpose of conducting Qualitative research was to question the brief and gather as much information as possible. Co-create workshops encouraged effective collaboration. The outcome of the workshop was to define a clear problem statement.
Empathy mapping to understand about users and their needs
The five 'W' approach
The five 'W' approach to identify the core problem
Qualitative methods
We were able to identify total sales and the devices used in the project. Due to the information confidentiality the numbers cannot be addressed in this case study.
User goal
Wants high speed bandwidth connection across all the offices across the country without affecting the productivity.
Business goal
Deploy the product faster to the users and try to reduce human errors and find opportunities to improve the product delivery life cycle
User need statement
Bob has a large independent vehicle inspection business and he needs to have a high bandwidth internet network across 150+ offices without affecting his productivity at work in order to get the most out of the Cloud-based applications.
Outcome
We were successfully able to get the most important things that was required to proceed with the next phase;
Understanding the users
User needs
Clear problem statement
Define phase
Based on the research and the user need statement we created persona and performed a journey mapping session. My role was to identify the pain points and find opportunities in the journey where we could address and solve the customer's problem.
User Persona
Journey mapping
Journey mapping helped gain lots of insights on the user touch points and identify the manual steps. This created a huge opportunity to identify key pain points and channels to improve the user interactions.
UX wall- Journey mapping session
Outcome
The journey map allowed me to identify the key steps and find the loop holes which could be improvised. Among the many manual steps involved in the process one thing stood out the most. When a user brought the product it was important to collect technical information to understand the devices and accessories to be configured and deployed. That technical form had to be error free to capture detailed requirements and have a successful device deployment. Traditionally an excel spread sheet was used to collect this information which was error prone. Some of the pain points identified were as follows;
Too many duplicated forms
Many errors in filling the forms
Some fields missing in the form
Form not being validated before handing over the technical teams
Collecting this technical information could take around 2-3 months going back and forth with the users. We saw a huge opportunity in reducing this time by having a platform to collect this information and validate them using digital systems that would solve the customer pain points. The outcome would help us;
Reduce significant human errors
Save many hours of time
Save labour cost
Ship product faster to the users
Increase NPS
The above factors favoured both the users and business goals. This helped me create a short hand flow to see where my point of focus would be as a designer.
The region highlight in red is where the proposed idea would make the most impact
Reality check
My biggest take away from the discovery session was to understand the system complexity. Before creating beautiful wireframes it was important understand and articulate where would the solution sit in. On conversation with other designers I figured out it was appropriate to use an existing platform rather than starting something from scratch.
Current Process
The current Network engineers were using excel sheet which was quite cumbersome to collect data. If a customer has multiple site it was needed to do again creating multiple copies of the document. Also at times, on site it is very difficult to view the excel sheet and configure routers.
Current state excel form
Design phase
Ways of working- Agile sprints
To keep track of the project and have a delivery timeline, Azure boards was used
Project task board
About the design
Information Architecture- Sequential UX
The structure of the information was based on the sequential UX method where the users fill the information step by step based on the questions asked. A tracker was introduced to identify the status of the form and appropriate call to actions such as 'save as draft' or 'continue' option to ensure users can fill at ease. The most valuable aspect was the form validation on the go to ensure that users are fill up the right information rather that just using them as fillers.
Rapid low fidelity prototyping
User flow
Design System
We had inhouse brand guidelines and visual style and re usable components in the design system. This saved the designer a lot of time and made design work efficient.
Visual design of the screens
User testing the prototype
User testing:- I conducted an unmoderated in person usability test session with five users, to seek feedback and validate my assumptions with the prototype. The purpose was to test the prototype and seek insights on the users flow to capture information.
User Testing session with a participant
Key learnings
Users struggle with too technical jargons
Users liked the tracker option
Users appreciate appropriate CTA's
Early testing helps gain customer insight in idea level sufficient enough to validate our assumptions
The final prototype
The below video demonstrates High fidelity screen of the end to end process for capturing technical requirements
Deliver
The handover process begins by giving a product demo presentation and explaining the key stakeholders the design features and the interface.
Presenting the product design and features to stakeholders
Project documentation
A screenshot of Zeplin with comments
Project learnings
Unfortunately due to some resource constraints and other priorities the product is still getting built. We have bi weekly meeting with developers to see the progress.
The key take away was that the backend system can be complex and be easily ignored. As the solution was platform agnostic it is important to understand the systems as a designer and get a high level understanding from a development perspective right from the intial phase of the design.
