Skip to content
← All projects

Help Center

One knowledge base design for two brands: the help centers where GemPages and EcomSolid customers find answers.

Role
UI/UX Designer
Company
GemPages & EcomSolid
Year
2020
Tools
UI Design Wireframing Iconography

A help center is where customers go when they’re stuck, so it has to answer the question fast and then teach them something on the way out. I worked on one knowledge-base design shared by two Shopify products, GemPages and EcomSolid, with each brand keeping its own colors and typeface.

The articles came first: we researched what makes a good help article and wireframed the pages in Balsamiq, with notes for developers and content writers, before moving to the UI.

Help Center cover and what a help center is for: answers to customers' problems, and knowledge that helps them go furtherColors (Carrot Orange, Royal Blue, Windsor, Dark Tangerine) and typography: Inter for GemPages, Poppins for EcomSolidA hand-tweaked set of line icons, and lo-fi Balsamiq wireframes of the help pages with annotationsUI design: the GemPages Help Center home pageThe EcomSolid and GemPages help centers side by side, and the Release Notes page on a laptopThe search results page, and the help center on a laptop, a tablet and a phoneThanks for scrolling. Leader: Jay Tran. Designers: Duc Dao, Nguyen Ta Anh and Neo Tran