앱 디자인에서 하지 말아야 할 12가지 나쁜 UX/UI 실수

게시 됨: 2017-10-25

텍스트가 너무 작아서 읽을 수 없습니다.

흰색 배경에 작은 밝은 색 글꼴 콘텐츠입니다.

사용자는 사용자 인터페이스 어딘가에 꼭 맞는 중요한 기능을 볼 수 없습니다.

이는 앱의 UX/UI 디자인과 관련된 일반적인 문제 중 일부이며 이와 같은 실수를 많이 하면 많은 비용이 듭니다. 소프트웨어 프로젝트를 계획하는 동안 원활한 사용자 경험을 제공하는 직관적이고 빠른 인터페이스를 만드는 것이 목표이기 때문에 설계 단계에서 이러한 실수를 매우 일찍 식별하는 것이 필수적입니다.

다음은 앱에 파멸을 초래할 수 있는 몇 가지 치명적인 실수와 궁극적으로 이를 피할 수 있는 방법입니다.

1. 사용자의 기대에서 벗어나는 것

Deviating from User Expectations

흥미롭게도 사용자는 이러한 기본 GUI 위젯(라디오 버튼, 체크박스, 스크롤바, 명령 링크/버튼 등)을 사용할 때 약간의 기대를 갖고 있습니다. 이러한 버튼에 대한 혁신적인 변경을 시도하는 것은 좋은 반응을 얻지 못할 수 있습니다.

이 간단한 예를 생각해 보십시오. 당신은 평생 동안 BBC 뉴스를 들어왔습니다. 갑자기 가족 중 누군가가 대신 CNN을 듣기로 결정하고 "물에서 나온 물고기" 느낌을 받습니다. 이것은 GUI 위젯에서 많은 수정을 할 때 사용자가 느끼는 것과 정확히 같습니다.

대부분의 인기 있는 GUI 위젯은 몇 년 동안 완벽하고 실험적이며 사용자가 좋아하는 데는 이유가 있습니다. 그 편안함과 편안함을 하룻밤 사이에 바꾸는 것은 쉽지 않습니다. 사용자가 새로운 작업을 수행하려면 상당한 에너지와 지력을 발휘해야 하기 때문입니다. 그리고 그들은 그것에 대해 수용하지 않을 수 있습니다.

따라서 앱의 GUI 위젯 모양을 크게 변경하지 마십시오. 사용자는 앱을 통해 번거롭지 않은 탐색을 선호하므로 GUI의 원래 모양과 느낌을 유지하는 것이 좋습니다.

2. 사용자가 정말로 필요로 하는 것이 무엇인지 모른다

기업이 사용자의 실제 요구 사항을 깨닫지 못하고 그들의 요구 사항을 해결하지 못하는 것을 생각해낸다면 큰 실수를 하게 됩니다. 이러한 경우 매출을 늘릴 수 없고 앱이 실패합니다.

통합할 기능을 결정하기 전에 사용자 관심사를 조사하고 깊이 있는 통찰력을 얻는 것이 중요합니다. 이를 위해 철저한 사용자 및 시장 조사를 수행하십시오.

대상 사용자가 앱 디자인에서 기대하는 것(즉각적인 응답 시간, 컨트롤 간 부드러운 탐색, 쉬운 가독성 등), 즉 직관적인 사용자 경험을 이해하십시오.

또한 경쟁업체에 대한 비판적 분석을 수행하십시오. 경쟁업체 앱의 사용성 요인을 파악하십시오. 앱에 포함된 모든 기능, 사용자 인터페이스의 상호 작용 방식 등

그리고 처음 개발자는 주의해야 합니다. 앱에 너무 많은 기능을 과부하시키지 마십시오. 앱의 주요 목적은 사용자의 활동을 단순화하는 것입니다.

따라서 기능을 너무 많이 사용하지 않는 것이 좋습니다. 그러면 즉시 평범한 앱으로 변환되는 활동이 쇄도할 수 있습니다. 적은 수의 기능(물론 주요 기능)이 트릭을 수행합니다.

3. 터치 타겟 불량

Poor Touch Targets

사용자는 다양한 크기의 손가락을 갖추고 있습니다. 따라서 대상 세그먼트에 있는 모든 사람들의 손가락에 맞춰 터치를 구성해야 합니다. 성인 집게손가락의 평균 너비는 1.6~2cm입니다. 따라서 터치 기반 모바일 애플리케이션을 설계할 때 이를 염두에 두십시오.

사용자가 앱의 기능을 만지고 활성화하는 것이 어렵다면 앱 사용을 완전히 포기할 수 있으며 이는 정말 비극적인 일입니다. 그리고 이것은 당신이 가지고 있는 기능의 수에 다시 적용됩니다. 기능이 많을수록 앱의 탭 영역이 작아집니다. 반면에 몇 가지 주요 기능을 통합하면 탭 영역이 더 커집니다.

4. 스크롤 호러

잡지, 신문 편집자 및 광고주는 한때 '접힌 부분'이라는 끝없는 공포 속에 살았습니다. 모바일 애플리케이션이 대중화되면서 스크롤이 용이한 화면에 콘텐츠가 표시되기 때문에 "폴드 호러"가 조금 완화되었습니다.

그러나 이것은 주요 작업이 스크롤 없이 볼 수 있는 부분 아래로 내려가지 않거나 오히려 사람들이 쉽게 스크롤하여 찾을 수 있는 위치를 능가하지 않는 반응형 및 더 긴 웹 레이아웃을 만드는 것이 점점 더 중요해졌기 때문에 부분적으로만 사실이었습니다.

관련 버튼이 '스크롤 없이 볼 수 있는 부분'에 배치되거나 사용자가 스크롤할 필요가 없는 경우에만 전환이 증가합니다. 눈에 잘 띄는 위치에 명확한 클릭 유도문안을 배치하면 더 많은 전환이 발생할 수 있습니다.

5. GUI 제어 버튼의 모양을 모방한 버튼

Buttons that Mimic the Looks of GUI Control Buttons

GUI 컨트롤이 너무 많으면 끔찍한 실수가 될 수 있는 것처럼, 그 반대도 치명적일 수 있습니다. 밑줄이 그어진 텍스트와 헤드라인은 사용자를 새 페이지로 안내하는 링크라는 느낌을 줍니다.

클릭했지만 페이지에 연결되지 않으면 링크가 끊어진 것으로 가정하고 앱을 종료합니다. 사용자들은 이러한 우스갯소리로 인해 종종 혼란스러워 하고 때로는 짜증을 내며 다시는 돌아오지 않을 수도 있습니다.

라디오 버튼은 절대적으로 필요한 곳에 표시하되, 라디오 버튼이 없는 곳에서는 잘못된 인상을 주지 마십시오.

6. 일관되지 않은 GUI 제어

GUI 컨트롤은 일관성이 있어야 합니다. 클릭 유도문안 및 유사한 행동에 대해 특정 단어를 사용하는 경우 앱 전체에서 동일한 단어를 사용하십시오. 같은 행동에 다른 단어를 사용하면 혼동을 일으킬 수 있습니다.

때로는 개발자가 사용자에게 단순하다고 가정하는 작업이 정반대로 수행됩니다. 앱에서 특정 패턴을 따른다면 전체적으로 일관되게 따르십시오. 버튼과 페이지가 사용자가 기대하는 위치에 나타나는지 확인하십시오.

7. 순서도를 건너뛰고 설계로 이동

Skipping the Flowcharts and Getting Down to the Designing

개발자는 순서도를 건너뛰고 앱의 디자인 부분으로 바로 뛰어들어 시간을 절약하지 않습니다. 사용자를 염두에 두고 순서도를 작성하는 것이 매우 중요하며, 많은 개발자는 항상 최종 사용자를 염두에 두도록 사용자 페르소나로 이러한 차트를 만듭니다.

이것은 또한 사용자가 어디에서 왔는지, 관심사가 무엇인지, 어디에 있는지 파악하는 데 도움이 될 것입니다. 따라서 플로차트를 설계하는 동안 사용자 및 비즈니스 목표와 최종 달성 여부를 결정하는 것이 필수적입니다. 플로우 아웃라인을 생성함으로써 페이지 플로우에 대해 다양한 옵션을 검토하고 가장 적합한 옵션을 결정할 수 있습니다.

8. '인지된 어포던스'를 고려하지 않음

평신도 용어로 어포던스는 물체/환경의 속성에 따라 물리적으로 가능한 모든 동작을 의미합니다. 계단을 사용하면 오르거나 내릴 수 있고 병 뚜껑을 사용하면 나사를 조이거나 풀 수 있습니다.

마찬가지로 웹 페이지에서 슬라이더는 위아래로 이동하는 기능을 수행하고 확인란을 사용하여 선택 또는 선택 취소하고 하이퍼링크된 텍스트는 다른 페이지로 이동합니다. Affordance는 사용자가 쉽게 이해할 수 있는 작업을 수행할 수 있도록 합니다.

이러한 어포던스에 대한 인식은 웹페이지, 경험, 신념 및 목표에 대한 사용자의 지식을 기반으로 합니다. 사용자 인터페이스를 디자인하는 동안 디자이너가 정확한 단서를 제공하는 것이 중요합니다. 그렇지 않으면 혼란을 일으켜 나쁜 사용자 경험을 초래할 수 있습니다.

디자이너는 사용자가 이러한 UI 요소를 관찰하고 상호 작용하는 방법을 인식할 수 있는 올바른 시각적 기표를 사용해야 합니다. 또한 모든 사용자가 평등하게 생성되지는 않는다는 점을 기억하는 것이 중요합니다. 따라서 모든 어포던스는 모두가 동일한 방식으로 인식하거나 해석하지 않을 수 있습니다. 따라서 적절한 레이블과 지침으로 모든 시각적 단서를 뒷받침하십시오.

9. 적절한 종류의 대화 상자 부재

Absence of the Right Kind of Dialog Boxes

웹 앱의 대화 상자 사용성에서 사용자에게 시스템의 현재 상태와 명령이 어떻게 해석되었는지 알려야 합니다. 대화 상자는 현재 화면에서 벗어나지 않고 사용자에게 자신의 작업이 어떻게 나타나는지 알려주기 위한 것입니다.

침묵은 사용자를 계속 추측하게 할 수 있습니다. 따라서 웹 앱을 만드는 동안 대화 상자가 사용자의 정보를 가리지 않도록 해야 합니다. 그러나 연속 메시지는 방해가 될 수 있으므로 드물게 사용하십시오.

예를 들어, 사용자가 정보를 입력한 후 특정 페이지를 종료하기로 결정하면 대화 상자에 "초안을 삭제하시겠습니까?"라는 확인 상자가 나타날 수 있습니다. 취소 또는 폐기”.

그러나 구독 대화 상자(예: "이메일 주소를 입력하여 일간 뉴스레터를 구독하십시오")를 너무 많이 사용하면 짜증이 날 수 있습니다.

10. 오류 메시지로 흔히 저지르는 실수

사용자는 양식을 작성하기 위해 시간과 노력을 들이며, 양식에 오류가 있을 경우 무엇이 잘못되었는지, 어디서 잘못되었는지 알려야 합니다. 비밀번호 생성에 대한 구체적인 규칙이 있다면 미리 사용자에게 알려 동일한 작업을 두 번 하지 않아도 됩니다.

또는 적용할 프로모션 코드가 있는 경우 적용되는 프로모션의 종류와 이유를 미리 알려주십시오. 제시간에 알리지 않으면 사용자의 불안과 좌절이 커질 수 있습니다. 오류 메시지를 생성하는 동안 다음과 같은 실수를 하지 않도록 하십시오.

  1. 모호성 - 사용자가 저지른 실수에 대해 명확하지 않습니다.
  2. 사용자 탓하기 - 사용자가 실수를 해도 겸허해지는 것이 좋다. 실수를 부드럽게 지적하면 다시 시도하라는 메시지가 표시됩니다.
  3. 잘못된 오류 메시지 배치 – 글머리 기호 목록에 오류를 배치하지 않는 것이 좋습니다. 오류 바로 위에 오류 메시지를 배치하여 사용자가 즉시 무엇이 잘못되었는지 알 수 있도록 합니다.
  4. 오류를 방지하기 위해 마이크로카피를 사용하지 않음 – 공백 근처에 있는 작은 설명 텍스트는 실제로 사용자에게 무엇을 채워야 하는지 지시할 수 있으므로 처음에 얻을 수 있습니다.
11. 스마트 기본값의 부재

앱의 양식 작성 페이지에 추가 필드가 있으면 방해가 될 수 있습니다. 따라서 추가 필드가 절대적으로 필요한 경우 양식 입력 필드에 기본값을 입력해야 합니다. 사람들은 양식을 빠르게 스캔하여 양식을 채우는 데 걸리는 시간을 확인하고 양식에 이미 기본값이 있는 경우 계속해서 나머지를 채울 가능성이 높습니다.

현명한 기본값이 없으면 시간이 많이 걸리고 사용자에게 좌절감을 줄 수 있으며 이는 중대한 실수입니다. 또한 사용자 주의가 필요한 입력 필드에 기본값을 두지 않는 것이 좋습니다. 사용자가 무엇을 클릭할지 가정하지 마십시오. 잘 조사된 기본값이더라도 사용자는 다른 것을 원할 수 있습니다.

12. 클릭 유도문안 버튼의 강조 색상 무시

Ignoring Accent Colors for the Call-to-Action Buttons

"지금 구입", "무료 자습서 시작", "지금 등록" 등과 같은 버튼에 주의를 끌기 위해 좋은 강조 색상을 통합하는 것이 매우 중요합니다. 중요한 클릭 유도문안 버튼.

강조 색상은 주의를 끌 수 있을 만큼 밝아야 하지만 자극적이거나 산만하지 않아야 합니다. 강조 색상이 앱의 나머지 색상 테마와 조화를 이루는지 확인하십시오. 또한 클릭 유도문안의 특정 색상을 예약하고 페이지의 다른 곳에서 사용하지 마십시오.

결론

이것은 UI/UX 디자인에서 가장 흔히 발견되는 실수 중 일부입니다. 그리고 디자인을 변경할 때마다 철저히 테스트하여 얼마나 효과적인지 확인하십시오.

앱 디자인은 성공을 위한 차별화 요소이며, 매일 수천 개의 앱이 출시되지만 소수의 앱만이 승인을 받습니다. 잘못된 관행은 UX/UI 디자인에서 치명적인 실수로 이어질 수 있으며 많은 사람들의 모든 노력은 물거품이 됩니다.

마지막 알림:

앱을 디자인하는 동안 특정 플랫폼을 대상으로 하지 않는 한 여러 플랫폼에 맞게 디자인해야 합니다. 이것이 바로 MVP(Minimum Viable Product)를 매장으로 가져오는 방법입니다.