본문 바로가기

전체 글125

사용성 테스트 (태스크 설계, 파일럿 테스트, 샘플 수) 사용성 테스트를 한 번만 제대로 망해봤다면 압니다. "일단 확인하고 싶은 거 다 넣자"는 생각이 얼마나 위험한지를. 저도 처음 UT를 도입했을 때 태스크를 12개나 설계했다가 세션이 90분 가까이 늘어지는 경험을 했습니다. 이 글은 그 실패에서 건진 것들을 솔직하게 정리한 기록입니다.태스크 설계: 적을수록 데이터가 살아남는다사용성 테스트(UT)란 특정 태스크, 즉 사용자에게 주어진 구체적인 수행 과제를 설정하고 실제 행동을 관찰하는 리서치 방법입니다. 여기서 UT가 IDI(In-Depth Interview, 심층 인터뷰)와 다른 점은 명확합니다. IDI는 사용자의 인식과 경험, 감정을 탐색하는 데 집중하지만, UT는 앱이나 서비스 화면에서 사용자가 실제로 어떻게 움직이는지를 직접 눈으로 확인하는 방식입니.. 2026. 4. 12.
반응형 디자인 (브레이크포인트, 모바일 퍼스트, 하이브리드) 반응형 디자인은 "그냥 화면 크기에 맞게 줄이는 것"이 아닙니다. 브레이크포인트를 어디에 두느냐에 따라 같은 레이아웃이 완성작이 되기도 하고, 쓸 수 없는 화면이 되기도 합니다. 저도 처음엔 이 차이를 몰랐고, B2B SaaS 대시보드 프로젝트에서 혹독하게 배웠습니다.브레이크포인트를 잘못 잡으면 생기는 일일반적으로 반응형 디자인은 "퍼센트로 유동적으로 줄어드는 것"이라고 알려져 있습니다. 맞는 말이지만 절반만 맞습니다. 제 경험상 이건 좀 다릅니다. 퍼센트 기반으로 비율을 유지하며 축소되다가, 특정 해상도 구간에 진입하는 순간 레이아웃 자체가 전환되어야 합니다. 그 전환점이 바로 브레이크포인트(Breakpoint)입니다. 여기서 브레이크포인트란 화면 너비가 특정 수치에 도달했을 때 CSS 미디어 쿼리(M.. 2026. 4. 11.
모바일 앱 UX (레퍼런스 분석, 타이포그래피, 터치 영역) 처음 모바일 앱 UI를 설계하던 날, 저는 꽤 자신 있었습니다. 화면을 빈틈없이 채우고 컬러도 다양하게 쓰면 '완성도 높은 디자인'이라고 믿었으니까요. 그 착각이 얼마나 비싸게 먹혔는지, 사용자 테스트 결과지를 받아 들고 나서야 알았습니다. 이 글은 그 시행착오를 통해 몸으로 배운 모바일 UX 핵심 원칙 세 가지를 정리한 것입니다.잘 만든 앱을 뜯어봐야 배움이 생긴다디자인을 처음 배울 때 핀터레스트부터 켜는 분들이 많습니다. 색감이 예쁜 목업 이미지를 모아두고 '이런 느낌으로 만들자'고 생각하는 거죠. 저도 그랬습니다. 그런데 막상 실제 앱으로 구현하려고 하면 핀터레스트에서 본 것들이 거의 도움이 안 됩니다. 그 이미지 대부분이 실제로 작동하는 UI가 아니라, 포트폴리오용 목업(mockup)이기 때문입니.. 2026. 4. 11.
피그마 Dev Mode (핸드오프, 인스펙트 패널, 협업 효율) 디자이너가 개발자에게 '이 간격 몇 픽셀이에요?' 같은 질문을 받는 게 당연한 일이라고 생각하셨나요? 저도 한때 그랬습니다. 그런데 Figma Dev Mode를 쓰고 나서 그 질문이 거의 사라졌습니다. 핸드오프 방식을 바꾸는 것만으로 피드백 루프가 2주에서 3일로 줄었고, 하루에 서너 번씩 오던 슬랙 메시지도 뚝 끊겼습니다.핸드오프, 문서로 하던 시절이 있었습니다핸드오프(Handoff)란 완성된 디자인 시안을 개발자에게 넘기는 과정을 의미합니다. 스포츠에서 공을 동료에게 전달하는 행위에서 유래한 용어로, 소프트웨어 개발에서는 디자이너가 개발자에게 구현 가능한 형태의 정보를 전달하는 일 전체를 뜻합니다.저는 프리랜서 초기에 Zeplin을 사용하면서 이 과정을 손으로 직접 했습니다. 화면마다 색상 값, 폰트.. 2026. 4. 11.
디자인 토큰 (토큰 구조, 네이밍 컨벤션, 자동화 파이프라인) 버튼 하나의 컬러를 바꾸는 데 이틀이 걸렸습니다. 수동으로 화면 수십 개를 뒤지고, 개발자에게 헥스코드를 일일이 붙여 넣어서 전달하던 시절 얘기입니다. 디자인 토큰을 도입하고 나서야 그게 얼마나 비효율적인 구조였는지 실감했습니다. 이 글은 그 경험을 바탕으로, 토큰 구조 설계부터 네이밍 컨벤션, 자동화 파이프라인까지 실무에서 어떻게 작동하는지 풀어봤습니다.손으로 하나씩 고치던 시절, 토큰 구조가 바꾼 것디자인 시스템을 도입하기 전 저는 프리랜서 UI/UX 디자이너로 B2B SaaS 프로젝트를 진행하고 있었습니다. 당시의 작업 방식은 단순했지만 끔찍했습니다. 디자인 수정이 생기면 Figma에서 화면별로 일일이 컬러를 찾아 바꿔야 했고, 개발자에게 넘길 때는 "#1A1A2E입니다"처럼 헥스코드를 직접 전달했.. 2026. 4. 10.
디자인 스프린트 (발산수렴, 퍼실리테이션, 프로토타이핑) 아이디어는 있는데 어디서부터 시작해야 할지 막막한 적 있으셨습니까? 5일 만에 아이디어를 프로토타입까지 끌어올리는 구조가 있습니다. 구글 벤처스에서 제안한 디자인 스프린트입니다. 저도 처음 접했을 때 "5일이면 뭘 얼마나 할 수 있겠어"라고 생각했는데, 실제로 써보고 나서 생각이 완전히 바뀌었습니다.발산과 수렴을 의도적으로 분리하는 이유디자인 스프린트의 핵심 구조는 발산(Divergence)과 수렴(Convergence)의 명확한 분리에 있습니다. 발산이란 가능한 한 많은 아이디어를 제약 없이 쏟아내는 단계이고, 수렴은 그중에서 실제로 검증할 하나의 방향을 추려내는 단계입니다. 이 두 과정을 같은 시간 안에 섞어버리면 팀원들은 아이디어를 꺼내면서 동시에 비판받을 준비를 해야 하는데, 이게 생각보다 심리적.. 2026. 4. 10.

소개 및 문의 · 개인정보처리방침 · 면책조항

© 2026 브레인스토밍 연구

티스토리툴바