Assured Data Protection delivers solutions to help businesses build their resilience to cyber attacks and vulnerabilities.
Their product contains a lot of complex data and their existing user interface was letting them down. They challenged us to refresh the platform design and reskin their React.js app by only updating the CSS and Javascript code.
- Lead time:
- 6 Weeks
- Sector:
- Cybersecurity
- User:
- Chief Security Officers, Chief Technical Officers
- Goal:
- Improve the user experience, Create a flexible design system
- Services:
- UI Design, UX Design, Frontend Development
Before and after
The Challenge
The key project challenge was that all design changes were restricted to what could be achieved with updates to the CSS and Javascript code. Our design and development teams needed to work closely to ensure that the design updates were achievable in line with the brief.
The existing solution
The existing interface was dated and cramped, with valuable screen space lost due to poor interface structure. By re-structuring the navigation and mapping the new user journeys, we created a cleaner and more intuitive interface.
- The Approach
- Workshopping
- Adobe XD Wireframe Prototypes
- Adobe XD Design Prototypes
- Frontend Development
- QA and Testing
- The Team
- 1x Senior UX Designer
- 1x UI Designer
- 1x Frontend Developer
- 1x Quality Assurance Tester
- 1x Technical Project Manager
Flexible UI Framework
We created a design system that could be applied across the platform using just CSS and Javascript code.
Intuitive navigation
We implemented a new navigation framework that enables users to access deep and complex information in a simple way.
Interface search
We designed a new ‘quick search’ function to help users rapidly find specific information.
Priority flagging
We created a simple design style to flag the priority of risks. This enables users to quickly identify priorities upon logging into the system.
“They were excellent, organized, and prompt. Very often, we were the ones slowing the project down.”
