Between Us — UI review

Every Between Us screen as it is in v3.106 (6 Oct 2026), iPhone size, light mode unless marked. Rendered from the real app code with sample people. For Li Min’s request: “a lot of mis-alignment and hierarchy design”. Tap any screenshot to enlarge.

How to read: B = a real bug (things overlapping, cut off or wrong). P = a pattern that makes many screens look untidy; fixing it once fixes all of them. Screen notes refer to these codes.

8 bugs to fix first

B1Wrong title in “Introduce two friends”

The friend picker says “Who is this moment with?” (it was copied from Add a moment). It should say “Choose a friend”.

B2Empty slots collide

The two empty slots read “Choose a frie…Choose a frie…”: the labels run into each other.

B3Moment menu overflows

On a normal iPhone height the menu for a moment doesn’t fit: the last row is cut and the yellow-black overflow stripes show.

B4Request cards are cut off

The Yes / No buttons sit on top of the card: faces, the “introducer” label and the bottom of each card are hidden.

B5“Go” covers the text

In Get started, the green “Go” button sits on top of the step description (“…join your circle”).

B6Two banners overlap

“Was Gene’s introduction helpful?” is drawn on top of the “Sara is drifting” banner.

B7“Only you” twice

The person card says “Family · Only you” and then “Only you see this” on the next line.

B8Shared card is a dead end

Opening someone’s shared card shows no title and no next step; “This card is no longer shared” is grey text with nothing to tap.

8 patterns that make it look untidy

P1The top of Between Us has 3 rows that don’t line up

Title row, then a row with the light/dark switch on the left and (i) + Sparks on the right (not on the same line), then the tabs. The big green Sparks pill is the loudest thing on screen, louder than your people.

P2Panels sit on top of the drifting banner

Every panel (Introduce, Requests, Our story…) leaves the “Sara is drifting” banner peeking above it, and the panel’s handle overlaps the banner.

P3Titles are aligned differently

Some panels centre the title (“Ask Mike for an introduction”, “Requests”), others put it left (“Who would you like to meet?”, “How do you know Kate?”). Some have a grey header band, some don’t.

P4Two kinds of section heading

“HELPFUL INTRODUCTIONS” (small capitals) in My Ripple vs “Your introductions” / “Our story” (bold sentence) elsewhere.

P5Too many chip styles

Reason chips with coloured icons, plain outline name chips, green / yellow / outlined Spark chips, a “Helpful” tag… each looks different.

P6Button words change from card to card

Requests uses “Not now / Yes, connect”, “Decline / Approve”, “No / Yes” plus a separate “Not yet”. One pair everywhere is easier.

P7Heavy glow ring on buttons

Some green buttons have a second outline ring around them (tour “Next”, “Share my card”, “Replay the tour”, “Go”), others don’t.

P8Too many accent colours

Brand green, plus purple (“Say hi”, heart), yellow, orange and teal used for actions, not only for tiers.

What I need from you

After your answers I fix in this order: the 8 bugs → P2 / P3 (panels and titles) → P1 (top rows) → P4–P8 → the small notes below. Each round comes back to you with before / after pictures.

Every screen

My Orbit (light)

• P1 top rows
• Tier cards: label left, number centred
• P8 purple “Say hi”

My Orbit (dark)

• Tabs have a dark container here, none in light

Explore

• Title changes to “Explore” but the tabs still say My Orbit / Explore: two names for one place

Introduction waiting

• Two banners stacked
• Name wraps badly (“萌弟” alone)

“Was it helpful?”

• B6 overlaps the drifting banner

Tier filter

• OK

Tier up

• OK

Person card

• B7 “Only you” twice
• Name shown twice (on the globe and in the card)
• Red “0” badge on the face is unclear

More

• Warmth number tiny and far right; rows have no arrows

Private label

• P3 left title
• “Other” alone on its own row

Warmth

• Warmth panel and person card stacked: heavy

Introduce

• P2 handle on the banner
• Grey header band

Introduce (scrolled)

• Rows: some have “Cancel”, one doesn’t
• Text shows through under the header

Who would you like to meet?

• P3 left title, the next step is centred

Ask Mike

• P5 rainbow chip icons
• Text box has no border: hard to see it’s a box

Ask Mike (typed)

• Send button not visible without scrolling

Choose who introduces

• P5 a third chip style (Kate / Jenny)

No introducer

• “Share the idea” button weaker than other buttons

Introduce two friends

• B2 labels collide
• P7 glow ring

Pick a friend

• B1 wrong title

Two picked

• Title disappears once both are picked
• Faces peek out at the very bottom

Two picked (typed)

• Chips: some on their own row, some paired

From a person card

• OK

Request: introduce

• B4 card cut off
• “萌弟” wraps alone

Request: you were introduced

• B4
• P6 words

Request: shared moment

• B4

Request: was it helpful

• B4
• P6 “No / Yes” + “Not yet”

Request: share card

• B4

Nothing to review

• “You said yes. Waiting for Priya” still above the empty state

Our story

• Chat / Share our story as outline buttons: weak next to Approve

Our story (scrolled)

• Titles slide under the grey header band and get cut
• Description not aligned with the title

Moment menu (mine)

• B3 overflow

Moment menu (theirs)

• B3 overflow

Add a moment

• P5 chips
• Field label sits outside the box

Add a moment (typed)

• Focused box gets a thick black border, unlike every other field

Share card

• OK

Share card (not asked)

• Big empty space in the card when there’s no line

Waiting for Kate

• OK

Needs my approval

• OK

Declined

• “They’d rather not share” looks like normal text, not a message

Someone’s shared card

• B8 no title, no next step

No longer shared

• B8 grey line only

My Ripple

• Tip box comes before the title
• Sparks pill top right, no title in the header

Ripple list

• P4 small-capitals headings
• “Not yet confi…” cut

Pair expanded

• P5 chips wrap onto 3 lines

Ripple empty

• Step chain wraps awkwardly

How Between Us works

• Step chain wraps awkwardly (same as Ripple)

Help (scrolled)

• “Your tiers” is a wall of text
• P7 glow ring on Replay

Tour 1

• P7 glow ring

Tour 2

• Title and dots jump to a different height on every page

Tour 3

• Same jump

Tour 4

• Same jump
• Small “+0” chip floating top right

Circle is empty

• Text runs edge to edge

Get started

• B5 “Go” covers text

One more friend

• OK

New connection

• OK

Not shown: loading and error states (the sample data always loads), the full-screen reward animation (nothing opens it any more), and screens outside Between Us (wallet, chat).