피드로 돌아가기
올리브영 테크블로그Mobile
원문 읽기
SDUI로 네이티브 운영 민첩성 높이기
올리브영이 SDUI(Server-Driven UI) 아키텍처를 도입해 앱 스토어 심사 없이 서버 설정만으로 화면 변경 가능하도록 구현
AI 요약
Context
네이티브 앱은 배포 후 버그 수정이나 UI 변경 시 스토어 심사 프로세스(수일~수주)를 거쳐야 하므로 빠르게 변화하는 이커머스 환경에 즉시 대응할 수 없었습니다. A/B 테스트 진행 시 iOS와 Android 플랫폼별로 개별 개발과 배포를 조율해야 하는 복잡성이 있었습니다.
Technical Solution
- 섹션(Section), 컴포넌트(Component), 데이터(Data), 액션(Action) 4가지 핵심 요소로 스키마 정의: 서버는 화면 설계도 제공, 클라이언트는 네이티브 렌더링에 집중
- ATF(Above-The-Fold) 영역 전용 API 분리: 초기 화면에 필수적인 데이터만 담은 가벼운 API 우선 호출, 하단 영역 데이터는 별도 비동기 처리
- 필수값(id, type), 옵션값(subtitle), 기본값(isShow=false), 포맷 규칙(date, ImageUrl 등)으로 데이터 규칙 엄격히 정의
- 액션 타입 3가지 구분: Link(URL 이동), API(서버 경로 요청), Event(분석 로그)
- 스키마 버저닝과 기능 토글 결합: 섹션 단위로 비활성화·치환·롤백 가능하도록 구현
Key Takeaway
SDUI의 진정한 가치는 콘텐츠 표시를 넘어 네이티브의 느린 대응 속도를 보완하는 운영 도구로 기능하는 데 있으며, 모든 화면을 SDUI로 전환하기보다는 네이티브·웹·SDUI를 화면 목적에 맞게 전략적으로 조합해야 합니다.
실천 포인트
이커머스·결제 플랫폼 등 UI 변화가 잦은 모바일 앱 개발 팀에서 SDUI 도입 시, 전시·리스트 영역부터 시작해 섹션 단위의 독립적인 스키마를 설계하고, 초기에는 레이아웃을 제외한 4가지 요소만 서버 제어로 두면 복잡도를 낮우면서도 스토어 심사 우회로 배포 주기를 수일~수주에서 수분~수시간으로 단축할 수 있습니다.