Case 01 — UI/UX & Product Consumer Networking PWA 2026
Rarely Heard Voices

Rarely Heard Voices

Designing the private network for retail's most senior leaders.

Client

Rarely Heard Voices — a curated retail-executive community

Role

Product DesignUI/UXDesign SystemPrototyping

Platforms

iOSAndroidWeb

Year

Launch build 2026

6Membership tiers
40+Pages designed
50+UI components
2Languages (EN/ES)
1Gold accent
01 — The brief

The room is the product

Rarely Heard Voices is an invitation-only community for senior retail executives — founders, C-suite, brand partners and the next generation of leaders. They had built one of retail's most respected gatherings, but the energy lived in the room and dissipated in the weeks that followed. Business cards were lost, names forgotten, conversations stalled.

The brief was a private, mobile-first product that felt as considered as the rooms it convenes: something that protects members' attention, respects their seniority, and turns face-to-face moments into a year-round network — without ever feeling like another social app.

"The room is the product. The app should feel like the room."

That one line shaped every screen — from the editorial serif type and single gold accent to the deliberate absence of likes, follower counts and infinite feeds. RHV is a tool for relationships, not engagement metrics.

02 — Design principles

Four rules for a quiet network

01 Editorial over social

Cormorant Garamond display type, generous whitespace and a single warm gold on cream. It reads like a members' journal, not a feed — restraint signals seniority.

02 Quiet by default

Notifications, reactions and badges are deliberately restrained. Trending content is shown as a calm pulse bar, never a leaderboard. Reactions are limited to three meaningful options.

03 Two-sided by design

Every networking action — a "Would Like To Meet" request, an intro, a board bid — requires mutual consent before it surfaces a connection. Nothing is one-directional or spammy.

04 Native-feeling on iOS

100dvh viewports, safe-area-aware bottom navigation, pull-to-refresh and GPU-composited transitions, so the installed PWA is indistinguishable from a native app.

03 — Information architecture

A tiered community, with an invisible inner circle

RHV runs on six membership levels, including a discreet "inner circle" — the Boardroom — that had to remain invisible to outsiders, appearing as standard C-Suite to lower tiers. The directory, every filter and every search query stay in sync with a single tier-aware visibility contract: members only ever see peers at their own tier or below.

To keep the inner circle represented without exposing it, Boardroom members can elect a public-facing proxy from the wider community — so the tier stays hidden while still having a voice in the room.

04 — The experience
RHV member profile screen with photo, role, company and community tags
Member profile
RHV searchable, filterable member directory grid
Directory + filters
RHV My Network screen showing WLTM requests and connections
WLTM & network
RHV locations map view with members grouped by city
Locations
RHV events list with RSVP status
Events
RHV event detail with RSVP and registration
Event RSVP
RHV restrained notifications panel
Quiet notifications
RHV members grouped by country with map
Members by region
05 — Defining flows

"Would Like To Meet"

The product's signature mechanic. Rather than a one-tap follow, a member sends a structured request to meet another member — with context for why. The recipient accepts or declines. Accepted requests become a mutual connection that unlocks messaging. A separate WLTM Board lets members post open requests for the community to bid on.

Messaging itself is two-party, with text and recorded voice notes, typing indicators, read receipts and a read-tracker that survives reloads. The social feed is built from typed posts — signal, question, insight, data, request — rather than free-form status updates, with anonymous posting for sensitive topics and rate limits that prevent flooding. Events add RSVP, QR check-in and a matchmaking engine that suggests who's worth meeting based on tier, location and shared communities.

06 — Design system

One gold. Two typefaces. Fifty components.

The visual identity is editorial, restrained and built around a single warm gold. The system is small on purpose — so the member PWA, the admin console and the event-day tools stay visually one product.

RHV Gold#b8a456
Gold Light#d4c88a
Gold Dark#8a7a3f
Cream#faf9f6
Charcoal#333333

Display — Cormorant Garamond

Aa — Member names & headlines

UI & body — Inter

Tuned for small sizes on retina iPhones — the entire interface and every label.

50+ React components cover everything from MemberCard, FilterBar and the BottomNav portal through to specialised pieces — VoiceRecorder, PullToRefresh, ProxyPickerModal, EventMatchmaking, the TrendingPulseBar and the SponsorSpotlight rotator.

07 — Outcome

Quiet, considered, built for the people in the room

RHV shipped as a magazine-quality mobile experience that members install to their home screen and use like a native app. Sponsor surfaces feel like editorial placement, not ads. Every networking action is deliberate and two-sided. The result is a private network that respects its audience — and a design system disciplined enough to power the member app, the admin console and the event-day tools as one coherent product.

Curious how it was built? See the engineering case study — one React codebase shipping to web, iOS and Android.

Next — Case 02

The App Build