단순한 디자인이 성공한다

Ultimate inNOvation, 디자인경영 | Oct, 2022


2022년 디자인유노

서해성 선임의 네번째 PICK!!

단순한 디자인이 성공한다!!


생각이 깊이가 깊은 만큼 디자인의 깊이도 깊은 서해성 선임이 고른책이다.

프린터 설치가 플러그를 꽂는 일보다 어려워야 하나?

직접 부품을 조립해야 했으며, 몇번의 시도 끝에 겨우 설치 했다고...

그리고 무엇보다 나조차 사용설명서를 읽기를 귀찮아 한다.

단순함에 관한 이야기를 어떻게 풀어 놓았 을지 궁금해 진다.

이미지 설명을 넣어주세요


[1] | 우리는 왜 여기에 있나?_ 서해성선임

사용하기 편하게 만든다는 것은 사용자의 능력을 넘어서지 않는다는 것이다. 

그 능력의 최대치 내에서 사용자에게 과부하가 걸리기 직전까지 

사용하기 편리한 경험을 디자인 한다. 

단순함의 힘 사람들은 단순하고, 믿을 수 있고, 융통성 있는 제품을 사랑한다.

여러 기능이 함축 된 타사와 다르게 플립은 해상도도 낮고 광학 줌 같은 ‘기본적인' 기능도 없는 저급 제품을 출시. 케이블을 잃어버리거나 빼먹는 일이 없도록 접이식 USB 커넥터(‘플립‘이라는 이름은 여기서 유래 함)를 적용하고 단순한 버튼들로 이루어진 간편한 사용 방법으로 이 당시 유행이었던 UCC나 페이스북에 간단한 업로드를 하려는 사용자들의 수요를 충족시켰다.

이미지 설명을 넣어주세요

[파나소닉(위), 소니(아래)- 퓨어디지털]

복잡성이 증가하면 지속가능성은 떨어진다

소프트웨어에 계속해서 기능을 덧붙이면 지속가능성이 떨어지게 된다. 복잡해진다는 것은 막대한 레거시 코드로 인해 제품의 유지보수 비용이 높아진다는 것이며, 시장의 변화에 반응하기 어려워진다는 것을 뜻한다. 한편 사용자들은 제품에 점점 불만을 갖게 된다. 복잡해졌다는 것은 그들에게 중요한 기능들을 쉽게 찾을 수 없다는 뜻이다. 결국 사용자들은 쓰지도 않는 기능에 돈을 지불한다는 사실에 분노하기 시작한다.

모든 불필요한 힘에는 대가가 따른다

이미지 설명을 넣어주세요

[출처_https://brunch.co.kr/@thinkaboutlove/322] 

사용자 관점에서의 단순함 

단순한 기술이나 단순한 경영에서 단순한 사용자 경험을 만들어내는 경우도 있겠지만 꼭 그렇지 만은 않다. 구글은 인터넷상의 정보를 쉽게 찾을 수 있게 하기 위해 복잡한 기술과 수천 명의 인력을 동원하고 있다. 노련한 사용자를 위해 복잡한 시스템을 디자인하는 것도 재미있긴 하지만, 기술이 전문가의 손에서 벗어나 좀 더 넓은 사용자 층을 만날 때 더 재미있는 일이 일어난다. 

외발 자전거가 일반 자전거보다 단순하다. 타보기 전까지는


이미지 설명을 넣어주세요

[출처_https://www.11st.co.kr/products/4676411547] 

단순함의 특징 

단순하다는 것이 미니멀 함을 뜻하지는 않는다. 불필요한 것을 모두 제외한 디자인이라도 고유의 특징과 개성을 가질 수 있다. 두 개의 단순한 의자, 쉐이커와 팬톤은 각각 의자의 기본적인 구성 요소만 남은 상태다. 각각 서로 다른 문제를 해결하고 있다. 쉐이커 의자는 오래 쓸 수 있고, 팬톤 의자는 여러 개를 겹쳐 놓을 수 있다. 

사용한 소재, 핵심 요소의 강조, 요소간의 결합방식 등은 최종 디자인에 극적인 영향을 준다

이미지 설명을 넣어주세요






8aa04f9093088.jpg


[2] | 비전 수립_ 김기용책임

핵심을 기술하는 두가지 방법

모든 디자인은 일정한 제약 사항들을 충족하는 해법이다. 가장 좋은 방법은 그런 제약 사항에 대한 이해에서 시작되는 것이다.

먼저 사용자의 세계를 이해하고, 디자인이 어떻게 그 안에 녹아들 것인지 고민한다.

작은 것들을 디자인 할 때

단순한 용어를 사용하여 디자인하고자 하는 것을 표현한다. 몇 가지 지켜야 하는 지침도 같이 적는다. 디자인하다 혼란에 빠졌을 때 스스로 질문을 해본다. 그 한 줄의 단순한 문장이 디자인을 향한 척도가 된다.

규모가 큰 것들을 디자인 할 때

사용자가 어떤 경험을 하기 원하는지 써 내려간다. 사용자 경험을 써 내려가는 것은 디자인 문제에 대한 해답이 무엇인지 확실하지 않을 때 도움이 된다. 목표와 제한 사항을 다 적었을 때 쯤 이면 효과가 적은 해결책은 배제하고 몇 가지 아이디어를 떠올릴 수 있다.

이미지 설명을 넣어주세요

이미지 출처_ www.itdaa.net/open_mentorings/2547


무엇을 살펴야 할까 

직장 _ 전화/이메일/직원 등

집 _ TV 소리/느린 인터넷 등

야외 _ 햇빛/휴대폰 등

집에서, 직장에서, 야외에서, 끊임없이 사용자를 방해하는 것들을 염두에 두고 디자인해야 한다.

이미지 설명을 넣어주세요

이미지출처_ www.rakooon.com/975

사무실을 벗어나자

사람이 소프트웨어를 사용하는 환경을 제어할 수 는 없다. 그에 맞는 디자인을 해야 한다.

사용자를 관찰하는 가장 좋은 장소는 그들이 평소에 사용하는 환경이다.

대부분의 디자인은 조용한 회의실에서 디자인 시안에 집중한 체 리뷰를 진행한다. 하지만 그런 조용한 환경에서 소프트웨어를 사용하는 일은 드물다. 혼란스럽고 변화하는 환경에서도 문제 없이 쓸 수 있어야 한다.

이미지 설명을 넣어주세요

출처_ www.ohmynews.com/NWS_Web/View/at_pg.aspx?CNTN_CD=A0002739573

세 가지 유형의 사용자

사용자의 절대 다수가 주류 사용자이다. 전문가와 자발적 수용자는 소수다.

전문가 (Expert) _ 제품이나 서비스를 적극적으로 살펴보고, 할 수 있는 데까지 시험하려고 한다.

자발적 수용자 (Wiling adopter) _ 비슷한 제품이나 서비스를 사용하며 좀더 고급 기능들을 사용하고 싶어함.

주류 (Main streamer) _ 이들은 기술 자체를 위해 기술을 사용하지 않는다. 뭔가를 하기 위해 기술을 이용함.

이미지 설명을 넣어주세요

출처_ m.blog.naver.com/PostView.naver?isHttpsRedirect=true&blogId=ui-ux&logNo=221321018945

전문가(Expert)고객을 무시해야 하는 이유

주류가 원하고 주류를 위한 디자인을 해야 한다.

전문가 고객은 주류 고객을 질리게 하는 기능을 요구하곤 한다.

애플의 아이팟이 발표되었을 당시... 아이팟에 대한 전문가 고객들의 반응은 시시했다. 고작 MP3에 관심 가질 사람은 없다는 평판과 애플의 전문가 고객들은 하늘을 나는 자동차를 원했다. 현재 애플은 수억 개의 아이팟을 판매했고, 아직 까지 하늘을 나는 자동차는 없었다.

이미지 설명을 넣어주세요

출처_ www.mobiinside.co.kr/2021/10/26/xpeng-aircar/

감성적 니즈

생산성 관련 앱은 단순한 메모장 이상 이야 한다. 항목이 잘 정리되고 편안하다고 느낄 수 있어야 한다.

할 일 목록조차도 감성적 니즈를 충족해야만 한다.

사람들은 감성적인 니즈에 이끌린다. 할 일 목록처럼 간단한 것에서 조차도 사람들을 그것을 써야만 하는 이유를 찾는다. 감성적인 목표를 이해하면 디자인에서 정말 중요한 것이 무엇인지 알 수 있다고 한다.


이미지 설명을 넣어주세요

출처_www.naver.worksmobile.com/feature/task

단순함은 제어에 관한 문제다

단순함은 제어하고 있다고 느끼는 것이다.

단순한 디자인에서 가장 중요한 감성적 니즈는 사용자 스스로 제어하고 있다고 ‘느끼게‘ 하는 것이다.

첫째 _ 사용자는 자신이 사용중인 기술을 제어하고 있다고 느끼고 싶어한다. 주류는 손쉽고, 믿을 수 있고, 빠른 제어를 원한다.

둘째 _ 사용자는 스스로의 삶을 제어하고 있다고 느끼고 싶어한다.


적절한 ‘What(행동)’의 선택

디자인에서 중요한 단계들을 무시하기 때문에 제품이 복잡해지는 경우가 종종 있다.

비디오카메라

비디오 카메라는 동영상을 찍는데 집중한 제품이지만 사람들을 동영상을 찍고 공유하고 싶어 한다. 대부분 비디오카메라에서는 이 부분이 까다로우며, 플립 캠코더가 편리하게 느껴지는 이유 중 하나다. 

중요한 단계들은 놓치지 말 것.


이미지 설명을 넣어주세요

출처_ post.naver.com/viewer/postView.naver?volumeNo=22027829&memberNo=23315462

사용자 스토리

스토리의 형태에 지나치게 신경 쓸 필요 없다. 중요한 것은 제약 사항을 명시하는 것이다.

스토리는 최소한으로 유지하며 세세히 묘사하는 것이 아닌 핵심 기능만 밝힌다.

첫째 스토리는 이해와 전달이 더 쉽기 때문에 사람들이 더 많이 이용할 수 있다. 둘째 다른 상황에 대입하기 쉽다. 셋째 스토리에 세부 사항을 추가하는 것은 카메라를 줌인 하는 것 과 같아서, 사람들의 주의를 기울이게 된다.

설명보다는 직접 보여줄 것 _ 사람들의 말보다 행동을 믿는데 익숙하다. 행위에 대한 묘사는 강한 인상을 남긴다.

꾸며내지 말 것_ 스토리는 설득력이 있어야 하며, 그러려면 실제 사람과 사건에 기반해야 한다.

이미지 설명을 넣어주세요

출처_ magazine.hankyung.com/job-joy/article/202102189300d  


극단의 사용성 단순해지기 위해서는 대부분 사용성 목표보다 더 힘든 것을 목표로 해야 한다.

이미지 설명을 넣어주세요

빨리 반응한다 vs 즉시 반응한다

즉각 반응한다 대신 빨리 반응한다 라는 목표를 설정한다고 하면, 매우 빠른 제품의 반응 시간을 딱 1초 지연시키는 변경 사항을 합리화 하기 쉬워질 것이다. 이런 변경 사항들이 생길 때 마다 제품의 디자인의 단순성을 떨어지고 복잡해질 것이다. 즉시로 목표를 삼는다면 조금이라도 더 빠른 사용자 경험을 만들 방법을 찾게 될 것이다.


쉽고 빠른 방법

내 목표는 간결하고, 명확하며, 완벽한 문장을 만들어내는 것이다. 가능한 단순한 용어로 원하는 것을 묘사한다.

듣는 사람이 바로 이해한다면 아마도 명확한 묘사라고 할 수 있을 것이다. 모든 기능을 나열하려고 하지 않고 세부사항과 동일한 수준으로 주요 기능을 설명하려 해야 한다.

이미지 설명을 넣어주세요

출처_m.post.naver.com/viewer/postView.naver?volumeNo=30925362&memberNo=4998750


깨달음

시간을 들여 스토리 이면의 데이터를 검토하고 논의하라.

스토리를 검토하고 질문해보자. 무엇이 사용자의 행동에 가장 큰 영향을 미치는가?

사용자에 관해 지금까지 수집한 사실들과 그들이 당면한 문제에 대해 돌아보고 작성한 스토리에서 개선할 수 있는 점을 찾는다. 그 지점에서 우선순위를 정하고 어떤 지점이 가장 큰 영향을 줄 것인지 파악한다. 이를 바꿀 수 있는게 무엇인지 테스트하고 다양한 이유나 영향에 대해 파악한다. 이런 부분에서 발견하는 작은 차이들이 깨달음을 가치 있는 것으로 만들어 준다.


공유하라

프로젝트와 관련된 모든 사람에게, 만날 때마다 스토리를 반복하라. 끊임없이 되풀이해야 한다.

스스로 신물이 날 정도가 되어야 메시지가 겨우 통하기 시작한다.

본질적인 단순한 문구를 노출시켜 모든 사람들이 무엇을 기대하고 무엇을 만들어야 하는지 알게 된다.

일단 비전을 발굴하고 공유하기 시작했다면 디자인을 할 준비가 된 것이다.

이미지 설명을 넣어주세요

출처_www.currentschoolnews.com/ko/인터뷰/기자-인터뷰-질문/


[3] | 단숨함을 위한 네 가지 전략 _ 정연주차장

단순함을 위한 네 가지 전략

1_제거 _ 기기의 본질적인 부분만 남기고 모든 불필요한 버튼들을 제거한다.

2_조직화 _ 좀더 이해하기 쉽게 버튼들을 그룹화해 배열한다.

3_숨기기 _ 가장 중요한 버튼들만 남기고 나머지는 모두 덮개 아래 숨겨 사용자의 주의를 흩뜨리지 않게 한다.

4_이전 _ 몇 개의 기본적인 기능만 있는 아주 단순한 리모콘을 만들고 나머지는 TV 화면에서 제어함으로써,리모컨의 복잡성을 TV로 이전 한다.

이 전략은 기능과 컨텐츠 양쪽에 모두 적용된다. 웹사이트 전체와 같이 규모가 크거나 하나의 페이지와 같이 작은 규모에도 적용된다.

이미지 설명을 넣어주세요


[4] | 제거

제거_ 중요한 문제가 무엇인가?

단순화의 가장 확실한 방법은 불필요한 것을 없애는 것

이미지 설명을 넣어주세요

특별한 부가가치 기능 < 기본적인 기능의 개선

But, 공감할 수 없고 만족스럽지 않은 과정을 통해 제품의 가장 흥미로운 기능들이 제거 되는 것을 보고만 있지는 말자.

디자인에 책임을 지고, 제품의 가치를 높이는 기능과 컨텐츠를 만드는 데 집중


하지만 사용자가 ~하려고 한다면?

기능을 없애자는 취지로 제안을 하더라도, “하지만 사용자가 ~하려고 하면?” 이라는 말로 모든 기능이 정당화 됨.


이미지 설명을 넣어주세요

사소한 변경이 복잡한 과정을 야기 한다면, 한 걸음 물러서서 다른 해결책을 찾을 때

과정이 아닌 해결책을 제시


기능의 우선순위 매기기

어떤 기능은 남기고 어떤 기능은 제거 할지 결정

▪ 사용자의 목표를 밝혀내고 우선순위를 정하기

- DVD 리모컨의 경우, 주된 목표는 DVD를 보는 것. 두번째 목표로 DVD 부가 정보의 이용. CD나 MP3등 다른 미디어의 재생.

▪   사용자의 최우선 목표를 완벽하게 만족시키는 해결책에 집중

▪  불안이나 스트레스를 일으키는 원인들을 밝혀내고 그 스트레스를 손쉽게 없애 주는 기능에 우선순위를 둠

- DVD 리모컨의 경우, 시청 중 전화 받을 때 일시정지 버튼 必

▪  주류 사용자의 니즈를 충족하고 ‘기본’ 조작 기능과 전문가들을 위한 ‘정밀’조작 기능을 구분

- 정밀기능은 작은 버튼으로 적용, 기본 조작기능 우선.

▪  제품의 가치를 기능의 수로 판단하려는 유혹에 빠지지 말 것

사람들에게 무엇이 정말 중요한지 알아내고 그들이 어떻게 반응할지 이해하는 최선의 방법은 Mock-up을 주고 어떻게 쓰는지 관찰. 핵심 과업에서는 타겟 사용자에게 기쁨을, 부차적인 과업에서는 마음에 드는 것 정도로 만족 .


단순한 사용자 경험

이미지 설명을 넣어주세요

사용자들은 ‘적당히 괜찮게, 빨리’를, 전문가들은 ‘시간이 걸리더라도 완벽하게’ 를 원한다는 것. 단순한 경험을 디자인하려고 한다면, 지금 제공하려는 옵션들이 완벽함을 위해 속도와 단순함을 희생하려는 것이 아닌지


지나치게 없앤 경우

사용자의 제어를 없앤다면? = 도쿄의 애플 스토어 엘레베이터

엘리베이터의 핵심 = 사람을 다른 층으로 이동시켜주는 수단 버튼이 없는 엘리베이터에서 사람들을 걱정하느라 시간과 주의력을 낭비 제어 기능을 모두 없앤다고 해서 경험이 단순해지는 것이 아니라, 오히려 복잡해짐

이미지 설명을 넣어주세요

사람들에게 결과물을 제어 할 수 있는 능력 을 주는 것이 핵심. 사람들은 승객보다 파일럿이 되고 싶어 함.

이미지 설명을 넣어주세요 ‘제거’의 전략은 주의를 흩뜨리는 것을 없앰으로써 프로젝트의 중점을 명확히 하는 것.

쓸데없는 부분을 제거하면 사용자는 중요한 부분에 집중할 수 있음.


[5] | 조직화 _ 박건희실장

조직화 Regularization

조직화는 사물을 단순하게 만드는 가장 빠른 방법일 수 있다

이미지 설명을 넣어주세요


덩어리로 나누기 Regularization

DVD 리모콘의 버튼을 좀더 간편하게 만드는 방법 중 하나는 버튼들을 여러 덩어리로 나누는 것이다

이미지 설명을 넣어주세요

사용자들에게 단순하게 느껴지는 최소한의 덩어리 만을 사용

덩어리의 수가 작으면 선택의 여지도 적어지고 사용자의 부담도 줄어든다


행동화에 따른 조직화 Regularization

조직화의 첫 번째 포인트는 사용자의 행동을, 그들이 무엇을 하고 싶어하고 어떤 순서로 하고 싶어 하는지를 이해하는 것이다

이미지 설명을 넣어주세요

사용자의 행동을 매핑 하면 소프트웨어를 어떻게 조직화 할지 알 수 있다


명확히 구분되는 카테고리 Regularization

좋은 카테고리는 경계가 명확하다

이미지 설명을 넣어주세요

동등한 항목들을 조직화 할 때 명확히 구분되는 카테고리 를 선택하고 사용자가 공감할 수 있는 레이블을 붙인다


알파벳과 포맷 Regularization

알파벳 순서로 정렬하면 항목이 뒤죽박죽 되어버린다

이미지 설명을 넣어주세요

알파벳, 포맷(단어, 사진, 동영상) 순서의 목록이 단순해 보이지만 실제로는 그다지 도움이 되지 않는 카테고리 분류 방식 중 하나다.


검색 Regularization

검색이 브라우징 보다 사용하기도 만들기도 어렵다

이미지 설명을 넣어주세요

단순한 사용자 경험을 디자인할 때, 대부분의 경우 기본적인 조직화에서 시작해 검색 기획으로 나아가는 것이 최선이다.

시간과 공간 Regularization

시간 순으로 사건을 나열하는 것은 단순하면서도 강력하다

이미지 설명을 넣어주세요

타임 라인은 사건을 나열하는 보편적인 방법이다.


그리드 Regularization

정돈된 레이아웃이 디자인을 단순하게 만드는 데 큰 역할을 한다

이미지 설명을 넣어주세요

보이지 않는 그리드를 이용해 항목을 정렬하는 것은 화면 상에서 사용자의 주의를 끄는 효과적인 방법이다.


크기와 위치 Regularization

그리드 위에 항목을 레이아웃 할 때 크기와 위치를 잡는 것은 중요하다

이미지 설명을 넣어주세요

실제 비율과 맞지 않더라도 중요한 것은 크게 만든다.

공의 크기를 왜곡 시킴으로써 모든 스포츠가 똑같이 중요함을 보여준다.


레이어 Regularization

런던 지하철 노선도는 아주 작은 공간에 수많은 정보가 채워져 있다

이미지 설명을 넣어주세요

지각적 레이어는 컬러로 구분하는 것이 가장 효과적이지만,

다양한 밝기의 회색조나 크기, 심지어 형태를 통해서도 같은 효과를 낼 수 있다.


컬러 코딩 Regularization

컬러 코딩은 널리 쓰이는 기법이다. 병원, 폴더, 신호등, 시력 검사표, 지도, 계기판 등 모든 곳에 쓰인다

컬러 코딩은 사람들이 오랜 시간을 들여 학습하고 재사용할 것이 확실시되는 경우나,

사용자가 이미 학습한 코드를 사용하는 경우 가장 효과가 좋다

이미지 설명을 넣어주세요


비공식 도로 Regularization

사람들이 항상 우리가 만들어 놓은 길로 다니는 것은 아니다

이미지 설명을 넣어주세요

단순한 조직화란 소프트웨어를 사용하면서 어떤 것이 좋다고 느껴 지느냐의 문제지,

기획할 때 어떤 것이 논리적으로 보이 느냐의 문제가 아니다


[6] | 숨기기 _ 노성현 선임마케터

숨기기

주변에서 보기 쉬운 리모컨의 경우 덮개를 적용하여 주로 쓰지 않는 버튼들을 가리는 방식을 사용 그 외에도 최근 일반적으로 사용하는 숨기는 방법은 터치 디스플레이의 적용하는 방범으로 주로 사용하는 기능을 표현하고 다른 기능들은 하위 메뉴로 숨겨 놓는다 숨긴다는 것은 어떠한 방법이든 사용자와 기능 사이에 장벽을 치는 일이며, 어떻게 사용자가 불편해 하지 않도록 어떤 것을 숨길지 주의 깊게 선택해야 한다.

기능을 숨기는 것은

저렴한 해결 방안이긴 하다

하지만 어떤 기능을 숨겨야 하는가?

이미지 설명을 넣어주세요

자주 쓰이지는 않지만 반드시 필요한 것들

주류 사용자들이 잘 사용하지 않지만 가끔 변경하기도 하는 항목들은 숨기기 좋은 경우이다. 사용자의 목표 보다는 사용자가 누구이고 어디에 있는가와 관련이 있기 때문에 2장. 비전 설정에서 작성한 스토리에 이런 기능들이 등장할 가능성은 거의 없다 일상에서 다양한 어플 / 웹 / 전자제품 등에서도 볼 수 있든 우측 상단 메뉴버튼의 하위 항목 등으로 환경설정 이 배치되어 있는 것을 볼 수 있으며,

이러한 기능들은 소프트웨어를 잘 사용하는 것에 중점을 둔다

이미지 설명을 넣어주세요

커스터마이징

사용자의 니즈에 따라 기능을 숨기는 등의 인터페이스 커스터마이징 수단을 제공하는 방법

사용자에게 선택권을 준다는 면에서 공평하고 관대한 것처럼 보일 수 도 있지만, 커스터마이징이 번거롭고 시간이 걸릴 수 있다는 점이 문제이다. 일반적으로 사용자가 소프트웨어를 커스터마이징 하는 일은 없어야 하며 어떤 기능을 숨길지 검토하고 결정하는 것은 전문가들이 해야 할 일이다.

커스터마이징을 할 수 있지만

그런 일에 시간을 보내고 싶어 할까?

이미지 설명을 넣어주세요

자동 커스터마이징

사용자의 행동에 기반해 자동으로 기능을 보여주거나 숨기는 방식

마이크로소프트 오피스의 적응형 메뉴를 보면 그 방식이 얼마나 어려운지 알 수 있다.

완벽한 알고리즘을 사용하지 않는 한 사용자의 기대와 맞지 않는 경우가 종종 발생하고 사용자는 이로 인해 신뢰를 잃어 버리고 인터페이스가 혼란 스럽다고 생각할 것 이다.

누군가가 옷장 안의 순서를

매일 바꿔 놓는다고 생각해보라

이미지 설명을 넣어주세요

점진적 노출

주류 사용자를 위한 핵심 기능 몇 개를 보여주고 전문가를 위한 정밀 조작 기능들은 확장했을 때만 보여주는 경우로 정밀 조작 기능을 숨기는 것은 단순화를 위한 훌륭한 방법이다.

저장 대화 상자가 대표적 사례로 단순히 파일을 저장하는 것이 아니라 어떠한 확장자로 저장을 할 것인지 선택할 수 있게 함으로 자동 커스터마이징보다 나은 기능이다.

단, 적적한 컨텍스트 안에 사용자의 기대에 맞는 명확한 단서를 둬야 한다.

이미지 설명을 넣어주세요

단계적 노출의 규칙

1 _ 배경을 이야기하라.

2 _ 스토리를 가져라

3 _ 사용자의 언어로 이야기 하라

4 _ 정보를 이해하기 쉬운 양 만큼 씩 나누어 보여줘라

사용자가 등을 떠밀리는 것처럼

느껴서는 안된다.

이미지 설명을 넣어주세요

처음부터 보여줘야만 하는 것은 아니다

사용자가 필요로 하는 시점에 나타나게 하는 방식으로 이처럼 완전히 숨겨버리는 방식의 경우 디자이너들은 기껏 만든 기능을 사용자가 찾지 못할 것이라 걱정 할 수 있다.

위키와 같이 텍스트 내 링크를 걸게 된다면 사용자의 주의를 산만하게 만들 수 있고 어떠한 단어에 하이퍼링크를 걸지 선택하는 과정을 거쳐야만 한다. ‘뉴욕타임스’가 선택한 방법은 성공적인 숨기기란 어떠한 것인지 보여준다. 

뉴욕타임스

이미지 설명을 넣어주세요

디자인 프로그램에 숨어있는 디자인

숨겨져 있는 기능을 어떻게 설명하면 좋을까 .

어도비 일러스트레이트는 드로잉 툴 중 몇 몇에 고급 기능이 들어있고 툴 팔레트상에 작은 화살표로 표현된다. 한번 클릭하면 기본 툴이 선택되고 클린한 채로 누르고 있으면 고급 옵션이 나타난다.

이러한 접근법이 훌륭한 이유는 어떤 기능이 들어 있는지 설명하는 레이블을 쓰지 않고 기능을 살펴보도록 유도한다는 것이다.

작은 단서로 숨겨진 기능을 암시할 수 있다.

이미지 설명을 넣어주세요

레이블을 어디에 둘 것인가

사용자가 처음 화면을 보거나 새로운 과업을 시작할 때의 관심 영역은 광범위하다. 그러나 곧 어떤 하나의 과업에 집중하면서 관심 영역이 좁아지게 되고 이러한 이유로 도움말을 필요할 때 찾지 못하게 된다. 즉 사용자가 어떠한 제품을 써 나가면서 어떻게 단서를 쥐어 주고 자연스럽게 접할 수 있게 만드는 지가 관건이며 단, 이러한 일련의 흐름이 길을 막아서는 안된다고 할 수 있다.

이미지 설명을 넣어주세요

숨기기는 4가지에 달려 있다.

1_ 한 번만 설정하면 되는 옵션들은 숨긴다.

2_ 정밀 조작 기능은 숨긴다. 그러나 전문 사용자의 경우 이 기능이 항상 보이도록 설정할 수 있게 한다.

3_ 주류 사용자에게 커스터마이징을 강요하거나 커스터마이징을 할 수 있을 거라고 기대하지 말고, 이런 옵션은 전문가를 위해서만 제공한다.

4_ 우아하게 숨긴다, 즉 완벽하게 숨기고 적절할 때 나타나게 하라.

숨긴 기능을 찾는 데 너무 오래

걸리지 않아야 제대로 된

숨기기라고 할 수 있다.

이미지 설명을 넣어주세요

[7]|이전_정동현 마케터

이전

리모콘에 재생과 일시 정지 등 가장 기본적인 몇 가지 동작만 남겨두고 나머지는 모두 TV화면상의 메뉴로 처리한다. 리모콘 그 자체로 접근하기 쉽고, 사용하기 간단해진다. 기존 TV화면을 활용하여 리모콘 플랫폼에서의 한계를 극복할 수 있다.

단순한 경험을 만들어내는 비법 중 하나는

적절한 기능을

적절한 플랫폼의

적절한 부분에

배치하는 것이다.


이미지 설명을 넣어주세요

출처_https://www.apple.com/kr/tv-home/

기기 간의 이전

어떤 플랫폼에서는 쉬운 것이 다른 곳에서는 복잡하게 느껴질 수 있다. 런키퍼 모바일앱은 핸드폰의 GPS로 위치정보와 데이터를 수집하며, 런키퍼 웹에서는 상세한 데이터를 한눈에 표시 하여 쉽게 볼 수 있다.

모바일 앱은

데이터를 기록하는데,

웹사이트는

기록한 데이터를

검토하는 데

최적화 되어있다.

이미지 설명을 넣어주세요

출처_https://runkeeper.com/cms/

모바일 vs 데스크탑

기기마다 고유의 강점과 약점이 있게 마련이다.

모바일 기기로 많은 양의

텍스트를 입력하기는

불편하기 때문에

데이터의 입력 같은 것은

다른 플랫폼으로

이전하는 것이 합리적이다.

이미지 설명을 넣어주세요

출처_https://www.apple.com/kr/iphone-14/

출처_https://www.apple.com/kr/imac-24/

사용자에게 이전하기

남들이 보기에 복잡해 보이는 계획도 있었지만 사용자 스스로에게는 모두 일리가 있는 것들이었다.

단순한 인터페이스를 통해 이 과업을

사용자의 몫으로 남겨 두었다.

복잡함을 사용자의 머리로 이전한 것이다.

이미지 설명을 넣어주세요

출처_https://www.etnews.com/20220307000019 


사용자가 가장 잘 하는 것

컴퓨터는 정확한 계산에 능하고 사람들은 결과물을 제어하고 싶어 한다.

사용자는 방향을 잡고

컴퓨터는 안내를 한다면

사용 경험이 좀더 단순하게

적절한 부분에

느껴질 것이다.

이미지 설명을 넣어주세요

개방형 사용자 경험 만들기

똑똑한 기획자는 하나의 컴포넌트가 여러 목적으로 쓰이게 함으로써 단순화하기도 한다. 비슷한 기능을 묶어 단순화하는 것이 깔끔한 해법이다.

자동차 뒷 유리창 열선이

라디오 안테나 역할을

하는 경우도 있다.

이미지 설명을 넣어주세요

출처_https://m.kmib.co.kr/view.asp?arcid=0924224405


부엌칼과 피아노

단순한 인터페이스의 궁극은 전문가와 주류 모두에게 적합한 인터페이스다.

부엌칼과 피아노는

전문가와 주류 사용자

양쪽의 기대와 니즈에 부응한다.

이미지 설명을 넣어주세요

출처_ https://blog.naver.com/dear7008/222874069814

출처_ https://www.chosun.com/culture-life/culture_general/2022/07/01/B7SBBT4TYZH5ZEFSIAWIFFQQW4/


구조화되지 않은 데이터

데이터를 구조화하는 일 중 일부를 컴퓨터가 처리하게 한다면 사용자 경험을 단순화 할 수 있을 것이다.

자동 완성 텍스트를 사용하면

단 몇 번의 탭만으로

전체 문장을 완성할 수 있다.

이미지 설명을 넣어주세요

출처_https://support.apple.com/ko-kr/HT207525

신뢰

과업의 이전이 가장 쉬운 경우는, 특정한 방식으로 두 개의 기기를 같이 사용하면서 그 사이에서 과업을 나누어 처리하는 경우다.

컴퓨터가 사용자의 행동을 제어하거나 지시할 경우

사용자는 불편하다고 느낄 수 있다.

단순한 경험은 신뢰를 필요로 한다.

이미지 설명을 넣어주세요

출처_https://www.internetsearchinc.com/ultimate-guide-to-the-ecosystem-of-apple/


[8] | 실전에 앞서 _ 복잡성의 보존_신정아대표

복잡성이라는 두더지를 하나 때려잡고 나면

다른 곳에서 또 하나가 튀어 나온다.

단순한 사용자 경험을 만들어내는 비결은

복잡성을 적절한 곳으로 옮겨서 매순간이 단순하게 느껴지게 하는 것이다.

이미지 설명을 넣어주세요

출처_ https://www.wadiz.kr/web/campaign/detail/20769

단순함은 사용자의 머릿속에서 일어난다

사용하기 편하게 만든다는 것은 사용자의 능력을

넘어서지 않는다는 것이다.

그 능력의 최대치 내에서 사용자에게

과부하가 걸리기 직전까지 사용하기

편리한 경험을 디자인 한다.

사용자가 상상력을 발휘할 충분한 공간을 주자

이미지 설명을 넣어주세요 

출처_ https://semiye.com/1027

출처|상상력을 끌어올리는 10가지 법칙_ https://post.naver.com/viewer/postView.nhn?volumeNo=7101688&memberNo=4841206


ⓒ DESIGN UNO. all rights reserved.