UX UI 인사이트8 디자인 시스템의 뿌리, 디자인 토큰(Design Tokens): 심화 설계를 위한 필수 기초 지식 효율적인 UI 협업의 시작, 디자인 토큰: 디자인-개발 싱크를 위한 구조적 가이드라인0. 들어가며: 왜 지금 '디자인 토큰'인가?최근 UI/UX 디자인 현장에서 '피그마 변수(Variables)' 기능의 등장은 디자인 시스템의 패러다임을 완전히 바꾸어 놓았습니다. 단순히 색상을 저장하는 '스타일' 단계를 넘어, 코드와 디자인이 실시간으로 동기화되는 '디자인 토큰(Design Tokens)' 체계가 필수가 된 것이죠.특히 대한민국 공공 웹·앱의 표준인 KRDS(Korean Government Design System) 역시 이 토큰 체계를 통해 접근성과 일관성을 관리하고 있습니다. 오늘은 초보 디자이너부터 실무자까지 아우를 수 있는 디자인 토큰의 개념과 피그마 활용법, 그리고 KRDS의 모범 사례와 202.. 2026. 1. 9. Figma AI의 진화와 디자인의 미래: 디자이너는 대체될 것인가? Config 2024 이후의 격변, Figma AI는 독인가 약인가?AI가 화면을 그려주는 시대, 우리 UX 디자이너들의 역할은 어떻게 변해야 할까요?실무에서 체감하는 Figma AI의 핵심 기능과 이를 활용한 미래 생존 전략을 공유합니다.안녕하세요! 웹 접근성부터 다크모드 디자인 시스템까지 달려온 이번 시리즈의 마지막 포스팅입니다. 최근 Figma의 행보를 보면 'AI'를 빼놓고는 대화가 불가능할 정도입니다. 특히 작년 Config 2024에서 발표된 강력한 AI 기능들은 디자인 커뮤니티에 큰 충격을 주었죠.현재 증권사 앱 구축 등 복잡한 금융 프로젝트 현장에 있는 한 사람으로서, AI가 디자인 워크플로우를 어떻게 바꾸고 있는지, 그리고 우리는 어떤 능력을 키워야 하는지 아주 솔직하게 담아보았습니다.1.. 2026. 1. 9. Figma Variables로 구축하는 다크모드 디자인 시스템 (Hex 코드 포함) 디자인 시스템의 실전: Figma Variables 실무 가이드단순히 색을 고르는 단계를 넘어, 개발자와 협업 가능한 디자인 토큰(Design Tokens)을 설계합니다.실제 핀테크/증권 프로젝트에서 바로 복사해서 쓸 수 있는 핵심 컬러 팔레트와 네이밍 컨벤션을 공개합니다.안녕하세요! 지난 포스팅에서 다크모드의 전략적 중요성을 다뤘다면, 오늘은 그 전략을 실제 Figma에서 어떻게 구현하는지 알아보겠습니다. Figma의 Variables(변수) 기능은 라이트/다크 모드 전환을 1초 만에 가능하게 할 뿐만 아니라, 개발자와의 소통 비용을 획기적으로 줄여줍니다.1. 핵심은 네이밍: 역할(Role) 중심의 토큰 설계많은 디자이너가 실수하는 부분이 `Color/Grey-100`처럼 색상 이름으로 변수를 만드는 .. 2026. 1. 8. 금융 앱 다크모드 디자인 전략: 단순한 반전이 아닌 UX 설계의 차이 금융 UX의 심장, 다크모드 전략 가이드증권사 MTS부터 핀테크 앱까지, 다크모드는 이제 '취향'이 아닌 '환경'입니다.실무 디자이너가 밤잠 설쳐가며 고민하는 라이트 vs 다크 모드 설계의 본질을 파헤칩니다.금융권 앱 프로젝트를 진행하다 보면 가장 많이 받는 질문 중 하나가 "그냥 색만 반전시키면 되는 것 아닌가요?"입니다. 하지만 숫자가 생명인 금융 서비스에서 다크모드 설계는 사용자의 가독성, 시각적 피로도, 그리고 실시간 데이터에 대한 반응 속도를 결정짓는 고도의 설계 작업입니다.1. 금융 환경에서의 모드별 UX 분석: 뇌가 반응하는 방식라이트 모드와 다크 모드는 단순히 색의 차이가 아니라 사용자가 정보를 받아들이는 심리적 상태를 바꿉니다.구분라이트 모드 (Positive Contrast)다크 모드 .. 2026. 1. 7. Figma AI와 디자인의 미래: 툴의 진화가 가져온 패러다임의 전환 Figma AI는 디자이너를 대체할까, 해방시킬까?단순히 기능을 넘어 '사고의 방식'을 바꾸는 피그마의 진화상. Config 2024 이후 가속화된 AI 통합이 디자이너의 업무 정의를 어떻게 바꾸고 있는지 심도 있게 분석합니다.안녕하세요. 픽셀 너머의 세상을 설계하는 UX/UI 디자이너입니다. 최근 디자인 커뮤니티와 실무 현장을 가장 뜨겁게 달구는 주제는 단연 'Figma AI'입니다. 과거의 피그마가 단순한 협업 툴이었다면, 이제는 인공지능을 엔진으로 장착한 '지능형 디자인 파트너'로 진화하고 있습니다.많은 주니어 디자이너들이 AI의 등장에 위기감을 느끼기도 합니다. 하지만 10년 넘게 필드에서 변화를 목격해온 제 시각에서는, 지금이 오히려 디자이너가 '진짜 설계'에 집중할 수 있는 최고의 기회라고 확.. 2026. 1. 6. Figma 작업 시 필수! 금융권 UX 디자이너를 위한 웹 접근성 체크리스트 Figma 작업 시 필수! 금융권 UX 디자이너를 위한 웹 접근성(WA) 체크리스트금융 앱은 남녀노소 누구나 자신의 자산을 안전하게 관리할 수 있어야 합니다. 단순히 가이드라인을 지키는 수준을 넘어, 실무 작업 단계에서 디자인 퀄리티와 접근성을 동시에 잡는 Figma 전용 워크플로우와 체크리스트를 상세히 정리했습니다.많은 디자이너가 프로젝트 막바지 검수 단계에서 웹 접근성(WA) 수정 요청을 받고 당황하곤 합니다. 특히 금융권은 법적 규제가 까다로워 디자인 시스템 초기 단계부터 접근성을 고려하지 않으면 전체 컴포넌트를 다시 설계해야 하는 상황이 발생할 수 있습니다.오늘은 제가 실제 증권사 및 은행 앱 프로젝트를 수행하며 구축한 'Figma 접근성 자가 검수 워크플로우'를 바탕으로, 실무에서 놓치기 쉬운 .. 2026. 1. 6. 금융 UX의 본질: 까다로운 웹 접근성(WA) 규제 속에서 디자인 퀄리티를 지키는 법 "픽셀 너머의 세상을 설계하고, 일상의 찰나를 기록합니다."UX/UI 디자이너의 시선으로 바라본 디자인 인사이트와 감성적인 기록의 공존.안녕하세요. 16년 차 UX/UI 디자이너입니다. 최근 증권사 앱 구축 프로젝트에 참여하며 디자이너로서 가장 큰 화두는 단연 ‘웹 접근성(Web Accessibility, 이하 WA)’입니다.특히 금융권은 공공성과 법적 규제가 강해 접근성 준수가 선택이 아닌 필수입니다. 하지만 많은 디자이너가 명도 대비나 색상 제한 같은 가이드라인을 마주할 때 "디자인이 투박해진다"거나 "창의성이 제한된다"는 갈증을 느끼곤 합니다. 오늘은 규제가 까다로운 금융 인터페이스 설계 과정에서, 모두를 위한 접근성을 확보하면서도 시각적 아름다움(Aesthetic)을 놓치지 않는 저만의 실무 노하.. 2026. 1. 6. 2026년 금융 앱의 미래: AI는 증권 UX를 어떻게 진화시키는가? 안녕하세요. 픽셀 너머의 세상을 설계하는 UX/UI 디자이너입니다. 새롭게 마련한 [UX/UI 인사이트] 카테고리의 첫 글은 제가 요즘 가장 깊게 몰입하고 있는 분야이자, 2026년 가장 뜨거운 화두인 '금융과 AI의 결합'에 대해 이야기해보려 합니다."단순히 예쁜 차트가 아닌, 사용자의 다음 행동을 예측하는 인터페이스의 시대가 왔습니다."1. 2026년 증권 앱, 왜 AI 에이전트인가?과거의 증권 앱이 수많은 지표와 복잡한 호가창을 보여주는 데 집중했다면, 지금은 '초개인화된 정보의 요약'이 핵심입니다. 사용자들은 이제 수만 개의 데이터를 직접 분석하기보다, AI가 나에게 맞는 투자 인사이트를 제안해주길 기대합니다.2. 디자이너가 주목해야 할 3가지 UX 포인트대화형 UI의 고도화: 챗봇을 넘어 앱 전.. 2026. 1. 5. 이전 1 다음 반응형