Sérein — 웰니스 모바일 앱

배경

Sérein은 제 웹 프로젝트와는 다른 역량——네이티브 크로스플랫폼 개발——을 보여주기 위해 만든 콘셉트 모바일 앱입니다. 목표는 조용하고 미니멀한, 매일 다시 찾고 싶어지는 웰니스 앱.

데모는 브라우저에서 휴대폰 프레임 안에 표시됩니다. 이것은 웹사이트가 아니라 엄연한 모바일 앱입니다.

목표

• 모바일 표준 스택인 React Native / Expo의 숙련도를 증명하기.
• 최소공통분모가 아니라 각 플랫폼에서 네이티브한 경험을 전달하기.
• 목업을 넘어서: 지속되는 상태와 완결된 흐름을 갖춘, 실제로 사용 가능한 앱.

솔루션

매일의 의식처럼 설계한 네 개의 화면:

• 오늘 — 그날의 습관, 진행 링, 진행 중인 연속 기록(streak), 그리고 습관을 만드는 플로팅 버튼.
• 습관 만들기 — 아이콘 선택(정돈된 그리드), 색상 선택, 실시간 미리보기를 갖춘 모달 시트. 뻔한 것은 하나도 없습니다.
• 호흡 — 가벼운 햅틱 피드백으로 리듬을 잡는 애니메이션 심장 코히런스 운동(5초 / 5초).
• 진행 & 프로필 — 최근 7일 그리드, 최고 연속 기록, 그리고 온보딩에서 바로 만드는 맞춤형 프로필(이름, 아바타).

플랫폼별 네이티브 경험

• iOS — SF Symbols 아이콘, Liquid Glass 탭 바, Taptic Engine.
• Android — Material 아이콘, 네이티브 진동.
• 모든 곳에서 — 정교한 타이포그래피, 마이크로 애니메이션(Reanimated), 그리고 완전한 오프라인 동작: 데이터는 기기에 남고, 서버는 없습니다.

스택

React Native + Expo(expo-router), Reanimated 애니메이션, AsyncStorage 로컬 저장소, Vercel에 배포한 정적 웹 익스포트. 하나의 코드베이스, 세 개의 타깃.