eBay Design Patterns

I initiated the effort to create a pattern library to deliver a coherent and consistent customer experience across all platforms, align the UX experience against the brand attributes, from design to production, collaborating leadership, engineering and product management.

Experiences created using the shared patterns & code components

We aimed to make the designers more effective, by developing a set of standards and design tools to simplify creating a user experience allow designers to focus on the creative interesting problems and deliver the brand with consistent visual execution.

Role

I was Lead Designer for a group of six designers, a blend of Junior to Senior. My role was to be the creative foundation, to bring together all the divergent influences and weave them into a consistent and coherent design system.

I worked extensively with the team, organising the teams roadmap, managing the agile backlog and running frequent design critiques, mentoring the designers by developing their critical thinking, challenged their assumptions and crafted their design, documentation and presentation skills.

The team worked extensively with stakeholders across the business to understand and address concerns as they came up, to help increase understanding on why this work is so critical to the effectiveness of the company.

Mapping out an experience that feel appropriate to each platform, whilst delivering a consistent brand experience.

Approach

eBay’s previous experience had an incredible range of divergent design solutions, differences between each platform and sometimes generations of pages within the same experience.

Pattern audits & research

We started this process by auditing the current experiences across all platforms, drawing together all the different examples and use cases, then narrowing and refining the information and interactions we need each pattern to support.

The surprise was how much detail you can go into with even the simplest control or element, the rigour that can be applied to patterns goes a long way, and now acts as a foundation, regardless of how the visual standards will change over future years.

Item tiles sketch symbols

Challenges

Designers are divergent by nature, always wishing to create a unique experience. The system allows designers to start with a common framework of patterns, then remix them in creative ways, using something familiar to the customer, and well engineered and applying it in new and interesting ways to help solve customer problems.

The internal design community has been hugely supportive of the change, championing the effort and have adapted their workflows to leverage the tools created. The surprise was how little selling of the idea was required for designers to support the efforts!

Outcome

One of the by-products of the pattern creation process is building much stronger ties to engineering, by applying a degree of engineering to design, we have greatly increasing the reuse of code, leveraging a higher quality of fit and finish (because someone else has focused on the small parts, they are able to leverage that and focus on the new and creative parts) and reduced the time to market for both design and development.

With design pattern tools for designers, the whole experience can more easily be updated with new design trends or interaction methods. It allows you to never leave any page untouched in a global update.

Finally, creating order and structure also allows you to do more experimentation. If an experience is using a common set of components, it’s much simpler to run multivariate tests, to try out alternative content, layouts or visual styles to understand what is most effective to the end user, which helps the business optimised for greater conversation.

Documentation for patterns