Providing modern digital healthcare
I was responsible for redesigning core features and flows of the Medgate mobile app, improving and scaling the design system, as well as exploring Medgateβs branding evolution and overall embedding design as a practice across the org.
YEAR
2023-2024
CLIENT
MEDGATE
MY ROLE
UI DESIGN
UX DESIGN
DESIGN SYSTEM
BRANDING
Home screen re-design
I reimagined Medgateβs home screen which is the first touchpoint for users in the app.
Example of some of the problems the new design had to solve
Example of some of the goals the new design had achieve
Solution
Before
After
Updated navigation
Before
After
More coming soon - case study is WIP
Medgate Design System
I worked with Medgate to create a consistent design system by working closely with a design lead and developers. The goal was to re-imagine the old components to ensure they match the new look and feel of Medgate, ensure all components are consistent and adhere to same UI guidelines and manage the design documentation to maintain a single source to view components, patterns, and styles.
Approach
The principles of how the design system was shaped:
Consistency
Vsual and functional consistency across all components and elements to help users build familiarity with the interface, leading to a more intuitive and user-friendly experience.
Modularity:
Provide modular and can be easily combined or modified to create new interfaces to promote reusability, making it more efficient to build and maintain the design system.
Scalability:
Accommodate the growth of the Medgate app and allow for flexibility to handle new features and changes without compromising overall consistency.
Accessibility:
Prioritise accessibility to ensure our design system would be usable by people with disabilities.
Clarity and Simplicity:
Keep the design system simple and easy to understand, ditch the unnecessary complexity and prioritise clarity in the documentation approach,
Documentation:
Have comprehensive and easily accessible documentation to clearly explain how to use each component, have use cases, edge cases and guidance on implementation.
Flexibility:
Ensure that components and styles are flexible enough to adapt to various use cases and contexts.
Design documentation
Itβs essential that everyone in the business is aligned on the use and implementation of the design system. Guidelines were provided to give a straightforward explanation of various styles and components and how to use and employ them in designs.
To ensure a consistent visual language, thorough documentation and use cases were provided for the development teams and beyond.