Protected Case Study

Please enter the password to view this project.

View Project Summary โ† Back to Portfolio
Part one of the Trove case study series. See Part 2, Research, Brand & Accessibility for the process behind the design.
Trove Market
Design case study
UX & visual identity walkthrough

A marketplace built for makers the internet forgot to design for.

Trove is a web and mobile marketplace where neurodiverse entrepreneurs sell what they make, and where accessibility isn't a checklist bolted on at the end, it's the layout decision itself.

Role
Product & UX Design
Platform
Web & Mobile
Sector
Inclusive E-commerce
Live site
trovemarket.com
01 - The brief

Talent doesn't ask permission. Marketplaces shouldn't either.

A short framing of what Trove is, who it's for, and the gap it was built to close.

Trove is a marketplace that empowers neurodiverse entrepreneurs, artists, and creators to showcase and sell their products in an inclusive, supportive environment.

More than a storefront, it's built to promote financial independence and equal opportunity. Trove connects talented makers, many of whom face real barriers selling through mainstream platforms, with customers who specifically want to support neurodiverse-owned brands.

Every screen had to do two jobs at once: read as a warm, joyful, gift-shop kind of place, and hold up to genuine accessibility scrutiny, not as an afterthought, but as the design brief itself.

Who it servesNeurodiverse sellers
Core promiseFinancial independence
Partner tiers2 (Seller Support ยท Storefront)
Category breadth13 shop categories
Min. text contrast target4.5 : 1 (WCAG AA)
02 - The system

A palette that had to pass the test, not just the mood board.

Every brand color in Trove's system was paired and contrast-checked against ADA / WCAG guidance before it shipped, not chosen and verified after the fact.

Primary - Maroon
#931A47
8.4:1 on cream - exceeds AA
Secondary - Teal
#0E5662
8.3:1 on cream - exceeds AA
Accent - Lime
#A9D044
3.0:1 - large text / UI only
Accent - Coral
#EF4D23
3.6:1 - large text / UI only
Accent - Gold
#F4C326
Background & iconography only
Accent - Blush
#F7A1A0
Background & iconography only
Neutral - Mist
#E9E9EA
Surfaces & dividers
Neutral - Fog
#EFEFF0
Surfaces & dividers
Typeface - Lexend
Chosen in part for its proven reading-fluency research
LightBig talent, bold dreams.
RegularBig talent, bold dreams.
MediumBig talent, bold dreams.
SemiboldBig talent, bold dreams.
BoldBig talent, bold dreams.
ExtraBoldBig talent, bold dreams.
BlackBig talent, bold dreams.
03 - Page walkthrough

About, turning a mission statement into a scrollable argument.

Three live pages from the shipped site, annotated for the decisions behind them.

About page

The story does the convincing before the copy does.

The hero leans on a single photograph, hands mid-craft, paint still wet, rather than stock imagery of "diversity," because Trove's case is best made by showing the work itself.

A pull-quote in a hand-drawn-style border breaks up the founding story so the single sentence that matters most, "big talent, bold dreams," doesn't get lost in paragraph text.

  • Maroon-on-cream headline holds 8.4:1 contrast at any size
  • Underline squiggle motif reused as a section divider throughout the site, giving scroll rhythm without new components
  • Asymmetric circular photo crop softens an otherwise grid-locked layout
trovemarket.com/about
Trove About Us page hero section with headline 'About Us' over a photo of hands painting pottery on a wheel
About - heroFull-bleed photography, single headline
About page

Vision, mission, and impact - three colors, one shape, zero ambiguity.

Rather than writing one long mission paragraph, the page splits Vision / Mission / Social Impact into matched gold cards. Identical shape and weight signal "these three things are equally important," which the copy alone wouldn't do.

  • Gold cards reserved for background use only, body text inside stays near-black for contrast
  • Bulleted "Social Impact" list converts abstract mission language into concrete outcomes (reduce unemployment, foster participation, inspire inclusion)
Trove About page section titled Our Purpose and Promise showing three gold cards for Vision, Mission, and Social Impact
About - Purpose & Promise3-card mission breakdown
FAQ

An accordion that respects three different readers at once.

Sellers, buyers, and support partners all land on the same FAQ page with very different questions. Rather than three separate pages, the accordion groups by audience (General, Products & Services, Seller Requirements, Buyer Guidelines, Accessibility, Disputes) so each visitor scans past what isn't theirs in seconds.

  • Open state uses a pale-blush fill instead of just bold text, visible to low-vision users who rely on shape/color, not just type weight
  • Plain-language framing ("Got questions? We've got answers") keeps a legal-adjacent topic, ADA disability disclosure, from reading like a terms-of-service wall
  • Inline policy links are underlined and bolded, never color-only, so they're identifiable without relying on hue
trovemarket.com/faq
Trove FAQ page hero with title FAQ's and subtitle Got questions? We've got answers
FAQ - heroSame template language as About, for brand cohesion
Trove FAQ accordion list showing General Questions expanded with answer about who can sell on Trove Market
Open-state fill 5.1:1
Link text 6.9:1
FAQ - audience-grouped accordionAnnotated with measured contrast ratios
04 - Flow design

Becoming a partner, mapped before it was wireframed.

"Become a Partner" and "Sell on Trove" are deliberately separate flows, organizations supporting sellers vs. individual makers selling directly.

01

Why partner

A plain-spoken landing page states the trade clearly: bring your community of sellers, get a ready-to-use marketplace and training resources in return.

02

Choose a tier

Two tiers, Seller Support Partner and Storefront Partner, are laid out by who they're for and what they unlock, not just by price.

03

Apply

One long-form application - org info, point of contact, billing - replaces a multi-step wizard, so progress is never hidden and nothing resets on a slow connection.

04

Confirmation

A warm, specific "thanks for reaching out" moment with a clear next step back into the shop, no dead-end confirmation screen.

Tier ยท for organizations

Seller Support Partner

501(c)(3) nonprofits or service agencies providing ongoing support to sellers.

  • Coach, train, or support one or more sellers
  • Access Trove's onboarding & training resources
  • View performance data for affiliated sellers
  • Optional branded storefront
Annual access fee$10,000
Application form

One scrollable form beats five clever steps.

Multi-step wizards look modern, but they hide how much is left and punish anyone whose connection drops or whose attention resets. The partner application is a single page, grouped into three honestly-labeled sections: Organization Information, Primary Point of Contact, Billing Address.

  • Required fields marked with a high-contrast coral asterisk, not color alone
  • Generous label-to-field spacing (24px+) reduces misclicks for users with motor-control differences
  • Checkbox copy reads as plain sentences ("My organization directly supports entrepreneurs with disabilities") instead of terse labels
Trove Become a Partner application form showing Organization Information, Primary Point of Contact, and Billing Address sections
Partner application - full formSingle scroll, three honest sections
Confirmation state

Don't just say "submitted." Say what's next.

The confirmation modal commits to a timeframe ("we'll respond within 24 hours"), uses warm second-person voice, and gives one clear way back into the product, never leaving someone staring at a dead-end "Thank you" screen.

Trove confirmation modal reading Thanks for reaching out with a Continue shopping on Trove link
Confirmation modalSpecific timeframe, one way forward
05 - Homepage

Shop with purpose, without the purpose getting preachy.

The homepage carries the heaviest message-to-commerce ratio on the site, mission framing and an actual functioning storefront, in the same scroll.

Homepage

The hero sells the mission. The grid sells the product.

A lime "Shop with purpose" card sits directly over a real seller's photograph rather than illustration, establishing in one screen that this is people, not just inventory. Immediately below, a standard featured-product carousel keeps the page from feeling like a charity appeal instead of a marketplace.

  • Lime card text holds 3.0:1+ at large/bold weight, meeting the large-text AA threshold the stylesheet specifies
  • Carousel arrows sit outside the image bounds, large enough for low-precision pointer use
trovemarket.com
Trove homepage hero with a 'Shop with purpose' message card over a photo of a woman holding a plant in a shop
Homepage - heroMission framing over real seller photography
Homepage

Two "why sell" sections, two different jobs.

The homepage repeats "Why sell on Trove?" twice, deliberately. The first, three-column version sells the buyer on the impact of shopping there. The second, paired with a real seller's photo, sells a prospective seller on the income and support. Same headline, two audiences, no confusion about which is which because the surrounding content disambiguates instantly.

Trove Why sell on Trove three column section: Discover unique handcrafted products, Make a meaningful impact, Shop with confidence
Homepage - buyer-facing impact framingSpeaks to the shopper
Trove Why sell on Trove seller-facing card with a photo of a man embroidering, listing Turn passion into income, Inclusive and accessible platform, Low fees high support
Homepage - seller-facing income framingSpeaks to the maker
06 - Reflection

What carried across every screen.

Three principles that held the system together, beyond any single page.

A1

Accessibility as layout, not overlay

Every brand color was contrast-tested against its real background before it shipped, visible in the stylesheet's own ratio annotations, which this case study borrows as its own visual language.

A2

Two audiences, one voice

Buyers and sellers needed different content on the same pages. Rather than splitting the site, copy and layout pairs were duplicated and re-angled, same warmth, different stakes.

A3

Joy without minimizing the mission

A gift-shop palette and playful iconography carry real institutional content, disability disclosure, 501(c)(3) requirements, ADA criteria, without the site reading like a legal document.