How we built the v0 iOS app
16 days ago
- #React Native
- #UI/UX
- #Mobile Development
- Vercel released v0 for iOS, their first mobile app, aiming for an Apple Design Award-worthy experience.
- Experimented with various tech stacks and UI patterns, inspired by native iPhone apps like Apple Notes and iMessage.
- Chose React Native with Expo for development, achieving a native feel that impressed developers.
- Focused on building a simple, delightful AI chat experience for generating code on the go, not a full mobile IDE.
- Implemented smooth animations for messages, including fading and scrolling effects, with a floating composer using Liquid Glass.
- Developed a composable chat system using open-source libraries like LegendList, React Native Reanimated, and React Native Keyboard Controller.
- Solved challenges like dynamic message heights, keyboard handling, and ensuring messages scroll correctly in existing chats.
- Enhanced the native feel with custom patches for React Native's TextInput, including support for pasting images and interactive keyboard dismissal.
- Shared code between web and native by building a shared API layer with runtime type safety and OpenAPI spec generation.
- Used react-native-unistyles for styling and native elements like Zeego for menus and built-in modals for bottom sheets, with patches for improved performance.
- Committed to open-sourcing findings and improving React Native, inviting developers to join the Vercel Mobile team.