Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Building Design System for Managing Design Consistency and High-Functioning Team

October 28, 2019

Building Design System for Managing Design Consistency and High-Functioning Team

UXINDIA2019: India's biggest international conference on User Experience Design which is being celebrated on Sep 9, 10 & 11 at Novotel HICC, Hyderabad.
#ux #uxindia #uxindia2019 #designthinking #uxi19 #uxconference #umodesign


October 28, 2019

More Decks by uxindia

Other Decks in Design


  1. Most of the time, business grow faster than design. Adding

    more designers Faster Design Process
  2. 2017, We started to operate. 2019 We’re the largest digital

    payments platform in Indonesia. >115M Devices >300k Modern Merchants >200k Traditional Merchants >300 Cities Here’s OVO story...
  3. Long tail use cases Largest Modern Retail acceptance >407 malls,

    >300,000 merchants #1 Ride hailing platform Grab Car, Bike & Express Widest Traditional Retail coverage >200,000 merchants Fastest growing Food Delivery GrabFood Digital payments • Airtime credits • Electricity • Insurance • P2P • Telco/Tv/Internet Parking Donation Deals Bills Cinema University #1 Ecommerce Platform Tokopedia at this stage, Fast Design Process High Quality Consistent Experience How might we drive consistent experience as open platform across all touchpoints? How might we accelerate our design process to support the rapid growth?
  4. What is Design System? Living collection of reusable design artifacts,

    guided with clear standards, to build consistent experience, in a most efficient way. Design Value & Principles Design Kit Code Library Copywriting Glossary Flow (UX) Pattern Collaboration Platform
  5. 1.Top Level Support - Dedicated resources & team model to

    build it. - Pilot project. - Show impact using their language (time/cost benefit). - Product, not project. - Co-creation. Cyclical Team Model (Federated + Centralized) by Jina Bolton.
  6. 2.Design Value and Principles - Value that our users will

    perceive on our product through the design. - Guidelines of how every design elements will evolve. - Build it together (inclusive). Human Alive Bright OVO’s Design Principles
  7. 3.Design Audit Gather all inconsistent design artifacts. - Inconsistent UI

    element. - Inconsistent illustrations. - Inconsistent tone of voice. - Inconsistent flow. - etc.
  8. 4.Define Standards - Define together (Design Pairing). - Use Atomic

    Design. - Must be self-described. - Find balance between consistency & flexibility. - Aligned name & variant across design kit & code library (use Design Token). - Don’t forget versioning (use semver, ex: 1.2.1).
  9. 6.Define Collaboration Process - Well defined change request flow with

    SLA. - Weekly alignment (Engineering, Product, Design). - Communication Channel.
  10. What’s the impact? • Reuse instead of re-create. • Automated

    decision making. • Focus on problem solving. • Faster discussion with engineers. Fast Design Process • Almost 0 repeated mistakes. • Fix once, runs everywhere. • Smaller app size. • Easier to test. High Quality • Less user confusion & learning curve. • Higher recognition on all touchpoints. • Trusted by users. Consistent Experience
  11. “We’re not designing pages, we’re designing systems of components.” Stephen

    Hay Top Level Support Design Value & Principles Design Audit Define Standards Measure the Implementation Define Collaboration Process Summary