The Product Design Guide is a high-level guide for building products in a smarter way, by making designing and front-end development cheaper, easier, and faster. Guide offers content around:

  • Design principles
  • User interface library for designers
  • Coded library components for developers

We created a smarter way to build products, by designing and developing identical components once, that can be reused across our entire product ecosystem. Gains included:

  • Cost effective to create and maintain single ”super” components.
  • Saves time by designing once and building once.
  • Consistent and high-quality UI across all products.
  • Reduces the learning curve for users with multiple D&B products.
  • Frees up time to solve problems for ”unique” product features.

Key players included:

  • Leader of User Experience
  • Lead User Interface Designer
  • Front-end Developer
  • Created rough Information Architecture and layout mockups for the site.
  • Worked with a UI Designer to carry the sites vision forward by enhancing the copywriting and supporting graphics.
  • Designed global product user interface styles and components library.
  • Worked with a front-end Developer to build the components with high-quality interactions and usability.
  • Pencil & Paper
  • Photoshop (wireframes & user interface designs)

My Role & Contributions

  • Project Manager
  • Lead UI / UX Designer
  • Information Architecture
  • User Interface Design
  • Interaction Design
  • Style-guide Creation
  • Pattern Library Creation
42

Colors

7

Font Styles

71

UI Components