Problem
Obsolete and disheartening Android configuration
The primary challenge was aligning the design across three distinct platforms, each with its own set of guidelines and user expectations. Additionally, coordinating between separate teams for web and mobile development required effective communication and collaboration.
Bridging Guidelines and Team Coordination in Development
The primary challenge was aligning the design across three distinct platforms, each with its own set of guidelines and user expectations. Additionally, coordinating between separate teams for web and mobile development required effective communication and collaboration.
Process
Strategic Planning
Discovery Phase
Conducting a comprehensive product tour and inventory to identify key components and critical issues.
Concept phase
Consolidating and documenting guidelines that emerged during the discovery phase.
Workshop
The workshop's objective was to structure clear and maintainable documentation that defines main styles and components, promoting visual consistency and knowledge sharing among designers, developers, and researchers.
Component Definition
Identifying and defining key components such as typography, colors, buttons, forms, and grids.
Establishing naming conventions to ensure a shared vocabulary and avoid confusion.
Documentation
Creating detailed documentation that organizes and defines the main styles and components, their specifications, and functions. This documentation serves as a reference to promote visual consistency and knowledge sharing among team members.
Implementation and Iteration
Implementing the design system incrementally, starting with a strategic phase and followed by progressive releases. Regularly updating and refining the system based on feedback and evolving project needs.
Solution
Versioning. Building Blocks of Design.
A versioning system was implemented alongside Abstract, ensuring all team members accessed the latest design files while maintaining a clear history of changes and establishing a structured file hierarchy.
Pattern Inventoy. Crafting Cohesion.
Comprehensive collections of design patterns tailored for iOS and Android platforms were developed, facilitating consistency and efficiency in mobile app development.
UX Pattern Library
Categories for a UX design system were documented, including rules for formatting, principles of user experience, common and specific workflows, links to design and technical resources, and a list of content for further exploration.
Workshop Deliverables
Knowledge Repository
Established a valuable repository of knowledge that has informed numerous reports and suggested corrections throughout the analysis period.
Guided Navigation Principles
Formalized essential principles of navigation and architecture, ensuring consistency and clarity in design.
Comprehensive Handover
Facilitated the transfer of previously undocumented knowledge, consolidating insights that were scattered across various teams into a unified resource.
Asset optimisation
Reorganizing and standardizing thousands of files to address inconsistencies that accumulated over time