UI 빌더를 지탱하는 레고 블록 같은 아키텍처 만들기
DEVIEW 2023 네이버 · YouTube
AI 핵심 요약
네이버 ETECH 홈빌더 팀은 서비스별 UI 커스터마이징을 대신 개발하는 방식에서 벗어나, 여러 서비스가 조립해 쓸 수 있는 UI 빌더 SDK를 만들고자 했다. 초기 2계층 구조에서는 코어가 제품별 UX까지 떠안고 제품마다 UI를 중복 구현했으며, 커스텀 블록을 추가하려면 여러 곳을 수정해야 하는 문제가 드러났다. 이를 해결하기 위해 책임을 네 계층으로 재설계하고 Chakra UI 기반 디자인 시스템을 파운데이션으로 도입했으며, 블록의 구성 요소를 매니페스트로 선언해 확장 동선을 줄였다. 나아가 UI와 자동 저장·단축키 같은 기능을 플러그인으로 주입하는 구조를 만들었고, 아키텍처는 처음부터 완성하는 설계가 아니라 문제를 발견하고 해결하며 계속 바뀌는 과정이라는 점을 배웠다.
- 코어는 제품별 UX를 결정하기보다 여러 제품이 공통으로 쓸 안정적인 재료와 도메인 규칙을 제공해야 한다.
- 계층을 나눌 때는 각 책임을 가장 잘 아는 곳에 두고, 블록의 모델·뷰·로직과 빌더의 프로퍼티 편집 책임을 구분한다.
- 공통 UI 기반이 부족하면 제품마다 컴포넌트를 중복 구현하게 되므로, 디자인 시스템을 파운데이션으로 마련한다.
- 확장 지점은 매니페스트와 통일된 플러그인 인터페이스로 제공하되, 보안·버전 관리·렌더링 최적화 비용도 고려한다.
- 가능성이 낮은 요구사항까지 미리 추상화하기보다 옵션을 마련하고, 실제 요구가 확인될 때 대응하는 선택도 유효하다.
소개
[DEVIEW 2023] * 발표자 : 김훈민(NAVER ETECH) * 발표제목 : UI 빌더를 지탱하는 레고 블록 같은 아키텍처 만들기 * DEVIEW 2023 바로가기: https://deview.kr/2023 #DEVIEW #DEVIEW2023 #데뷰 #데뷰2023
비슷한 학습 자료
컨퍼런스 DEVIEW 2023
눈으로 보며 듣는 음성 기록, 클로바노트 서비스의 웹 기술 톺아보기
컨퍼런스 DEVIEW 2023
LiveOps : 네이버앱의 실시간 운영과 크래시 핸들링 솔루션
컨퍼런스 DEVIEW 2023
그 여자 APP, 그 남자 SDK: Kotlin Multiplatform 적용기
컨퍼런스 DEVIEW 2023
싸늘하다, 메신저에 경보가 날아와 꽂힌다 - 네이버 검색 SRE 시스템 개선기
컨퍼런스 DEVIEW 2023
DEVIEW 2023 - 키노트 영상
컨퍼런스 DAN 2025
[팀네이버 컨퍼런스 DAN25] 생성형 UI와 에이전틱 UX 리서치, AI 네이티브 디자인 프로세스의 가능성 기존 UX 디자인과 리서치 방식은 개인화된 사용자 특성과 빠르게 변화하는 AI 환경을 반영하기 어려웠습니다. 본 세션에서는 UI 디자인과 UX 리서치 과정에 AI를 접목해 새로운 디자인 프로세스를 실험한 경험을 공유합니다. Telecast(생성형 UI 플랫폼)와 EchoX(AI 페르소나 기반 UX 리서치 시스템)를 직접 구현하며, 디자이너들이 AI와 함께 도구를 만들고 역량을 확장해 나간 과정을 다룹니다. 이 과정에서 AI를 통해 UX 디자이너와 리서처의 역할과 협업 방식을 어떻게 재발견하게 되었는지, 그리고 앞으로 디자인 프로세스를 어떻게 재정의해 나갈 수 있을지 경험을 공유합니다. 목차 1. 기존의 디자인 프로세스와 자동화 시도 - 복잡함이 더해지는 사용환경 - AI 코딩을 활용한 작업 자동화 시도 경험 2. Telecast: Generative...
AI 코딩 UI/UX