본문 바로가기

UI디자인5

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 작업 시 필수! 금융권 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.
반응형