Lottie Creator: 작동하는 코드로 디자인하기
LottieFiles
Lottie Creator에서는 글과 가이드로 설명하는 대신 코드 기반 프로토타입을 만들고, 개발 이후 디자인 QA에서 발견한 문제도 직접 코드를 수정해 병합했습니다. Motion Tokens, 단축키 모달, 타임라인 커서를 다룬 디자인 엔지니어링 사례입니다.
안녕하세요, 
LottieFiles에서 일하는 프로덕트 디자이너 우정아입니다.
이전에는 ProtoPie Studio의 디자인을 리드했고, Hi-Fi 오디오 플레이어 Astell&Kern의 시스템 UI와 엔터프라이즈 소프트웨어 작업을 했습니다.
최근에는 디자인 엔지니어링으로 작업의 범위를 넓히고 있습니다. AI 도구로 아이디어를 직접 구현하고, 코드로 디자인을 실제 제품에 반영합니다.
더 알아보기
Auto Layout: 새로운 기능을 계기로 다시 설계한 속성 패널
ProtoPie
ProtoPie 사용자의 약 80%는 Figma에서 디자인을 시작합니다. 기존에 익힌 사용 방식은 유지하면서 새로운 학습 부담을 줄이는 것이 중요했습니다. Auto Layout 도입을 계기로 엔터프라이즈 고객들이 꾸준히 개선을 요청해 온 속성 패널을 재설계하고, 디자인 시스템도 전반적으로 정비했습니다.
Accuinsight+ 3.0: 비전문가를 위한 데이터 분석
SK㈜ C&C
Accuinsight+는 데이터 분석을 위한 기업용 플랫폼입니다. 문제를 발견하기 위해 직접 데이터 분석을 시도하고, 실제 사용자의 업무 과정을 관찰했습니다. 이러한 경험을 바탕으로 핵심 기능인 Workflow를 더 직관적으로 재설계했습니다.
ShareTalk 2.0: 프로토타입을 통해 인터랙션 디테일 만들기
SK㈜ C&C · AUD 사회적협동조합
ShareTalk는 음성을 실시간 자막으로 변환해 청각장애인의 의사소통을 돕는 서비스입니다. 사용자 인터뷰를 통해 수업 중 학생들의 어려움을 발견하고, 실제 인터랙션을 적용한 프로토타입으로 정적인 화면에서는 보이지 않던 문제를 찾아낼 수 있었습니다.
Astell & Kern: 소리의 공간감을 시각화하다
아이리버
A&ultima SP1000은 Astell&Kern의 첫 플래그십 모델입니다. 오랫동안 큰 변화가 없었던 기존 UI에서 벗어나, 브랜드와 하드웨어의 특성을 살린 새로운 인터페이스를 디자인했습니다. 깊이와 빛, 레이어로 소리의 공간감을 표현하고, 부팅부터 시스템 설정과 기기 연결까지 제품 전반의 UI를 설계했습니다.
