더 나은 양식(form)을 디자인하는 7가지 방법 (7 ways to design better forms)

이 글은 Quovantis7 ways to design better forms글을 번역했습니다. 저의 모든 글은 허가를 받고 진행 하였습니다

디자이너들이 웹 양식(form)에 공감이 부족한 것에 대해 무엇을 할 수 있을까요?

presentation
양식(form)에 대해 생각할 때, 저는 케익워크였던 것들보다 저를 더 떨게 했던 것들을 기억합니다. 그리고 제가 기억하는 두 가지 주요한 차이점은 쉬운 것들이 인간의 언어로 제게 말을 걸었다는 것입니다. 반면에 어려운 것들은 제가 화성의 땅을 사기 위한 양식을 작성하는 것처럼 보였다는 것입니다.
더욱 괴로운 것은 디지털 세계에서도 이러한 형태가 여전히 우리를 괴롭히고 있다는 것입니다. 디지털 시대에는 삶이 더 쉬워지기로 되어 있지 않았나요?
그렇다면 나쁜 양식(form)로부터 세상을 구하기 위해 무엇을 할 수 있을까요?
공감으로 디자인하세요 (Design with Empathy).
사용적합성 전문가와 UX 연구원들은 디자이너가 양식(form)을 디자인하는 동안 발생하는 일반적인 실수를 알아냈습니다. 자, 이제 공은 우리 코트에 있습니다. 어떤 형태도 사용자들의 경험을 악화시키지 않도록 하는 것은 양식(form)의 창안자인 우리들에게 달려있습니다.
시작하기 전에 디자인 저장소로 이동하여 오늘까지 설계한 모든 양식(form)을 읽어보시기 바랍니다. 저 대신 아래 질문에 대답해 주세요
  • 지금 읽으면서 헷갈리게 들리는 질문이 있나요?
  • 사용자에게 너무 많은 관련 정보를 요청합니까?
  • 여러 가지 선택 질문에서 사용자에게 충분한 선택권을 주었습니까? 옵션 중 답과 일치하는 항목이 없을 경우 응답을 쓸 수 있는 필드가 있습니까?
  • 양식(form) 및 용도를 이해하는 데 도움이 되도록 사용자에게 지침을 제공했습니까?
  • 이 정보를 다른 용도로 사용하는 방법/사용하지 않는 방법에 대한 거부권을 양식(form)에 추가했습니까?
  • 개인정보를 요청했나요? 혈육 집단처럼 결혼 상태도요? 폐경에는 필요 없었나요?
이 연습으로, 저는 여러분이 사용자들의 입장에서 생각해보고 이것에 대답해 주기를 바랍니다. 만약 누군가가 여러분에게 이 양식(form)을 채우라고 한다면 여러분은 어떻게 느끼겠습니까? 지루하고, 당황스럽고, 짜증나고, 만족하고, 행복할까요?
여러분의 반응이 무엇이든, 그것은 여러분이 실수를 알아내고 더 나은 웹 양식(form)을 디자인하는 데 도움이 될 것입니다. 하지만 먼저, 현재의 형태로 볼 때 흔히 볼 수 있는 문제들은 어떤 것들이 있는지 알아보겠습니다.

그들은 인간적인 대화가 부족합니다.

대부분의 웹 양식(form)에는 사용자와 대화하는 동안 감정이입이 부족합니다. 그들은 혼란스럽고, 길거나, 그저 부담스러운 질문을 던집니다. 하지만 꼭 그렇게 될 필요는 없습니다. 형태는 다른 의사소통 수단과 마찬가지로 쉽게 흐르도록 해야 합니다. 그들은 명확하고 간결해야 하며 때로는 영리해야 하며 항상 협조적이어야 합니다. 아래의 예를 고려해보세요.
presentation
질문은 이 양식(form)을 작성하는 사용자에게 적어도 한 명의 자녀가 있다고 가정했습니다. 하지만 여전히, "아이가 없다"는 선택사항을 추가합니다.
이 질문을 하는 더 좋은 방법은 "몇 명의 자녀가 있습니까?"라는 텍스트 필드의 뒤에 사용자가 숫자를 숫자로 추가할 수 있습니다.

관련 없는 정보를 너무 많이 요청합니다.

우리 모두는 자료를 좋아하지만 너무 많은 질문을 하기 때문에 채우기 양식(form)을 싫어합니다. 사람들은 너무 많은 개인 정보를 요구하는 채우기 양식(form)을 두려워합니다.
이런 식으로 생각해 보세요- 당신은 휴가 중에 낯선 사람을 만납니다. 여러분은 잡담에 빠져들지만, 그 후에, 낯선 사람이 여러분을 괴롭히고 개인적인 질문을 하기 시작합니다. 결혼 상태, 취미, 그리고 수입원 같은 것들. 그게 당신을 기겁하게 하나요? 물론이지요!
웹 양식(form)은 그 이상한 낯선 사람과 꽤 비슷해요. 다음은 웹 버전입니다.
presentation
당신이 접속하지 않으면 아무도 그들의 개인 정보를 기입하고 싶어하지 않을 것입니다. 따라서 사용자와 신뢰할 수 있는 관계를 구축하고 양식(form)에 인간의 손길을 추가하는 것이 중요합니다.

그들은 일관성과 성격이 부족합니다.

닉 바비치(Nick Babich) 말이예요
"양식(form)은 대화의 한 종류입니다. 그리고 여느 대화처럼 사용자와 앱이라는 두 당사자 사이의 논리적 소통으로 구성되어야 합니다."
당신의 양식(form)에 착지한 사용자들은 대화를 시작하기 위해 여기 있습니다. 그러나 입력 필드, 정렬, 간격, 텍스트 색상, 라벨과 같은 작은 것들이 일관되지 않고 시각적으로 어수선해 보일 때, 그들은 사라집니다. 혼동을 일으키며 건너뛰거나 잘못된 정보를 채웁니다.
그리고 그 목록은 아마도 끝이 없을 것입니다. 우리가 여기서 도출할 수 있는 유일한 결론은 나쁜 양식(form)은 모든 것이 존재한다는 것입니다. 등록 양식, 뉴스레터용 양식, 체크아웃 절차를 위한 더 크고 복잡한 양식.
그래서, 이제 정신적 모델은 이용자들이 웹사이트와 상호작용하면서 3~4개의 나쁜 형태들을 접하게 되면, 시간과 노력을 낭비하게 될 것이라고 추측할 수 있습니다. 그들은 심지어 '양식(form) 채우기'라는 생각조차 하지 않습니다. 이것이 양식(form) 디자인 설계의 주요 장애물입니다. 양식을 작성하여 사람들이 양식을 작성하는 방법?
몇 가지 제안을 도와드릴 수 있습니다. 다음은 최종 사용자를 염두에 두고 보다 나은 양식(form)을 설계할 수 있는 7가지 방법입니다.

사용자를 파악합니다.

웹상의 대부분의 양식(form)은 "누구를 위한, 모두를 위한" 것입니다. 우리의 사고방식에 따라 점점 더 많은 데이터를 수집하고 싶어한다고 탓합니다. 더 많은 가입자가 있습니다. 하지만 더 많은 사용자가 충성스러운 사용자와 동일합니까? 당치 않아요!
사용자 정보를 더 많이 수집하기 위한 무분별한 경쟁에서 우리는 종종 실제 사용자, 즉 우리가 만나고자 하는 사람들의 경험을 망칩니다. 그렇다면, 여러분의 목표 대상 고객이 누구인지, 왜 그들이 여러분의 웹사이트를 방문하는지, 그리고 그들이 그 양식(form)을 가지고 무엇을 달성하기를 원하는지 아는 것이 중요합니다. 그들은 제품을 구매하고 싶나요? 아니면 이메일로 홍보 제안을 받기를 원하나요?

불필요한 데이터 수집을 피합니다.

사용자의 개인 정보를 요청하면 마음에 빨간 깃발을 들고 즉시 떠나야 할지 계속해야 할지 고민하기 시작합니다. 예를 들어, 혈액 기증자가 되기 위한 양식(form)을 적십자사로 작성하고 있는데, 그들이 당신의 이메일 아이디를 요청한다면, 왜 그들에게 전화번호가 아닌 이메일 ID가 필요한지 궁금하지 않나요?
이제, 헌혈자로서, 저는 이메일 아이디가 아니라 제 전화로 알려드리고 싶습니다. 그리고 만약 어떤 양식(form)이 저에게 이메일 아이디를 묻는다면, 저는 그들이 저에게 정기적으로 이메일을 보내줄 것이라고 생각합니다. 젠장! 내 받은 편지함에는 이미 스팸 메일이 가득해요. 계속할까요, 건너뛸까요?
따라서 사용자의 답변을 원하는 질문을 신중하게 고안해야 합니다. 그리고 구체적인 개인정보를 수집하는 데 이유가 있다면, 양식(form)에 명시적으로 언급해 주세요.

개인 정보를 수집하는 이유를 설명합니다.

생년월일, 주소, 신체적 특징(예: 체중, 출생지), 혼인 여부, 성적 선호도, 종교, 소득, 사회경제적 지위, 문화적 배경, 학력 등의 정보는 모두 민감한 개인 정보로 간주됩니다.
따라서 사용자에게 양식(form)을 작성하도록 요청하는 정보가 무엇인지 알고 있어야 합니다. 너무 많은 개인 정보를 요청하면 대부분의 사용자가 양식(form)을 삭제합니다.
presentation
그러나 이 질문이 꼭 필요한 경우 사용자에게 이 정보가 필요한 이유와 이 정보를 사용하여 무엇을 할 것인지를 설명합니다. 이 정보가 귀하와 함께 안전하다는 확신을 그들에게 제공하세요!

이해하기 쉬운 질문을 합니다.

웹 상의 모든 사용자는 다릅니다. 그들은 모든 연령층에 속하며 웹을 검색해야 하는 자신만의 이유가 있습니다. 몇몇은 전문가이고 몇몇은 순진합니다. 그러므로, 여러분의 양식(form)이 그들에게 위협적이라고 느끼지 않는 것이 중요합니다.
만약 여러분이 지역적이거나 특정한 연령층에게만 이해될 수 있는 약어나 용어를 사용한다면, 그것은 사람들을 혼란스럽게 할 것입니다. 그들은 그 부분을 건너뛰거나 그들이 옳다고 생각하는 모든 것에 대답할 것입니다.

사용자가 응답하는 데 도움이 되는 레이블을 작성합니다.

레이블은 텍스트 필드, 확인란, 드롭다운 메뉴 및 양식(form)의 다른 모든 정보 필드를 식별하는 텍스트입니다. 사용자가 작성해야 할 정보를 지시하고 사용자에게 알립니다. 이를 통해 사용자가 원하는 작업을 전달할 수 있습니다.
따라서 처음 보는 사용자도 쉽게 질문에 답하는 데 도움이 되는 언어로 라벨을 작성해야 합니다. 하지만, 너무 긴 문장을 쓰지 마세요. 라벨은 바삭바삭하고 짧아야 합니다. 예를 들어, 더 짧고 더 나은 라벨이 있는 현재의 것과 비교하여 Amazon의 이전 기호를 볼 수 있습니다.
presentation
Source- Nick Babich, Smashing Magazine

관련 사항을 그룹화합니다.

관련 정보를 논리 블록으로 그룹화하면 질문의 흐름을 이해하는 데 도움이 됩니다. 유사한 정보를 그룹화할 때 사용자는 더 나은 방법으로 정보를 파악할 수 있습니다.
아래 예를 생각해 보십시오. 첫 번째 예에서는 모든 필드가 사용자의 화면에 표시되고 약간 압도적으로 느껴집니다. 가장 먼저 떠오르는 생각은 "내가 이 모든 것을 채워야 하는 건가요?" 입니다.
그러나 적절한 레이블과 함께 항목을 그룹화하면 사용자는 개인 정보, 계정 관련 정보, 연락처 정보 중 어떤 부분을 작성하는지 이해할 수 있습니다.
presentation
Source

오류가 발생할 때 도와줍니다.

사용자가 특정 입력 필드를 사용하여 수행해야 할 작업을 명확하게 이해하지 못할 경우 오류가 발생할 가능성이 높습니다. 그래서 빨간 마크로 겁을 주지 않는 것이 중요합니다. 대신, 그들을 성공으로 인도하세요. 유용한 메시지로 올바른 방법을 알려줍니다.
presentation
예를 들어 Facebook은 사용자가 암호를 잘못 입력했을 때 놀라울 정도로 유용합니다. 입력한 암호가 올바르지 않으면 얼마 전에 변경되었음을 인터페이스에 알립니다.
양식(form) 설계를 단순화하는 방법은 여러 가지가 있습니다. 그러나 항상 더 나은 사용자 환경을 만들 수 있는 고정된 단계는 없습니다. 명심해야 할 건 짧게 하는 거예요 그리고 간단합니다. 사용자는 프로세스에 많은 '생각'을 하지 않고 더 많은 작업을 수행해야 하는 경우를 매우 좋아합니다. 그래서 그들의 시간을 존중하면 그들은 당신의 디자인을 존중할 것입니다.
원래 Humble Bits에서 발행되었습니다.

이 글은 번역 글입니다. 원본 링크입니다.


안녕하세요! Early adopter입니다.
페이스북 [DTF] 디자인 번역 공장 - Design Translation Factory 그룹도 많이 가입해주시길 바랍니다.
"보버"에서 "디자인 번역 공장" 연재를 저와 함께 해주실 분을 찾습니다. 하단 "리뷰" 또는 "페이스북"으로 편하게 메시지 주세요!
PS. 제가 사용하는 블로그 "보버"에 "함께 쓰는 블로그"라는 기능이 요번에 추가됐네요 ㅋ (미디엄에 퍼블리케이션 같은 기능..)
하단 링크 글을 보시면 "디자인 번역 공장"에 어떻게 함께 연재할 수 있는지 자세히 설명되어있습니다. 또는 쉽게 FB 메시지 주세요!
https://bit.ly/2LxR0Bz

https://bit.ly/2L6WsZp