Case Study 01
ERP Integration / we.trade
Creating a new product feature to streamline the trade creation process.
Using a combination of behavioural insight, user testing, and group ideation sessions
Using a combination of behavioural insight, user testing, and group ideation sessions
My Role
Product / UX Design
Product / UX Design
01/ Summary
What was delivered and how
What was delivered and how
— Input
Behavioural insight
Workshop facilitation
Wireframing
Remote user testing
Iterative design
User-interface design
Developer collaboration
Behavioural insight
Workshop facilitation
Wireframing
Remote user testing
Iterative design
User-interface design
Developer collaboration
— Deliverables
Problem defining workshop
User journey map
Wireframes
User-interface designs
High-fidelity prototype
UI Components
Problem defining workshop
User journey map
Wireframes
User-interface designs
High-fidelity prototype
UI Components
— Outcomes
Working to a tight deadline we delivered a proof-of-concept prototype outlining an MVP approach to enable the importing of Purchase Orders in an industry-standard format to the we.trade platform, this was used to demo to stakeholders and investors and achieve consensus for progression.
Working to a tight deadline we delivered a proof-of-concept prototype outlining an MVP approach to enable the importing of Purchase Orders in an industry-standard format to the we.trade platform, this was used to demo to stakeholders and investors and achieve consensus for progression.
Thanks to close product team and developer collaboration and a lean iterative approach, the feature was implemented, tested and released on schedule.
Whiteboard sessions / Mind mapping & User Journeys
02/ Understanding the problem
A deep understanding of the problem was the first step
A deep understanding of the problem was the first step
Pain points
Research and user testing had indicated a common pain point for both the banking users that were promoting the platform and their customers - our end users. The trade creation process on our platform required entering data that had already been entered into their ERP systems.
The first challenge was to truly understand the problem and work out how to solve it, together.
Research and user testing had indicated a common pain point for both the banking users that were promoting the platform and their customers - our end users. The trade creation process on our platform required entering data that had already been entered into their ERP systems.
The first challenge was to truly understand the problem and work out how to solve it, together.
Industry standards
As our customer base is spread across multiple countries our research insights indicated that there were a diverse range of ERP systems in use by our users, which meant that integrating with the leading system in one country would not benefit users in another.
As our customer base is spread across multiple countries our research insights indicated that there were a diverse range of ERP systems in use by our users, which meant that integrating with the leading system in one country would not benefit users in another.
Getting everyone together
Taking learnings from the Design Sprint methodology, we ran a series of mini-sessions to delve deeper into the problem. Working with bank users, product owners and technical leads we took the time to dig even deeper first. We focussed on mapping out the current experience and identifying pain points, goals and risks.
Taking learnings from the Design Sprint methodology, we ran a series of mini-sessions to delve deeper into the problem. Working with bank users, product owners and technical leads we took the time to dig even deeper first. We focussed on mapping out the current experience and identifying pain points, goals and risks.
Starting to map
The workshops accelerated progress on the project. Getting everyone in the room at the same time meant we didn’t need endless meetings or calls. Gathering technical, legal, risk, design and bank representatives all together meant we were all on the same page from the off.
The workshops accelerated progress on the project. Getting everyone in the room at the same time meant we didn’t need endless meetings or calls. Gathering technical, legal, risk, design and bank representatives all together meant we were all on the same page from the off.
Research / Ideation / Data mapping
03/ The Solution
An iterative and lean design approach
An iterative and lean design approach
Focussing on process
Using a combination of behavioural insight, user testing results, and group ideation sessions we were able to visualise the problem and outline various possibilities to address it, starting with mind-mapping exercises and then whiteboard based user journey mapping.
Using a combination of behavioural insight, user testing results, and group ideation sessions we were able to visualise the problem and outline various possibilities to address it, starting with mind-mapping exercises and then whiteboard based user journey mapping.
Reimagining the journey
The most important documents required during the lifetime of a trade are the Purchase Order and the invoice we would prioritise these first. All the main ERP platforms had the ability to export in UBL XML format, we found we could map this data to most of the fields in our Trade Creation process. On the face of it, the user journey seemed simple, but of course there were complexities behind the flow which we explored ways to minimise, providing the user with a simple integration that reduced the data entry on the platform.
Map, simplify, and repeat
We spent a good proportion of time iterating over the journey map. Building a strong journey foundation before even thinking about layout. We would go on to use this map throughout the whole project to aid conversation, support the developers and act as a springboard to quickly produce the final wireframes.
Lean MVP
We had to make some decisions about managing the scope of the project. One of the project principles was to be lean. To produce just enough of a designed project to prove a theory. Full API based ERP integration would be costly and take too much time, it was decided to opt for an MVP approach which would allow us to easily test and validate the feature and enable us to provide value-enhancing functionality to existing users quickly.
Wireframes & Prototypes
Sketching and wireframing all of the information required at each step allowed us to clearly visualise the impact on the existing app navigation, user settings and preferences and make provision for a new section to view and manage previously imported purchase orders.
An interactive wireframe was produced and used to quickly iterate designs. This then informed the creation of a high-fidelity prototype that served two purposes: one to support the developers (many of which were new to the project), and two to act as a demo to bank representatives and stakeholders.
Lo-Fi Wireframes / Hi-Fi Prototype & UI Annotations
04/ Outcomes
User-centred iterative design
User-centred iterative design
Supporting development
It's never enough to hand over static designs and prototypes. I worked closely with the development team, annotating documentation and daily design/dev huddles to ensure the design implementation and functionality were perfect.
It's never enough to hand over static designs and prototypes. I worked closely with the development team, annotating documentation and daily design/dev huddles to ensure the design implementation and functionality were perfect.
Benchmarking
By measuring task metrics at the outset during the initial user testing we were able to directly compare ‘time on task’ results for the trade creation process, both during the design phase via prototypes and upon release in real-world usability testing. These results, alongside the quantitive metrics from the application, gave insight into the usage adoption and successful streamlining of the trade creation process which saw an average time reduction of 74% when importing purchase order data.
By measuring task metrics at the outset during the initial user testing we were able to directly compare ‘time on task’ results for the trade creation process, both during the design phase via prototypes and upon release in real-world usability testing. These results, alongside the quantitive metrics from the application, gave insight into the usage adoption and successful streamlining of the trade creation process which saw an average time reduction of 74% when importing purchase order data.
Key Learnings
By implementing a Lean MVP lead approach to we were able to validate and ship a feature requirement unblocking the onboarding of key customers to the platform. Testing early and often both with real users and project stakeholders proved instrumental in validation and design.
By implementing a Lean MVP lead approach to we were able to validate and ship a feature requirement unblocking the onboarding of key customers to the platform. Testing early and often both with real users and project stakeholders proved instrumental in validation and design.
Sample of final UI components, menus and error states