view 뷰를 변경하는 데 5 .

오류 메시지를 작성하는 방법, 사용자에게 좋고 친절합니다.

너무 오래 읽고 싶니?

"웹 사이트가 충돌합니까?"

당신은 한 적이 있습니까? 나는 내가 좋아하는 아이템을 지불하기 위해 압박 할 것입니다. 모든 신용 카드 정보를 흥분으로 작성하십시오. 그러나 그 메시지는 그 "오류" . ... 흥분을 즉시 과민성으로 바꾸는 짧은 단어는 "어디서 놓칠 곳?" "다음에 무엇을해야합니까?" 이 질문들은 머리가 달렸다. 그러나 화면에는 대답이없는 답변 만 있습니다. 마침내 그 얼굴을 한숨을 쉬고 눌렀습니다. 고객이 웹 사이트 나 응용 프로그램에서 이러한 유형의 경험을 경험하기를 원하지 않는다면,이 기사는 "악당"이었던 오류 메시지를 변경하는 "성경"으로 고객에게 믿을 수 없을 정도로 "보조자"로 경험을 파괴 할 수 있습니다.

여전히 대화 인 쓸모없는 오류 메시지는 이유는 무엇입니까?

많은 사람들이 오류 메시지가 시스템의 "작은 부분"이라고 생각할 수도 있지만 실제로는 사용자의 경험 (사용자 경험)에 대해 관심을 갖는 오류 메시지 문제가 이러한 이유로 인해 발생하는 사용자가 얼마나 많은지에 관심을 갖지 않는 "지표"입니다.

1. 프로그래머에 의해 작성 : 소프트웨어 개발 알림 메시지의 세계에서 개발자가 개발자가 개발 팀에 유용한 "Error Code : 502"또는 "NULL 포인터 예외"와 같은 시스템 오류를 이해하도록 종종 생성됩니다. 그러나 일반 사용자의 경우 이해보다 더 혼란스러운 외계인 언어와 다르지 않습니다.

2. UX 작문의 중요성을 내려다 보면 : 디자인 (UI)에 전념하는 많은 조직이 아름답지만 "단어"또는 "텍스트"가 디자인의 일부, UX 작가 또는 사람이 직접 책임이 없다는 것을 잊었습니다. 이 부분이 불행히도 무시됩니다

3.주의를 기울일 시간이 없을 때까지 서둘러 : 좋은 오류 메시지를 작성하기 위해 시간과 경쟁 해야하는 개발 과정에서 종종 마지막 "충분한"것으로 간주되며, 의식이없고 사용자를 돕기 위해 실제로 설계되지 않은 조립식 메시지를 얻을 수 있습니다.

이러한 원인을 이해하는 것은 더 나은 경험을 만드는 시작입니다. 또한 UX/UI 개선의 중요한 토대로 비즈니스에 많은 전환을 추가하는 데 도움이됩니다

[삽화를위한 프롬프트 : 프로그래머를 보여주는 만화가 어깨를 어깨에 으 rug습니다. "오류 : 0xdeadbeef"의 상자와 함께, 다른 쪽은 혼란스럽고 혼란스러운 사용자입니다]

단지 "오류"한 단어 ... 생각보다 비즈니스를 더 많이 파괴 할 수 있습니다.

"작은 알림 메시지 일뿐입니다." 그러나 실제로 나쁜 오류 메시지의 영향은 폭력적이고 많은 차원에서 손상됩니다.

- 전환율 DANT : 이것은 가장 분명한 효과입니다. 사용자가 문제에 직면 할 때 (예 : 양식을 작성하지 않고, 지불하지 않은 지불금을 지불하는 등) 문제를 해결하는 방법에 대한 명확한 조언을받지 못합니다. 그것은 눈앞에서 판매 및 비즈니스 기회의 상실을 의미합니다.

- 사용자는 자신감을 잃었습니다 (신뢰 상실) : 통신하는 웹 사이트는 사용자가 시스템이 "신뢰할 수 없음"및 "비 전문적인"것으로 느끼게합니다. 그들은 정보가 안전한지 아닌지 확신하지 못할 것입니다. 대신 경쟁사 서비스를 사용하도록 선택한이 망설임

- 지원 팀에 대한 부담을 높이십시오 : 사용자가 문제를 해결할 수 없을 때는 "왜 신청할 수 없습니까?"

- 브랜드의 이미지를 깨뜨리십시오 : 나쁜 경험을 기억하고 사용할 때마다 사용자가 좌절감을 느끼면 다시 돌아올 수있는 기회는 거의 0입니다. 따라서 모든 것을 쉽게 접근 할 수 있도록하는 것이 중요합니다. 에서 더 많이 배울 수있는 웹에 쉽게 액세스 할 수 있도록 할 수 있습니다 (웹 접근성)

품질이 아닌 오류 메시지를 보내면 시스템에 떠 다니십시오. 고객을 하나씩 유지하는 함정과 다르지 않습니다.

[그림의 프롬프트 : 이미지 그래프는 전환율을 보여줍니다. 그래프의 다양한 지점에서 사용자의 눈살을 찌푸린 아이콘으로]

Formula (Not) 비밀리에 연인을위한 오류 메시지 작성 : 문제를 말해 + 솔루션 + 인간 언어 사용

좋은 소식은 잘못된 오류 메시지를 어렵지 않고 최고 조수로 변경하는 것입니다. 우리는 명확한 원칙을 가지고 있으며 즉시 사용할 수 있습니다. 3 개의 중요한 마음을 붙잡는 것 : "무슨 일이 있었는가? 분명하게 말한" , "다음에 무엇을해야합니까?""브랜드의 언어로 말하면" 세부 사항을 보자.

  • 명확하고 간단합니다 (모호하지 말고 명확하지 않음) : "잘못된 정보"라고 말하는 대신. "잘못된 비밀번호"또는 "이 이메일이 시스템에 있습니다"와 같이 "어떤 부분"이 잘못되었음을 지정하십시오.
  • 솔루션이 해결책이 아닙니다. 이것이 가장 중요한 부분입니다. 그것이 잘못되었다고 말하지 마십시오. 그러나 "비밀번호가 너무 짧아서" "비밀번호는 8 자 이상이어야한다"고 말하는 대신 솔루션을 알려야합니다.
  • 인간 언어 사용 (인간 언어 사용) : "SMTP Error 5.1.1"에서 "이메일로 변경되면 수신자가 존재하지 않습니다. 다시 확인하십시오."
  • 공손하고 공감하십시오 : 사용자가 좌절감을 느끼는 것을 기억하십시오. 부드러운 언어를 사용하고 누군가가 "죄송합니다! 비밀번호가 정확하지 않은 것 같습니다. 다시 시도하십시오."
  • 올바른 위치 (문맥 배치)에 넣으십시오 (문맥 배치) : 문제 지점 근처에 오류 메시지를 표시합니다. 예를 들어 잘못된 정보에 즉시 표시 (인라인 유효성 검사)를 표시하는 것과 같이 양식의 맨 위에 표시됩니다.

전 세계의 디자이너가 지침을 준수하는 좋은 정보의 출처입니다. Nielsen Norman Group의 오류 메시지 지침Material Design의 커뮤니케이션 원칙 으로 명확성과 사용자에게 도움이되는 커뮤니케이션 원칙.

[삽화를위한 프롬프트 : 좋은 오류 메시지 작성 공식 작성, 3 가지 명확한 부분의 디자인 : 1. 아이콘 아이콘 (문제를 알려주기) 2. (인간 언어/브랜드 사용)]

실제의 예 : "지불 할 수없는"변경 "거의 성공!"

더 명확하게하려면 결제 페이지에서 오류 메시지를 개선하려는 전자 상거래 응용 프로그램 사례 중 하나를 살펴 보겠습니다.

사례 : 사용자는 잘못된 신용 카드 번호를 작성합니다.

오래된 (이전) :

사용자가 카드 번호를 잘못 채우고 "지불 확인"버튼을 누르면 화면이 다시로드 된 다음 상단의 빨간색 텍스트가 "트랜잭션 실패. 잘못된 카드 세부 사항"입니다.

문제는 무엇입니까?

  • 사용자는 "유효하지 않은 카드 세부 사항"의 의미를 모릅니다. 카드 번호가 잘못 되었나요? 만료일? 아니면 CVC가 잘못 되었습니까?
  • 메시지는 충전 채널과는 거리가 멀다. 사용자가 어디에 눈을 쓸어 내게합니다
  • 언어는 공식적이고 차갑게 보입니다. 도움을주지 않았습니다

새로운 (후) :

팀은 경험을 향상 시켰습니다. 사용자가 카드 번호로 정보를 채우고 다른 채널로 누르면 시스템이 즉시 확인하고 잘못된 경우 해당 채널 아래에 메시지가 있습니다. " 죄송합니다! 신용 카드 번호는 올바르지 않습니다. 다시 확인하십시오."

결과는 무엇입니까?

  • 즉시 수정할 수 있습니다. 사용자는 문제가 "신용 카드 번호"에 있고 결제 버튼을 누르기 전에 수정할 수 있음을 즉시 알았습니다.
  • 혼란을 줄이기 : 빨간색 프레임과 인접한 텍스트를 사용하면 이해하기 쉽습니다. 무작위로 추측 할 필요가 없습니다.
  • 기분이 나아졌습니다 : "죄송합니다!"라는 단어를 사용하십시오. 그리고 끝 "" "텍스트를 친절하게 보이게하고"실수를 저지른 "느낌을 줄입니다.

이 작은 개선으로 인해 결제가 성공하지 못한 사용자의 수는 크게 감소했습니다. 또한 고객이 브랜드에 대해 기분을 좋게하는 긍정적 인 경험을 향상시키는 데 도움이 될뿐만 아니라 이러한 좋은 경험은 인상적인 마이크로 상호 작용의 중요한 구성 요소입니다.

[삽화를위한 프롬프트 : 왼쪽의 스마트 폰 인 Provereh의 이미지를 비교하고 오른쪽에 모호하고 무서운 오류 메시지를 보여줍니다 (친숙하고 수정을 명확하게 나타내는 후선 값 검증].

체크리스트를 사용할 준비가되었습니다! 유용한 오류 메시지를 부활시킵니다.

이제 웹 사이트 나 앱에서 오류 메시지를 탐색하기 위해 돌아가고 싶습니다. 자신에 대해, 맞습니까? 이 간단한 체크리스트를 "감사"및 "개선"에 대한 지침으로 사용해보십시오.

점검표 작성 오류 메시지 :

  1. [] 분명히, 무슨 일이 있었는지 : 본문은 문제를 직접 설명하고 일반 사용자가 즉시 이해 했습니까? (코드 또는 기술 어휘 방지)
  2. [] 수행 할 수있는 솔루션을 알려줍니다. 다음 단계, 사용자의 다음 단계는 직접 문제를 해결할 수 있습니까?
  3. [] 공손하고 브랜드의 분위기를 사용하십시오 : 친절한 언어는 사용자를 비난하지 않고 브랜드 성격에 따라?
  4. [] 조여서 메시지를 받으십시오 : 짜증나는 데 필요한만큼 짧지 않습니까?
  5. [] 올바른 위치에 표시 : 메시지가 오류 지점 근처에 배치되어 쉬운 수정이 있습니까?
  6. [] 적절한 설계가 있습니까? 색상이나 아이콘을 사용하여주의를 끌고 문제의 심각성을 전달합니까? (예 : 오류의 빨간색, 경고를위한 노란색)

이 점검표를 가져와 모든 흐름을 확인하십시오. 회원 신청, 로그인, 양식 작성 및 지불과 같은 중요한 사용. 투자는 오늘날 효과적입니다. 성가신 걸림 지점을 장기적으로 사용자와 좋은 관계를 구축 할 수있는 기회로 변경하는 데 도움이됩니다. 404 페이지는 우리가 설계하고 유용 할 수있는 것을 잊지 마십시오

[그림의 프롬프트 : 각 항목에 사람의 손을 똑딱 거리는 태블릿 화면의 큰 체크리스트 이미지는 제품을보고 영감을주는 그림입니다.]

사람들이 오류 메시지에 대한 UX 작성에 대해 사람들이 의심하는 경향이 있습니다 (FAQ).

나는 종종 이것에 대해 묻는 인기있는 질문을 편집했습니다. 명확한 답변으로 실제로 사용됩니다

질문 : 오류 메시지에 유머를 넣어야합니까?

답 : "상황"및 "브랜드 성격"에 따라 다릅니다. 중요하지 않은 형태로 약간의 잘못된 정보를 채우는 것과 같은 비 -서식 오류의 경우. 귀엽거나 재미있는 메시지를 사용하면 긴장을 줄이는 데 도움이 될 수 있지만 실패 지불 또는 중요한 정보 상실과 같은 심각한 오류와 높은 영향은 "재미있는 메시지를 사용하지 않습니다."재미있는 메시지를 사용하지 않습니다.

질문 : 디자이너, 개발자 또는 PM간에 오류 메시지를 작성하는 사람은 누구입니까?

답변 : 최고의 팀에서는 "UX Writer"의 의무가되어야합니다. 특히이 직책이 "공유 책임"이어야합니다. 디자이너는 컨텍스트와 경험을 결정할 것입니다 (예 : 팝업 또는 인라인 텍스트가되어야합니까?), 개발자는 가능한 모든 기술 조건을 알려줄 것입니다.

질문 : 쓰여진 오류 메시지가 "충분히 좋다"는 것을 어떻게 알 수 있습니까?

답변 : 가장 좋은 방법은 "실제 사용자와의 테스트"(유용성 테스트)입니다. 사용자가 오류를 일으키는 작업을 수행하고 쓸 수있는 메시지에서 문제를 이해하고 해결할 수 있음을 알리십시오. 감소 여부

[그림의 프롬프트 : 이미지 아이콘, 물음표 (?) 및 전구 (!)는 깨끗한 패턴으로 번갈아 가며. 질문에 대한 질문을 전달합니다.]

요약 : "걸림돌"을 "감동의 지점"으로 변경하십시오.

이 시점에서 오류 메시지는 단순한 "알림 메시지"가 아니라 시스템과 사용자 간의 중요한 "대화"라는 데 동의했을 것입니다. 혼란과 과민성의 순간을 바꿀 수있는 기회입니다. 사용자가 "오, 이해"를 느끼고 누군가가 옆에 도움이된다고 느끼는 시간이되기 위해

"문제를 나타내는 문제를 나타 냅 + 인간 언어를 사용하는 솔루션 +를 가리키는" 원칙에 따라 좋은 오류 메시지를 작성하면 웹의 속도를 줄이고 성공률을 높이는 데 도움이 될뿐만 아니라 창출에 중요한 투자이기도합니다. 장기적으로 브랜드에 대한 "신뢰"및 "충성도".

작은 메시지가 당신이 만들고자하는 모든 위대한 경험을 파괴하지 않도록하십시오. 이제 모든 오류 메시지를 검사, 부활 및 변경하여 오늘 사용자에게 좋은 보조원으로 돌아갈 시간입니다!

사용자의 경험 (UX)을 설계하고 아름답지만 텍스트 (UI)를 만드는 데 도움이 필요한 전문가가 필요한 경우. 그러나 여전히 효율적으로 의사 소통하고 사용자를 고객으로 변경하여 Vision X Brain Team과 상담 할 수 있습니다. 디지털 제품을 다음 단계로 업그레이드 할 준비가되었습니다.

[삽화를위한 프롬프트 : 사용자의 이미지는 모바일 애플리케이션을 사용하는 동안 만족스러운 미소에 만족합니다. 화면에 확인 마크가 나타나면 사용의 성공과 원활함을 전달합니다.]

공유하다

최근 블로그

웹 플로 vs 프레임 : 빠르게 성장하려는 스타트 업 웹 사이트를 만드는 데 적합한 플랫폼은 무엇입니까?

오프닝 속도, 미용 및 스케일 능력을 강조하는 스타트 업을 위해 충격, 웹 플로우 및 프레이머 사이의 충격을 비교하십시오.

웹의 "핵심 웹 생명체". 기업 : 속도가 신뢰성과 판매에 영향을 미치는 이유는 무엇입니까?

웹 속도는 기술적이지 않습니다! 핵심 웹 생명 (LCP, INP, CLS)은 SEO 순위, 사용자 경험 및 조직 웹의 이익에 영향을 미치는 것입니다.

웹 사이트 바닥 글을 "웹 끝에서"더 "디자인하는 방법"이지만 "리드 도구"입니다.

바닥 글을 내려다 보지 마십시오! UX를 개선하고 SEO를 보충하며 방문자를 리드로 바꾸는 데 도움이되는 웹 사이트 바닥 글 디자인 기술 모음.