Illustration of Amazon Smile logo with Brand Portal hyperlink underneath it

Amazon Brand Portal

2017

Build a single source of brand truth for one of the most customer-centric companies in the world. Amazon‘s first brand portal removes friction and unifies all its brands under one roof.

UX design
Site architecture
Brand guidelines
0 to 1
Consultation
Illustration of various Amazon brands chasing for  assets

House of motley crew

Amazon comprises a diverse range of smaller “companies,” each with unique customer segments and brand standards. Without a centralized hub for brand guidance, brand owners (before 2018) had to track down assets, guidelines, Q&As, and points of contact through various channels, emails, and file sharing. It was an inefficient and confusing process that led to inconsistency and poor judgments.

Outlook mail UI showing a brand guidelines PDF as an attachment

Version control was a nightmare when brand owners and partners relied on email file attachments, which led to the spread of outdated content.

Diagram illustrating the function of a centralized hub

A centralized hub for brand guidelines was required to lessen frustrations and give all brand marketers and designers a trustworthy source of truth and one-stop brand management.

Two examples of brand guidelines' table of content

Converting long-form formats

Each Amazon brand operates in a different customer market at a different pace of growth. Therefore, the brand guidelines are at various stages of brand maturity and need. The image above shows the table of contents from two brand guidelines (PDFs) to illustrate the content gaps between brands and how each brand structured its content differently. The brand portal design has to be a flexible workhorse that can work well with various states of long-form content.

Parsing out a brand guideline's table of content into top navigation for Brand Portal

The combination of top and side navigations is the ideal structure to house the different depths of content needed across brands. Most brand guidelines can be parsed into three top-nav categories while fitting high-level information into the home landing page. The site can comfortably have up to six top navigation links.

Design studies showing  3-level side navigations for various brands

The side-nav can display three tiers of navigational links. The first and second-tier links are links to pages and sub-pages, and the third-tier links are anchor links within the page. Different brand guidelines necessitate the use of all three levels of navigation. This exercise examines which side-nav systems look and work best for different brands and portal users.

Reformatting an existing PDF slide into a section on the Brand Portal

After the title, the content on the site should lead with an image. When the guideline leads with an image before a variable body copy length, this design tenet helps readers absorb the content more effectively by connecting the headline with a visual. Since all the pre-existing brand guidelines (PDFs) are built differently, this content reconstruction of the hierarchy for consistency is required but pretty straightforward.

Side by side comparison of text heavy pages

This exercise explores the optimal placement of the long-form body on the screen. While most people are accustomed to a left-aligned body because the content is neatly tucked together, having right-side content offsetting the left-aligned headlines has its benefits. It is consistent with the above-mentioned design tenet: show it before discussing it. More importantly, scanning for blocks of information and earmark labels becomes more effortless since it utilizes negative space to break up large bodies of content.

Self-service workhorse

The brand portal is designed to be a workhorse that democratizes design, making it accessible to all Amazon brand owners. With Wagtail CMS, brand owners can quickly add content with a variety of content blocks and tools, giving them seamless control over their brand guidelines with zero coding. The utilitarian design of the portal allows the brand owners to build guideline pages without asking them to rethink their assets. This low friction boosts site adoption for owners and shortens their page-building timeline. Predefined templates ensure any content published looks consistently well presented across brands.

Wagtail CMS tools for Brand PortalBrand Portal's flexible components
Brand Portal's flexible download component

Brand owners can effortlessly insert the download module anywhere and repurpose it across pages and sites. I designed the download module for high visibility and easy stacking. Cover art thumbnails and descriptions inform the users of its content.

Brand Portal's color palette component

Clicking on a color swatch in the palette module brings up a full flood of color to better assess a color’s presence. To the left of the palette are selectable color formulas, as well as a convenient WCAG tracker to ensure that color contrast is easily accessible.

Truth be told

To be the single source of truth, the adoption of other brands is critical. The design is intended to be a workhouse for brand guidelines with a low barrier of entry for Amazon’s “startup-like” brands. Every brand has a different level of maturity and creative resources. Therefore, it's wise to approach the portal design in a more democratic manner, moving away from the "coffee table book" approach that other large brands have the capacity for. The brand portal aims to strike a balance between flexibility and protective guardrails that are beneficial to both brand owners and creators.

Amazon Retail Brand pages on Brand PortalAmazon Retail Brand pages on Brand Portal

One-stop shop

Global brand stakeholders at Amazon and their cross-organization partners don't have to worry about outdated content resurfacing because they have a centralized hub for brand guidance and assets. They can focus on collaborating, unblocking creativity, and improving efficiency.

Amazon Brand Portal homepage hub
Various pages of other Amazon brands on Brand PortalVarious pages of other Amazon brands on Brand PortalVarious pages of other Amazon brands on Brand PortalVarious pages of other Amazon brands on Brand PortalVarious pages of other Amazon brands on Brand PortalVarious pages of other Amazon brands on Brand Portal

Credits • Content by the respective Amazon brand parties • Dev John Leonard and team