Skip to content

Samsung One UI — exact build reference (founder's Galaxy)

Authoritative spec from the founder's device screenshots (2026-06-23). Rule from Hari: build the UI from scratch in One UI; do NOT re-skin Linphone's layouts. Keep Linphone's engine + view-models + endpoints; wire them into brand-new One UI layouts. "I completely do not need the Linphone UI feel."

One UI design system (applies to every screen)

Token Value
Canvas background light grey #F4F4F4/#FAFAFA (NOT white) for list/settings; white for the keypad
Cards white, ~26dp rounded corners, full-bleed-width with ~16dp side margins, generous inner padding (~20dp), no/ް very soft shadow, separated by ~12–24dp grey gaps
Titles large, bold, near-black (e.g. "Phone" centered ~28sp; "Display" left ~24sp). System sans-serif = SamsungOne on device
Body / labels dark grey for primary, mid-grey #8A8A8A for secondary/sublabels
No coloured app bar. Top area is the plain canvas; only a top-right icon cluster (line icons): e.g. tag · search · ⋮, or + · search · ⋮
Bottom navigation floating capsule pill centered above the gesture bar — white pill, contains Keypad · Recents · Contacts (icon over label); the selected tab has a light-grey rounded-pill highlight behind it; line-style icons
Accent blue for toggles/selection/slider; green for the call button (Astradial: keep brand blue as accent, green call button)
Avatars circular, soft gradient fills with white initial (e.g. C=blue, E=blue-purple, F=purple, orange for "no profile")
Touch feedback borderless ripple; no boxed key backgrounds

Screen 1 — Keypad (screenshot #1)

  • White full screen, no header bar. Top-right: tag, search, ⋮ line icons.
  • Large empty number-display area at top (shows typed digits, big & thin; backspace appears when non-empty).
  • 4×3 grid, borderless (no key backgrounds):
  • each key = large thin number (~40sp, sans-serif-light, near-black) centered, with small grey letters beneath: 1 → voicemail ▢⃝ glyph; 2 ABC, 3 DEF, 4 GHI, 5 JKL, 6 MNO, 7 PQRS, 8 TUV, 9 WXYZ; * (no sub); 0 with + beneath; # (no sub).
  • letters: tiny, spaced, uppercase, mid-grey.
  • Green circular call button (~72dp, white phone glyph) centered below the grid.
  • The floating pill nav sits at the very bottom (Keypad selected = grey pill).

Screen 2 — Settings style (screenshot #2, "Display")

  • Light-grey canvas; back ‹ + bold left title "Display".
  • White rounded cards group rows; toggle = blue pill switch, slider = blue, selected card = blue 1.5dp outline.
  • Choice cards (Light/Dark) = white card with preview thumbnail + radio. → Use for Astradial Settings.

Screen 3 — Phone / Contacts landing (screenshot #3)

  • Light-grey canvas. Large centered title "Phone" + grey subtitle "12 Contacts". (Astradial: title + line/contact count.)
  • Top-right cluster: + search ⋮.
  • White rounded cards stacked: avatar + "No profile info"; star-avatar + "Add your favorite contacts"; group-avatar + "Groups".
  • Floating pill nav (Contacts selected).

Screen 4 — Contacts list (screenshot #4)

  • Light-grey canvas; section letters (C, E, F…) as small grey labels above groups.
  • Each contact = white rounded card: gradient circular avatar (initial) + bold name.
  • Tapped contact expands into a taller card: bold name, Mobile …number… ›, and an action row of circular icon buttons — call (green phone), message (blue), video (green), info (grey).
  • Floating + / search / ⋮ pill top-right; bottom pill nav.

Screen 5 — Home (screenshot #5)

  • Context only: One UI home, green Samsung Phone icon = the system dialer we emulate.

Astradial mapping (engine kept, UI new)

One UI screen Wire to (keep)
Keypad NumpadModel / StartCallViewModel (digit append, startCall)
Recents HistoryListViewModel (core.callLogs)
Contacts ContactsListViewModel (org directory) + detail action row
Pill nav MainActivity nav graph destinations (Keypad/Recents/Contacts)
Settings SIP line + account (One UI cards)

Build order (from scratch): (1) Keypad screen, (2) floating pill bottom-nav, (3) Contacts cards + detail, (4) Recents cards, (5) Settings cards. New layouts in res/layout/, new One UI styles/drawables; engine/view-models untouched.