Helmeted figure — the site mark, not a portrait RAKCHEEV.ME

Projects / GlassComposer

GlassComposer

A Liquid Glass chat composer for iOS, matched to its reference pixel by pixel.

Role
Design and development
Platform
iOS
Stack
SwiftUI, UIKit, XCUITest
Code
Private repository

Task

Recreate the ChatGPT composer for iOS in the new Liquid Glass style so it cannot be told apart from the original. The component has to behave like the real one: every transition, every panel and the keyboard.

Process

I measured the original and built the component in SwiftUI, with the text field in UIKit. Transitions from a compact capsule to two lines and to full screen, the reasoning-effort slider, the attachment menu and the photo cards were built separately and tuned in slowed-down animations. I wrote up how the iOS 27 keyboard behaves next to overlays.

Result

Match to the original is checked by 25 screenshot UI tests, and they all pass. For example, the compact row occupies 38–382 pt against ChatGPT’s 38.3–381.7 pt, and the brand blue #0087FF matches.