Transforming Ruleguard’s UX: Constructing the Design SystemNovember 2, 2020
Transforming Ruleguard’s UX: Building the Dashboard
Ruleguard (FKA AxiomHQ)
Ruleguard is a web-based Regulatory-Technology SAAS product that enables financial institutions to streamline their regulatory and compliance processes and workflows. The London-based Start-up was at a stage of rapid growth and there was a strong need to transform its User Experience to meet up with clients’ and investors’ expectations.
As the sole UI & UX designer, I had the opportunity to fully champion and execute all aspects of the redesign of the User Experience of the Ruleguard platform, after the success of the design system, the subsequent project in the process was the redesign and overhaul of the user Dashboard.
Project OverviewThe objective of the project was centred around simplifying and streamlining regulatory and compliance processes and workflows for the end users while leveraging the new design system to address specific pain points and improve the usability and aesthetics of the platform.
In order to fully comprehend the task ahead, I scheduled meetings with the product leaders to gain some understanding of the product roadmap, then subsequently had engagements with the Sales and Support team for insight into the user’s pulse and perspective.
Insights from those engagements birthed the problem statements highlighted below:
- Compliance managers struggle to keep up with a high volume of regulatory updates.
- Risk managers find it difficult to consolidate data from multiple sources for accurate risk assessments.
- The need for real-time notifications to address compliance issues promptly.
- Technical constraints related to data integration and system compatibility.
Research & Analysis
Extensive research was conducted to understand the needs of the clients & business stakeholders and to seek avenues and opportunities for improvement.
The research goals were to:
- Understand the daily workflows and pain points of compliance and risk managers.
- Identify specific user needs that would enhance their regulatory and compliance processes.
Some of the research methodologies I employed were:
- I conducted in-depth interviews with our actual users who comprise compliance and risk managers across various financial institutions.
- I collaborated with the sales team to distribute surveys using Typeforms to gather quantitative and quantitative data on their daily workflows and pain points.
- I also facilitated a Card Sorting exercise with business stakeholders and clients to gain insights into their interpretation of the taxonomy to provide insight into improving the Navigation.
- I conducted some SWOT analysis on Competitors to get a better understanding of industry standards and best practices.
- I also inspected some existing Google Analytics data to have a better understanding of the current user behaviour and look out for patterns and pain points.
Key Insights & Findings
After thoroughly analysing the qualitative and quantitative data from the research, some crucial insights were unearthed summarised below:
- Users struggled with the sheer volume of regulatory updates and required a centralised dashboard for regulatory updates, rather than relying on scattered resources.
- Users found it challenging to consolidate data from multiple sources and required robust data visualisation tools to facilitate accurate risk assessments.
- Users expressed a need for real-time notifications to address compliance issues promptly.
- Users often felt overwhelmed by data and sought simplified, customisable views.
Leveraging the UI components in the Design System I had developed earlier in the product lifecycle, I was able to build an intuitive and visually appealing design. The design approach comprised of incorporating a new intuitive navigation, dynamic dashboard widgets, real-time notifications, and customisable data tables, to transform the compliance and risk management experience for our users.
1. Restructuring the Navigation System
The navigation system featured a persistent menu on the left, with custom icons based on the Material Design Icon theme. The magnitude of regulatory updates and tasks to perform can overwhelm the users, making a revamp of the navigation system essential. To address this challenge, I incorporated insights from the card sorting exercise and designed a user-friendly navigation system that uncomplicated the previous structure, hierarchy and taxonomy. Users can now access critical modules effortlessly with all relevant updates, neatly categorised and displayed. The redesigned Navigation helped them stay in touch, made relevant information accessible and was visually appealing.
2. Managing Data Consolidation with Dynamic Dashboard Widgets
Consolidating data from diverse sources for accurate risk assessments was a complex task that our users faced daily. In response, I introduced dynamic dashboard widgets that transform data consolidation into a breeze. Users can select from a range of dashboard widgets tailored to their specific needs, such as risk heatmaps, compliance trackers, and data visualisations. The customisable nature of these widgets, also enabled users to curate their dashboard for a focused and efficient data management experience, empowering them to make informed timely decisions.
3. Real-Time Informative and Actionable Notification System
As inferred from research, real-time notifications are a critical component of the dashboard. Compliance Managers and Risk Managers now receive immediate alerts on compliance issues in an Inbox, and it has been made front and centre in the design, receiving a dedicated navigation item, thereby enabling them to respond promptly and maintain regulatory compliance. The design of these notifications, strikes a balance between visibility and non-intrusiveness, matching real-world usage as seen in other mail and notification platforms, ultimately ensuring that users are always notified and informed to take swift action where necessary without disruption.
4. Simplified Data Management with Customisable Data Tables
The challenge of users feeling overwhelmed by data led me to design customisable data tables. These tables allow users to personalise their data views by selecting relevant columns and applying filters. Users can adjust their data tables to match their unique workflows, effectively simplifying data management and reducing cognitive load.
Usability Testing & Handoff
I developed High-fidelity prototypes of the designs in Figma, before proceeding to facilitate Usability testing sessions with some of our real users, which revealed areas for improvement. I then proceeded to refine some aspects of the dashboard’s layout and interactions, making it more intuitive and user-friendly before proceeding to hand it off to the developers..
Throughout the redesign process, we conducted regular sync-ups to address any questions or concerns. This iterative communication helped clarify design decisions, ensuring the development team understood the implementation and making sure we could address technical feasibility concerns as they came up.
I was also sure to document the redesign and make annotations in Figma to explicitly identify things like spacing, layout, responsive breakpoints e.t.c.
The developers were familiar with working with Figma, so the handover process was quite seamless.
By improving usability and streamlining processes this dashboard redesign project has shown that thoughtful design can alleviate challenges and empower professionals even in the seemingly complicated Governance, Risk and Compliance sector.
After the launch of the redesigned version, we experienced a remarkable transformation in user satisfaction. The Net Promoter Score (NPS) soared to an impressive 75, signifying a significant improvement in customer loyalty and advocacy. The feedback we received from our users was overwhelmingly positive.
Some key lessons learnt from this process:
– Collaboration with end-users is invaluable in creating a user-centric solution.
– Balancing feature richness with simplicity is key to catering to complicated features and diverse user preferences.