Hatch is a content management tool that simplifies website creation and seamlessly integrates Amazon and Zappos services.
Hatch is a content management tool that simplifies website creation and seamlessly integrates Amazon and Zappos services.
Teams at Zappos were struggling to find an easy way to test and validate new ideas with customers. Before Hatch, the only CMS option was an Amazon-owned tool that was overly complex and didn't suit Zappos' needs. Zappos needed an intuitive, multi-purpose content editing experience that also passed Amazon's stringent security requirements.
We set out to build a tool that was more creative, productive, and enjoyable for any internal Zappos team to use, regardless of design or technical ability. We interviewed all potential users of the Amazon tool to understand their workflows, desired outputs, and unmet needs to inform Hatch's design.
Zappos.com has built a brand based on delivering world-class customer service through happiness. Many individuals only experience this when they call Zappos.com. For The Find, we worked to translate this feeling into a design strategy and language that celebrated the friendly, quirky, user-centric approach to a digital experience.
We have two primary user types:
The novice tends to be a merchandiser, marketer or creative director.
Today, they:
Copy/paste from pages that others have made.
Rely on Sketch to mockup layouts.
Rely on Photoshop to pre-crop images.
Need very detailed, project-specific instructions and briefing.
They want to:
Use Hatch as a tool to experiment with layouts and preview in real time.
Have shortcuts/predefined paths for frequent tasks.
Have some control over styling so they can bring their creative vision to life.
Easily insert and curate products.
They feel blocked by:
Lack of coding knowledge.
Daunting interface (hesitant to explore).
They expert tends to be a designer, developer, or someone with coding knowledge.
Today, they:
Have a firm-enough grasp of how to edit pages within the Amazon tool.
Rely on trial-and-error to manipulate blocks and make sure they render correctly.
Rely on Photoshop to create more mobile-friendly assets.
They want to:
Ensure their layouts look good on mobile.
Know how their pages are performing so they can iterate.
Have a lot of creative control so they can make fine-tuned customizations.
They feel blocked by:
Wanting more blocks/customization of components that are currently available.
After researching, we developed a product strategy and actionable roadmap based on our top-ranked objectives and understanding of users needs.
The indie streetwear market is super competitive. Creating a distinguishable identity across all channels helped Thelivery gain recognition. Making your own statement is what Thelivery is all about and is what prompted the bold typography and black and white aesthetic.
Product Opportunities Map
Epics
Site Map
For novice users, we developed a visual block library to pick from when designing a page. The block library ranges from essential components, like buttons, to more complex product modules and forms.
The indie streetwear market is super competitive. Creating a distinguishable identity across all channels helped Thelivery gain recognition. Making your own statement is what Thelivery is all about and is what prompted the bold typography and black and white aesthetic.
Previously, imagery and video content were managed in separate tools. We created a centralized media library that simplified searching and sharing across Hatch.
The indie streetwear market is super competitive. Creating a distinguishable identity across all channels helped Thelivery gain recognition. Making your own statement is what Thelivery is all about and is what prompted the bold typography and black and white aesthetic.
Hatch allows users to create and apply themes to provide extensibility and customization for several verticals, including Zappos Kids and The Find.
The indie streetwear market is super competitive. Creating a distinguishable identity across all channels helped Thelivery gain recognition. Making your own statement is what Thelivery is all about and is what prompted the bold typography and black and white aesthetic.
Team
PRODUCT MANAGER + LEAD USER EXPERIENCE DESIGNER
Kiley Davis
LEAD DEVELOPER
Porter Littlepage
PRODUCT DESIGNER
Jonathan Liang
PRODUCER
Steve Reynolds Ramos
hello@kileydavis.com