Welcome to Pattern Lab
BC Pattern Lab reflects the patterns and components that underpin the BigCommerce product. These patterns and components provide a unified language and consistent look and feel when designing apps and products within our ecosystem.
Design Principles
Experiences over Screens
We create visual solutions that are meant to be used and experienced, not viewed. We believe in thinking through all of the entries, exits, and edge cases to ensure that every path is thoughtful and elegant. We stress test our solutions through use, not empathy.
Clarity over Simplicity
We favor the clear over the concise. Simplicity obfuscates complexity whereas we make the complex clear.
Demonstrable over Directional
We speak the language of benefits before features. We show users the way to success rather than providing them the option to fail.
Familiarity over Consistency
We have many users with disparate needs. To create frictionless experiences for everyone, we must favor the clear and familiar over consistency for consistency’s-sake.
Designers
Think of the user. While integrating Pattern Lab into designs, focus on the experience and empathize with our users. Make sure you adopt their mental model as you come up with a solution.
What do designers need?
- Sketch - Wireframes and Detailed Design
- Zeplin - Redlining
- Principle - Prototypes and Micro Interactions/Animations
- Schedule time with Catherine Batacan to walk through process of designing, promoting, and updating patterns
- Work with your durable team to get a review platform set up (github, staging etc.)
Engineers
Pattern Lab is a way to create accessible and user centric experiences on the BC Platform. It allows developers to be more efficient by providing them with well-defined reusable components and patterns.
Areas of focus
- Responsive Web Design (RWD)
- Accessibility - WCAG 2.0 AA
- Site performance
- Search Engine Optimization (SEO)
- Reusability & scalability
- Consistent UI experience
- Maintainability