Skip to content
Signal

Platforms

iOS design

Apple HIG and current iPhone hardware, with the spec overlaid on the device.

iOS · audited 2 Oct 2026

Apple HIG rules and current iPhone hardware, with the v3 spec and chitransit-app main 82560e7 audited against them. Stop detail and Map panel rows reflect main 3a3db9c (#102). Rationale and decisions: docs/specs/ios-design.md.

Device drawings are our own SVG schematics, drawn from Apple-published numbers. Apple Design Resources are cited, not embedded. Dimensions labelled “v3” are ours.

Current iPhone device classes

Lineup as of October 2026. Points = Apple pixels ÷ 3. The app is iPhone-only (TARGETED_DEVICE_FAMILY = 1), portrait-only, iOS 17.2+, built with Xcode 26.0.

ClassModelsPixels (Apple)Points @3xTop cut-outDynamic Island: compact · expanded width (HIG)Bottom
6.1″ notchiPhone 17e2532 × 1170 · 460 ppi390 × 844Notch, no Dynamic IslandNone. Live Activities show on the Lock Screen and as banners onlyHome indicator
6.3″iPhone 17, 17 Pro, 18 Pro2622 × 1206 · 460 ppi402 × 874Dynamic Island230 pt · 371 pt (17 / 17 Pro). 18 Pro: not yet published. The HIG table stops at the 17 series.Home indicator
6.5″iPhone Air2736 × 1260 · 460 ppi420 × 912Dynamic Island250 pt · 408 ptHome indicator
6.9″iPhone 17 Pro Max, 18 Pro Max2868 × 1320 · 460 ppi440 × 956Dynamic Island250 pt · 408 pt (17 Pro Max). 18 Pro Max: not yet published.Home indicator
FoldableiPhone Duo (announced Sept 2026)Outer 5.4″ 1398 × 2034 · 460 ppi
Inner 7.6″ 1878 × 2670 · 430 ppi
Not published. Apple gives pixels only. The HIG says to rely on size classes and safe areas, with compact width on the outer display and regular width on the inner one.Outer: corner camera that “expands into the Dynamic Island for Live Activities”. Inner: under-display camera, a reserved region only while active.Not publishedFold is a conditional reserved region

Every Dynamic Island presentation is 36.67 pt tall with a 44 pt corner radius. Lock Screen and expanded Live Activities are 84–160 pt tall (HIG). “Not yet published” means Apple has no figure.

To scale (1 pt = 0.36 px)

Hatched = safe-area inset. The 62 / 34 and 47 / 34 pt insets are commonly reported runtime values, not Apple-published; read safeAreaInsets at runtime. The island, home indicator and iPhone Duo outlines are approximate.

iPhone Duo HIG rules

Build to resizeSize classes, layout margins and safe-area insets. No fixed widths. The outer display is compact and the inner display is regular. HIG
Vertical controlsOn the outer display, and on the inner display in landscape, tab bars, toolbars, the status bar and the Dynamic Island move to the side.
Reserved regionsThe outer camera, the inner camera while active, and the fold. Framework views adapt. Custom views read ReservedRegion.
Bar placementDon't override the default vertical placement. Back and Close go at the top of the bar.

Our app on an iPhone 17 Pro (402 × 874 pt)

App at 82560e7. Orange marks HIG boundaries (safe areas and anchors). Dashed blue marks 44 × 44 pt hit areas. Map panel anchors: tip 132 pt · half 50% · full top + 4 pt, measured in the safe area above the tab bar.

Good evening Favorites BelmontNorthbound HowardDue Kimball7 min Clark & BelmontSouthbound 22 Harrison4 min gutter 20 (v3) Home Map system TabView · Liquid Glass search role Settings · .topBarTrailing
Home tabNative TabView with Home, Map and a Search-role tab. Settings is a toolbar item. Compliant
3D Nearby Belmont0.2 mi Clark & Belmont0.3 mi Home Map .half = 50% of safe area (custom FloatingPanel) grabber 40×5 · no a11y panel ends above the native tab bar
Map tab, panel at halfOne custom FloatingPanel (UIKit) styled with v3 tokens: paper fill, 28 pt radius, sheet shadow. With nothing selected it shows Nearby. Gap: VoiceOver can't move the panel between anchors (G2).
Belmont Northbound ▾ Due 7 min Map .tip = 132 pt above the safe-area bottom X · custom 44 pt direction 136 pt fixed · next 2 arrivals
Map tab, station at tipThe selected station replaces Nearby. Tip shows a two-row summary: name and X, then direction and the next two arrivals. Half adds the direction control and its arrival rows; full adds actions, alerts, step-free status and timelines. Compliant on targets.