UX 아티클 ✏️/① UX 디자인(15)
-
[디자인] 비교가 쉬운 테이블(Table UI) 디자인하기
다양한 데이터를 다루는 웹 서비스를 설계할 때 자주 사용하는 UI 요소 중 하나가 테이블(table)입니다. 저는 작년까지만 해도 모바일 경험을 주로 다루면서 테이블을 디자인할 일이 거의 없었는데요...그런데 올 초, 지금의 회사로 이직하면서 테이블을 자주 디자인하게 되었어요. 처음엔 엑셀 시트 같은 테이블UI를 다루는 게 낯설었습니다. 어색함 속.. 단순히 데이터를 테이블 안에 나열하는 방식으로만 디자인했던 것 같네요. 그러나 시간이 지나면서 테이블을 효과적으로 활용하는 방법을 점차 찾아가고 있는데요, 이번 글에서는 그중 일부를 정리해 보고자 합니다. 먼저, 테이블(table)이 무엇이며 어떤 목적을 가지고 있는지 살펴보겠습니다. 테이블은 단순히 데이터를 나열하는 것 이상의 역할을 합니다. 데이터를 체..
2024.10.13 -
[UX 방법론] 스토리텔링 도구로서의 시나리오 (Context Scenario / Key path scenario / Validation Scenario)
'About Face 4 인터랙션 디자인의 본질'을 기반으로 작성된 글입니다. 아이디어를 효과적으로 전달하는 데에 있어 이야기만큼 좋은 방법은 없다. 디자인에서도 마찬가지인데, 이야기를 풀어나감으로써 적절한 디자인을 찾아낼 수 있고, 디자인 문제를 설명하고 해결하는 데 서술적인 이야기는 매우 효과적이기 때문이다. 또한 인터랙션 디자인은 시간이 흐름에 따라 변하는 제품의 행동을 설계하는 일이기 때문에, 인터랙션이 많은 제품을 설명할 때도 서술적인 이야기가 큰 도움이 된다. 존 캐럴은 [Making Use]에서 다음과 같이 설명하고 있다. '디자인 과정에서 시나리오는 ‘이렇다면 어떨까?’라고 끊임없이 자문하게 하고, 창의적인 디자인을 제공해 준다. 동시에 가능한 대안을 구체적으로 설명하는데 매우 효과적이다...
2021.12.24 -
[UX 방법론] Contextual Design ⑤ - 페이퍼 프로토타입
벌써 컨텍스추얼 디자인의 마지막 편이다. 이 전 편들은 아래 링크를 통해 확인할 수 있다. 📌 Contextual Design 시리즈 [UX 방법론] Contextual Design ① - 컨텍스추얼 인터뷰 (contextual interview) [UX 방법론] Contextual Design ② - Work Modeling : 시퀀스 모델, 피지컬 모델, 아티팩트 모델 [UX 방법론] Contextual Design ③ - 어피티니 다이어그램 (Affinity Diagram) [UX 방법론] Contextual Design ④ - 워크 리디자인: 페르소나, 비전 도출, 스토리보드 비전을 도출하거나 권장 사항 목록을 만든 다음, 팀은 사용자에게 재디자인과 새로운 기능을 어떻게 제안할지에 대한 첫 번째 ..
2021.07.17 -
[UX 방법론] Contextual Design ④ - 워크 리디자인: 페르소나, 비전도출, 스토리보드
UX 디자인의 더블 다이아몬드 다이어그램에서 첫 번째 다이아몬드가 완성되었다. 지금부터는 또 한 번 더 발산의 과정을 거친다. 인터뷰와 분석을 통해 얻은 인사이트를 바탕으로 무수한 비전을 도출한다. CD(컨텍스추얼 디자인)에서는 이 단계를 이라 부른다. 조금은 생소하게 다가오기도 한다. Work Redesign 아마, 이 단계는 워크 리디자인이라는 말보다 페르소나, 비전 도출, 스토리보드라 설명해야 더 와닿을 것 같다. 사용자들이 새로운 시스템을 어떻게 사용할지에 대한 가상 시나리오를 개발하는 것이 주 목표가 되는 단계다. 이 단계를 보다 자세히 살펴보면 다음과 같이 나눌 수 있다. 1. 페르소나 작성하기 2. 어피니티 워킹과 시퀀스 워킹 3. 비전 도출 4. 스토리보드 만들기 1. 페르소나 작성하기 풍..
2021.06.20 -
[UX 방법론] Contextual Design ③ - 어피티니 다이어그램 (Affinity Diagram)
어느덧 Contextual Design 시리즈의 3번째 편이다. 전 편에선 컨텍스추얼 인터뷰를 통해 사용자를 관찰하는 방법과 각 사용자의 싱글 케이스를 시퀀스 모델, 피지컬 모델, 아티팩트 모델 등을 통해 시각화(정리)하는 법을 살펴보았다. 이번 편에선 흩어져 있는 사용자의 경험 데이터를 통합하여 데이터를 더욱더 견고하게 만들어 갈 것이다. 이를 위해 어피티니 다이어그램을 가장 흔히 사용한다. 어피니티 다이어그램은 여러 사용자 집단에 걸친 모든 이슈를 파악하는 가장 빠르고 유용한 방법이다. 또한 한 개인뿐만 아니라 전체 사용자 집단에 대한 이슈도 파악할 수 있다. ✅Contextual Design 시리즈 ① [UX 방법론] Contextual Design ① - 컨텍스추얼 인터뷰 (contextual i..
2021.05.16 -
[UX 방법론] Contextual Design ② - Work Modeling : 시퀀스 모델, 피지컬 모델, 아티팩트 모델
지난 포스팅에서 컨텍스추얼 디자인(Contextual Design)의 컨텍스추얼 인터뷰(Contextual interview)를 소개했다. 사용자의 자연스러운 행동을 관찰하고 질문하는 것을 통해 드러나지 않은 사용자의 속마음까지 들여다볼 수 있다는 점에서 정성적 리서치에 있어 중요한 방법 중 하나다. 이번 포스팅에서는 컨텍스추얼 인터뷰를 통해 얻어 낸 복잡한 정보를 정리하는 컨텍스추얼 디자인의 두 번째 스텝, 업무 모델링 Work Modeling 을 다뤄보고자 한다. ✅Contextual Design 시리즈 ① [UX 방법론] Contextual Design ① - 컨텍스추얼 인터뷰 (contextual interview) ② [UX 방법론] Contextual Design ② - 업무 모델링 (Work..
2021.05.05 -
[UX 방법론] Contextual Design ① - 컨텍스추얼 인터뷰 (contextual interview)
Intro. 빅데이터 시대가 도래하며 산업 전반에 걸쳐 정량적 데이터가 중요하게 다뤄지고 있다. 정량적 데이터는 디자인이 얼마나 가치가 있는지 직관적으로 확인할 수 있으며 UX 개선 사항을 조직의 목표와 핵심 성과 지표로 활용할 수 있다. 정량적 데이터가 점점 더 중요한 역할을 하게 되면서 UX 디자이너 역시 데이터를 읽어내는 리터러시 역량을 요구받고 있다. 하지만 정량적 데이터는 수치 변화와 패턴에 따라 사용자의 행동 원인을 파악하기 힘들다. 때문에, 이를 파악할 수 있는 정성적 데이터를 함께 분석할 필요가 있다. 즉, 사용자 경험을 향상하기 위해서는 정량적 데이터 뿐만 아니라 기존의 정성적 데이터를 이해하고 종합적인 인사이트를 내야 할 필요성이 커진 것이다. 정성적 데이터와 정량적 데이터가 상호보완적..
2021.04.30 -
[UX방법론/스터디] 사용자 멘탈모델
멘탈모델(Mental Model)을 스터디하며 정리한 글입니다. 1. 멘탈모델 (Mental Model) 멘탈모델은 왠지 모르게 자주 들었던 용어임에도 그 의미를 설명하고자 하면, 막막한 UX용어 중 하나입니다. 도널드 노먼(Donald A. Norman)은 『디자인과 인간심리』에서 멘탈모델을 아래와 같이 정의합니다. 멘탈모델(Mental Model)이란 사람들이 자기 자신, 다른 사람, 환경, 자신이 상호작용하는 사물들에 대해 갖는 모형이다. 사람들은 멘탈모델을 경험, 훈련, 지시를 통해 형성한다. 한 도구의 멘탈모델은 주로 그 장치의 작용과 가시적 구조를 지각하고 해석함으로써 형성된다. 에서 즉, 멘탈모델이란 특정한 주제에 대한 사용자의 행동 친화도(혹은 연관성 있는 항목을 모아놓은 도표)이며 사람들..
2021.03.12 -
[UX 방법론/스터디] 카드소팅 테스트 정량적 분석법
박은정, 서종환. (2008). 카드 소팅 테스트를 위한 정량적인 분석 기법의 개발. 디지털 디자인학 연구, 8(1), 111-121. 를 스터디하며 정리한 글입니다. ✳️이전 글 ✳️ [UX 방법론/스터디] 카드 소팅과 덴드로그램 그룹화 1. 카드 소팅 사용자에게 정보 단위가 적힌 카드를 나누어 주고 사용자 스스로 분류하고 분류 의도를 설명하도록 하게 함으로써 디자인 대상자인 사용자를 이해할 수 있도록 돕는 연구 방법 Usabi design-tra.tistory.com 기존 카드소팅 테스트에는 몇 가지 문제점이 있습니다. ① 정량적인 수준에서 세부적으로 비교 불가하다. ② 단순히 정성적인 수준에서 활용되기 때문에 문제점과 개선방향을 파악해내는 데에 있어 디자이너 개인의 경험과 통찰력에 의존한다. - 기..
2021.02.24 -
[UX 방법론/스터디] 카드 소팅과 덴드로그램 그룹화
임은정, 이지현. (2016). 인트라넷 서비스의 카드소팅 분석 및 도움말 정보 설계에 관한 연구. 디지털디자인학연구, 16(2), 79-90.를 스터디하며 정리한 글입니다. 1. 카드 소팅 사용자에게 정보 단위가 적힌 카드를 나누어 주고 사용자 스스로 분류하고 분류 의도를 설명하도록 하게 함으로써 디자인 대상자인 사용자를 이해할 수 있도록 돕는 연구 방법 Usability.gov- 사이트의 정보설계를 디자인하고 평가할 수 있는 방법으로 사용자가 직접 레이블을 그룹핑하고 체계화하는 실험을 진행하는 방법 닐슨 노먼 그룹- 사용자가 콘텐츠를 어떻게 인식하고 분류하는지 이해할 수 있게 하고 사용자 멘탈 모델을 구축할 수 있는 대표적인 사용성 연구 방법 💁♀️멘탈모델 사물이 실제로 어떠한 방식으로 작동할 것이..
2021.02.23 -
[번역] 프라이밍 효과와 UI
원문: www.nngroup.com/articles/priming/ Priming and User Interfaces Exposure to a stimulus influences behavior in subsequent, possibly unrelated tasks. This is called priming; priming effects abound in usability and web design. www.nngroup.com 다음 문장을 읽어보세요: “The aroma of warm bread spread tantalizingly out of the bakery.” "따스한 빵의 향이 감질나게 베이커리 밖으로 퍼집니다." 그리고 지금 빈칸을 단어의 형태로 채워주세요. B_ _ T_R 당신은 아마 “b..
2021.02.12 -
[번역] 시간 없을 때 보면 좋은 'UX 매핑법' 비교
UX 매핑 법 : 쉽고 간단한 비교 👀요약 : 공감지도, 사용자 여정 그래프, 서비스 청사진은 같은 조직에 있더라도 다른 프로세스로 정의되고 다른 목표를 지닙니다. 원문: https://www.nngroup.com/articles/ux-mapping-cheat-sheet/ UX Mapping Methods Compared: A Cheat Sheet Understand similarities and differences among empathy maps, customer journey maps, experience maps, and service blueprints. www.nngroup.com 프로덕트를 디자인하고 개발하는 것은 종종 다른 분야와 경험을 지닌 여러 사람들과 함께 큰 팀을 이뤄 진행합니다...
2021.01.23