Designedย by
No items found.
Subject


Bookmark
Bookmark
Category
Tech Stack
Added on
April 16, 2024

Customer.io Contact Details Structure

A Clean Customer Profile That Actually Works

First thing you notice is how well the two-column layout organizes a ton of data without feeling cramped. Left side handles identity stuff like attributes and identifiers. Right side covers activity, segments, and devices. It's a smart split that mirrors how you'd actually think about a customer.

Restrained Color, Strong Hierarchy

The palette is mostly white and gray with that green "Subscribed" badge pulling your eye right to the status. The segment chips with their little checkmark icons are a subtle but effective touch. Typography is small and functional, nothing fancy, but the bold/regular weight contrast does the heavy lifting for scannability. Tab navigation up top with that orange dot on "Drafts" is a great way to signal pending items without being obnoxious.

What Makes It Stand Out

The empty states are genuinely helpful here. Instead of just saying "nothing to see," the Devices section offers a clear CTA to view SDK docs. That's thoughtful product design baked into the UI. The left sidebar's icon + label combo keeps navigation tight. Customer.io knows their audience and it shows.
Similar screens

Upgrade to SaaSFrame Pro now to see similar examples.

Monthly

$18 /month

Billed $18 monthly
Browse all screens & flows
Filter and search screens & flows
Search text in screenshots
Access Figma files
Access mobile versions
Join now

Quarterly

$16 /month

Billed $48 quarterly
Browse all screens & flows
Filter and search screens & flows
Search text in screenshots
Access Figma files
Access mobile versions
Join now

Yearly

$15 /month

Billed $180 yearly
Browse all screens & flows
Filter and search screens & flows
Search text in screenshots
Access Figma files
Access mobile versions
Join now