Market Mate AI Dashboard.

Optimum Credit wished to develop their Broker portal that delivers an end-to-end second charge mortgage journey. 

As previous iterations had been built in a development silo, the system was missing some perspective from the user and with moving to an Angular SPA there was also room to improve the continual improvement and road by bringing in components with a design sytem.

Discovery.

After initial discovery, understanding who the user was, creating personas and what the technical constraints and opportunities were I undetook a heuristic review, user shadowing with end users and an expert review on the existing UI, the insights were remarkable and led to a great collaborative project with development teams.

What we learned

From the data gathered 86% of all traffic would be mobile and customers expected to self serve in less than 6 minutes.

Definition.

Working prototypes were created using Sketch and Invision. Extensive testing was carried out with users to validate assumptions, feedback was triaged, prototypes were then iterated and benchmarked.

Previous issues had been around designs not being pixel perfect, inconsistent styling and guesswork made by developers.

What we learned

That 90% of all components were reusable so creating a library with states, variations and use cases dramatically sped up the development time saving time, effort and cost.

Design, Develop & Deliver.

We built the high-fidelity prototypes using Adobe XD defining the brand color, typography is then defined based on accessibility and hierarchy, states are define for interactions and further testing is carried out based on Tasks and 5 second rules. Once all tested and agreed all elements are broken down into a transferable design system for handover to the development teams

What we learned

Users liked the simplicity of the designs, understood the RAG status colours, really easy to complete tasks based on finding applications.