메뉴에서 2차적으로 나오는 서브 메뉴를 표시할 때, 대충 만들면 생각보다 큰 낭패를 당하게 됩니다. 저희 블로그에서도 이 문제를 여러 차례 지적했었는데요, 공군 가기 힘들어(Global Navigation Bar 디자인)에서, 메뉴 경로를 너무 좁게 만들었다가 망신 당한 공군 웹페이지를 보여 드리고 그 근본 원인을 알려드렸구요, 피츠를 알려주는 퀴즈 (A Quiz Designed to Give You Fitts)에서는 이 문제를 해결하기 위해, 맥과 윈도즈가 어떻게 다르게 접근하였는가를 설명했습니다. 지난 3월 6일 발표되어 많은 인기를 끌고 있는 Ben Kamens님의 아마존 메가 드롭다운 분석(BREAKING DOWN AMAZON'S MEGA DROPDOWN)은 메뉴 UI에서 꼭 알아야할 이 문제를 ..

지난 1월 30일, HCI korea 2013에서 pxd 동료들과 함께 아이데이션 워크샵을 진행했었는데요. 간단한 후기와 현장 사진들 그리고 장표를 공유합니다. 워크샵에 대한 목적과 구성은 아래와 같습니다. 최근 pxd에서는 실무에서 다수의 Ideation Workshop을 진행하였습니다. 이 중 결과가 좋았던 수평∙수직 사고기법을 활용한 Intensive Workshop 노하우를 공유하려고 합니다. 이 방법은 창의력 사고 기법의 권위자 에드워드 드 보노 박사의 수평적 사고 기법과 IDEO의 브레인스토밍 프로세스를 기반으로 하고 있으며, pxd만의 방식으로 응용 및 발전시켰습니다. 이 방법으로 단시간에 참가자들의 발상 범위를 넓히고 산출된 아이디어를 의미있는 수준으로 올릴 수 있습니다. 워크샵의 구성은 ..

1탄 기본적인 전통 UI 용어와 2탄 최근 웹에서 많이 사용되는 UI 용어에 이어, 이번에도 웹과 앱에서 많이 사용하는 UI 용어를 좀 더 알아보도록 하겠습니다. 관련 글 ▷ UX 신입 디자이너가 알아야 할 UI디테일 용어 1탄 ▷ UX 신입 디자이너가 알아야 할 UI디테일 용어 2탄 ▷ UX 신입 디자이너가 알아야 할 UI디테일 용어 3탄 ▷ UX 신입 디자이너가 알아야 할 UI디테일 용어 4탄 1. 라이트 박스(Light Box) 팝업이 뜨는 동시에 백그라운드 화면이 어두워지거나 밝아지는데, 이를 '라이트 박스'라고 부릅니다. 라이트 박스 처리된 영역은 컨트롤 할 수 없으며 사용자가 대화 상자에 집중해야 한다는 시각적인 알림을 제공합니다. 일종의 Modal Dialog(혹은 Modal Window)라..

글을 시작하며... 이번 포스팅에서도 1탄-기본적인 전통 용어-에 이어 UI디테일 용어를 소개해보려고 합니다. 각 제조사의 가이드라인, 서적, 사전을 찾아보면 유사한 의미인데도 다르게 불리는 경우가 많습니다. 어떻게 불리느냐보다는 유사한 점과 다른 점을 비교 분석하며 자신만의 것으로 만드는 과정이 중요하다고 봅니다. 관련 글 ▷ UX 신입 디자이너가 알아야 할 UI디테일 용어 1탄 ▷ UX 신입 디자이너가 알아야 할 UI디테일 용어 2탄 ▷ UX 신입 디자이너가 알아야 할 UI디테일 용어 3탄 ▷ UX 신입 디자이너가 알아야 할 UI디테일 용어 4탄 1. 증분 탐색 (Incremental Search) Incremental Search로 검색하면 '증분 탐색'이라고 번역이 되어 있는데 '순간 검색'이라고..

많은 디자인 회사가 도제식으로 운영됩니다. UX 회사라고 해서 별반 다르지 않죠. 저 역시 과거를 돌이켜보면 어떤 프로젝트를 누구와 함께 했는냐에 따라 학습의 범위와 개인적인 성장의 속도가 달라졌습니다. 흔히 말하는 사수와 부사수의 관계안에서 선임 디자이너가 후임(신입) 디자이너에게 디자인적인 스킬과 노하우를 전파하고, 프로젝트 매니저(PM) 역시 도제식으로 PM의 역할과 권한, 책임, 노하우 등이 공유되는 것이 현실이죠. 대다수의 경험과 노하우가 도제식으로 전수되다 보니, 어떤 마스터(사수)를 만나느냐, 어떤 프로젝트를 만나는지, 그 때의 상태가 어떠냐에 따라 전수받는 내용과 질, 양이 달라지는 문제가 발생합니다. 작년에 선임 진급자를 대상으로 짧게나마 PM 교육을 진행한 적이 있었는데, 주위 여건상 ..

지난 1월 8일 화요일 pxd에서 서울여대 학생들이 참여한 워크샵이 진행되었습니다. 오전에는 Rapid Persona Workshop, 오후에는 수평-수직적 사고에 의한 Intensive Workshop이라는 두 가지의 방법으로 진행하였는데, 각각 pxd의 송영일님과 김금룡님을 주축으로 워크샵을 기획하고 진행하였습니다. 1. [오전] Rapid Persona Workshop 송영일님이 진행하신 오전 워크샵의 주제는 ‘사용자경험 디자인 Rapid Persona Workshop’입니다. 아직 UX에 대한 정보가 부족한 학생들이라 집중하며 귀 기울여 듣는 모습이 인상적이었습니다. 내용을 하나라도 놓치지 않으려 노트하는 모습도 볼 수 있었습니다. 이 워크샵은 퍼소나 기법을 처음 접하는 사람들이 쉽고 간단하고 빠..

그리 오래 전은 아니지만 UX라는 분야에 처음 입성했을 때, 머리 속에 가득 찬 아이디어를 우리가 흔히 부르는 Wireframe에 옮기는 데 애를 먹었던 기억이 있습니다. 그림은 대충 그려지는 데 정작 내가 그리고 있는 것이 무엇인지 '정의'를 내릴 수가 없었던 탓이지요. 이처럼 기획자라면 누구나 UI규격서를 설계해 본 적이 있을 것입니다. 이것은 UI기획자와 디자이너 간, 혹은 UI기획자와 개발자 간의 일종의 약속이자 물리적인 결과물입니다. 그렇기 때문에 모든 약속은 명확한 정의가 바탕이 되어야 합니다. 그래야 작업자 간의 원활한 커뮤니케이션을 이끌 수 있으니까요. 이번 포스팅에서는 원활한 커뮤니케이션을 위한 기본적인 조건인 UI컴포넌트 용어를 정리해보려고 합니다. 시리즈의 첫 번째로 가장 기본적인 전..

Keystroke-level Model (KLM 혹은 KLM-GOMS, 타자 수준 모형)이란 Human Computer Interaction에서 키보드와 마우스를 조작하는 단위 요소들의 소요 시간을 미리 측정해 두었다가, 전체 시간을 측정해야하는 동작이 있을 때, 이미 알려진 값들을 합산하여 계산할 수 있게 만든 접근법이다. 예를 들어 키보드 하나를 누르는 데 걸리는 시간은 200ms, 마우스 버튼을 누르는데 걸리는 시간은 100 ms, 키보드에서 마우스로 이동하는데 걸리는 시간은 400 ms 등으로 평균적인 인간의 소요 시간을 측정해 둔 테이블을 준비해 둔 뒤, "apple 타이핑 후 마우스 클릭하는데 걸리는 시간"은 5*200+400+100=1.5초 라는 식으로 계산하는 방법을 말한다(설명을 위해 간..

Model Human Processor(인간 정보처리 모형 human information processor model,이하 MHP)란, 사람이 어떤 자극에 반응하여 근육을 움직이는데까지 일련의 과정을 분할하여 어느 정도의 시간이 걸리는지 측정하여 둔 뒤, 어떤 태스크를 할 때 얼마나 시간이 걸릴지를 쉽게 계산해 볼 수 있도록 만든 인지적 모형이다. 1983년 Card, S.K., Moran T.P., & Newell, A.등에 의해 제안되었다. Wikipedia : Human processor model 사용성 평가 방법에는 사용자를 직접 데리고 하는 직접법과 사용자 없이 하는 간접법이 있는데, 간접법은 다시 사용자를 잘 아는 전문가를 활용한 전문가법과, 전문가 없이 미리 실험된 데이터만으로 유추해보는..

06-7년 경에 유행했던 공군가는게 제일 힘들어..~!!!!라는 동영상이다. 동영상 제공자의 설명: "06년 입대 지원했을 때 찍었던 동영상입니다.(물론 연출) 그 당시 이 동영상을 올리고 어느 정도 이슈가 되어 얼마 후 공군 홈페이지 메뉴는 개선되었습니다. ^^ " 물론 위의 동영상은 매우 극단적인 경우이겠지만, 누구나 몇 번은 경험하는 일이다. 요즘도 대다수의 웹사이트들이 메뉴(GNB, Global Navigation Bar)를 저렇게 만들기 때문이다. 언듯 보면 2차 메뉴(우리 말로 투뎁쓰 메뉴, 영어로 second level menu)가 너무 협소해서 벌어진 일 같지만, 실은 그것보다 더 근본 문제가 있다. 바로 최상위 메뉴에서 서브 메뉴의 원하는 메뉴(온라인 모병센터)로 가는 길(path) 위에..

밀러의 매직 넘버 7 (혹은 마법의 숫자 7)이란, 일반적으로 인간이 단기로 기억할 수 있는 아이템의 개수는 7개 전후(5~9)라는 의미로, 아마 UI / UX 분야에서도 가장 많이 인용되지만 가장 엉터리로 응용되고 있는 법칙일 것이다. 영문 Wikipedia: The Magical Number Seven, Plus or Minus Two를 바탕으로 잠깐 설명해 보면, 밀러의 논문 프린스턴 대학교 교수인 George A. Miller는 1956년에 "The Magical Number Seven, Plus or Minus Two: Some Limits on Our Capacity for Processing Information"라는 논문을 발표하였다. 밀러는 1차원 절대판단(absolute judgment..

선택에 관하여 가장 널리 인용되는 연구 중 하나는, 스탠포드 대학원생이었던 Iyengar의 쨈 판매량에 관한 이야기일 것이다. 짧게 요약하면, 쨈 시식대에서 24가지 종류의 시식을 했을 때는 사람들이 더 많이 몰려들었지만 3%만 구매했고, 6가지 종류를 맛보게 했을 때는 30%가 구매했다는 내용이다(참고) 이에 따라 많은 선택을 제공하면 더 많이 선택할거라는 일반적인 사람들의 믿음과 반대로, 선택지를 많이 제공할수록 사람들은 더 적게 선택한다고 하여 이를 '선택의 역설(Paradox of Choice)'이라고 불렀다. 1990년대 중반에 실행된 이 연구는 이후 많은 사람들에게 다시 '상식'이 되었다. 선택의 역설 이러한 주장으로 매우 유명한 책이 2004년 Barry Schwartz 교수의 선택의 심리학..