웹 디자인에서 마찰을 줄이는 방법

사용자 경험 측면에서 마찰은 사용자가 목표를 달성하는 데 방해가 되는 모든 것입니다. Friction은 전환을 줄이고 이탈률을 높이며 사용자가 작업을 포기하게 만들기 때문에 사용자와 디자이너 모두에게 중요한 문제를 나타냅니다. 즉, 좋은 웹 사이트와 정반대의 작업을 수행합니다.

사용자 경험의 마찰은 모든 사용자 상호 작용에 영향을 미치므로 가장 잘 설계된 인터페이스조차도 사용하기 어렵습니다. 반면에, 마찰이 없는 웹 사이트 경험은 매끄럽고 자연스럽게 풀리는 사용자 상호 작용을 만듭니다.

웹사이트의 마찰을 줄이면 복잡함 없이 더 나은 품질의 상호 작용이 가능합니다. 웹사이트를 정리하면 전환이 증가하고 사용자가 사이트에 더 오래 머물도록 장려하여 조치를 취할 가능성이 높아집니다. 방법은 다음과 같습니다.

웹사이트의 마찰 식별

마찰은 다양한 형태로 나타날 수 있습니다. 어떤 사람들은 마찰을 사용자가 사이트를 사용하기 위해 극복해야 하는 모든 것으로 정의합니다(예: 느린 로딩 시간 또는 열악한 탐색 포함). 다른 사람들은 마찰이라는 용어를 인터페이스에 대해 불필요하거나 과도한 것을 설명하기 위해 사용합니다. 또 다른 사람들은 마찰을 "인지 부하" 또는 사용자가 생각해야 하지만 생각해서는 안 되는 모든 것과 동일시합니다.

이것들은 모두 본질적으로 동일한 버전이지만 일반적으로 마찰의 증상을 다음과 같이 식별할 수 있습니다.

• 산만한 영상
• 시각적으로 어수선한 인터페이스
• 불일치
• 불필요한 행동과 결정
• 혼란스럽거나 직관적이지 않은 기능

어떤 경우에는 마찰이 실제로 좋은 것일 수 있다는 것을 이해하는 것도 중요합니다. 이것은 마찰 설계 구성 요소가 어떤 목적으로 사용자를 느리게 할 때 적용됩니다. 예를 들어 복잡한 요소를 통합하여 데이터를 캡처하거나 심각한 결과(예: 사용자가 받은 편지함 또는 계정을 영구적으로 삭제)로 인한 실수를 방지할 수 있습니다.

다른 경우에는 마찰이 교육적 목적으로 사용될 수 있습니다. 게임이 좋은 예입니다. 게임에서 우리는 학습을 주입하기 위해 마찰을 사용합니다. 마찰과 함께 우리는 여전히 즐기면서 초보자에서 전문가로 이동합니다. 그것은 자전거 타기의 가상 버전입니다. 시행착오를 통해 우리는 새로운 것을 배웁니다. 마찰이 없는 게임은 아무도 원하지 않습니다. 재미가 없기 때문입니다.

그러나 대부분의 웹 사이트에서는 가능한 한 원활한 경험을 원할 것입니다. 다음과 같은 검증된 전략을 사용하여 무중력 사용자 경험을 만드십시오.

1. 거시적 접근으로 시작

마찰 없는 사용자 경험을 만들려면 전체 사용자 여정을 염두에 두고 시작하세요. 이것은 마찰이 개발 프로세스에 도움이 될 수 있는 부분과 사용자에게 번거로운 시기를 결정하는 데 도움이 됩니다.

사용자 여정의 각 단계는 전체 제품의 성공에 영향을 줄 수 있는 기회를 제공합니다. 데이터를 수집하거나 실수를 방지하기 위해 마찰이 필요한 시점을 결정하고 응답률에 부정적인 영향을 미칠 수 있는 다른 모든 장애물을 제거합니다.

2. 조치를 취하는 데 필요한 단계 최소화

사용자 프로세스의 일부 단계를 생략하여 마찰을 줄일 수 있는 좋은 기회가 있습니다. 유명한 예는 iCal 기능을 사용하는 복잡한 프로세스입니다.

• 월별 보기에서 날짜를 두 번 클릭합니다.
• 이벤트 이름을 입력합니다.
• 과거 위치를 건너뜁니다.
• "하루 종일" 확인란을 건너뜁니다.
• 지난 달을 건너뜁니다.
• 지난 날을 건너뜁니다.
• 지난 해를 건너뜁니다.
• 이벤트 시간을 입력합니다.
• 이벤트 시작 분을 입력합니다.
• 오전 또는 오후를 입력합니다.

보는 것이 스트레스라고 생각한다면 혼자가 아닙니다. 이제 Backpack의 캘린더 기능에 있는 사용자 여정과 대조됩니다.

1. 월별 보기에서 이벤트 날짜를 두 번 클릭합니다.
2. 이벤트 이름과 시작 시간을 입력합니다.

이 두 앱을 함께 비교하면 마찰이 적은 앱을 쉽게 알 수 있습니다. 경우에 따라 여러 단계가 필요한 프로세스가 있을 수 있습니다. 이 경우 각 단계가 가능한 한 수월한지 확인하십시오. 입력을 요구하는 대신 체크박스를 사용하거나 가능하면 단계를 통합하여 이를 수행할 수 있습니다.

3. "적을수록 좋다"

인터페이스의 궁극적인 목표는 가능한 한 간단하게 만드는 것입니다. 이것은 웹 디자인의 모범 사례의 기초를 형성합니다. 불필요한 것을 제거함으로써 우리는 본질적인 것을 전달할 수 있습니다.

사용자의 기대를 충족시키는 요소의 우선 순위를 정하고 꼭 필요하지 않은 요소는 제거하십시오. 이에 대한 대표적인 예가 Google의 홈페이지입니다. 당신이 할 수 있는 일은 오직 한 가지뿐이고 그 주변에는 많은 공백이 있습니다.

기능에 너무 과부하가 걸리지 마십시오. 작업을 복잡하게 만들고 사용자에게 해를 끼칠 위험이 있습니다(결국 제품에 좋지 않음).

4. 좋은 탐색 방법 사용

무중력 경험의 적 중 하나는 잘못된 탐색입니다.

불행히도 탐색을 설계할 때 많은 것이 잘못될 수 있으므로 마찰의 일반적인 원인이기도 합니다. 명확한 탐색을 위한 "모든 경우에 적용되는" 접근 방식은 없지만 사이트에 적합한 것이 무엇인지 배울 수 있는 소스는 있습니다. 바로 사용자입니다.

사용자 테스트는 사람들이 사이트 또는 앱의 콘텐츠에 액세스하고 분류하는 방법을 이해하는 데 도움이 됩니다. 이 정보를 사용하여 탐색 방법을 안내하고 조정하여 사용자의 요구 사항을 충족하도록 합니다.

5. 청킹은 당신의 친구입니다

심리학을 공부하는 학생이라면 누구나 조지 A. 밀러가 평균적인 인간의 마음은 작업기억에 7개, 플러스 또는 마이너스 2를 저장할 수 있다고 가정했음을 기억할 것입니다.

이것이 청크의 실행이 시작되는 곳입니다. 인지 과부하를 방지합니다. 정보를 덩어리로 구성하면 인간 두뇌의 한계를 극복하고 기억력이 향상됩니다.

복잡한 작업을 더 작고 단순한 작업으로 나누어 이 개념을 웹 디자인에 적용할 수 있습니다. 이 기술을 입력 양식 및 기타 번거로운 작업에 적용하여 이탈률을 줄이고 사용자 주의를 향상시키십시오.

6. 바퀴를 재발명하지 마십시오

웹사이트에 새로운 일이나 혁신적인 일을 하고 싶은 마음이 들 수 있습니다. 창의적인 사람으로서 웹 디자이너가 독특한 것을 만드는 것은 자연스러운 일입니다. 그러나 사용자는 이전 경험에서 얻은 지식을 사용할 수 있기 때문에 친숙한 UI 요소와 상호 작용하는 것을 선호합니다.

새로운 것이 어떻게 작동하는지 사용자에게 강제할 때마다 우리는 사용자에게 더 많은 마찰을 일으키게 됩니다. 예측 가능한 UI 패턴은 사용자가 시스템을 이해하고 작업을 완료하는 데 도움이 됩니다. 미리 설정된 UI 및 UX 표준을 최대한 사용합니다. 예를 들어, 검색용 돋보기 아이콘은 사용자가 쉽게 알아볼 수 있으며 추가로 생각할 필요가 없습니다.

7. 브랜드에 충실하십시오

마지막으로 1분 동안 사용자의 입장이 되어 보십시오. 방문자가 귀하의 사이트를 방문한 후 4-6초 이내에 귀하의 정보를 알 수 있습니까? 그렇지 않으면 처음부터 마찰이 발생합니다.

랜딩 페이지 또는 앱 홈페이지는 솔루션을 쉽게 다루거나 사용자의 문제를 해결하거나 사용자가 목표를 달성할 수 있도록 도와야 합니다. 이 개념은 레이아웃, 타이포그래피, 그래픽 등에 적용됩니다.

결론

웹사이트나 애플리케이션은 가능한 한 마찰이 없어야 합니다. 불필요한 단계와 어수선한 디자인 요소를 제거하여 사용자가 목표를 더 빨리 달성하고 웹사이트 이탈률을 줄이는 데 도움을 줄 수 있습니다.

웹사이트의 마찰은 실용적인 것부터 미적인 것까지 다양합니다. 예를 들어, 느린 로드 시간이나 하위 수준 탐색으로 인해 사용자가 사이트를 포기할 수 있는 반면 공백이 없거나 잘못된 글꼴이라도 인지 부하를 증가시킬 수 있습니다. 이것이 제품을 디자인할 때 전체 사용자 여정을 고려하는 것이 중요한 이유입니다.

위에 설명된 단계를 따르면 웹사이트의 마찰을 식별하고 이를 줄이기 위한 조치를 취할 수 있습니다. 그렇게 하면 전환이 증가하고 사용자 문제를 보다 성공적으로 해결할 수 있습니다.