Micro-Incations : 훌륭한 사용자 경험을 만드는 웹의 작은 세부 사항

웹에서 버튼을 클릭 한 적이 있습니까? 그것은 문제입니다!

이렇게 느낀 적이 있습니까? 버튼을 누를 것입니다. 웹 사이트에서 "확인 확인"가장 중요한. 그러나 한 번 눌렀습니다 ... 모든 것이 "완전히 조용합니다". 아무 일도 일어나지 않았습니다. 화면이 움직이지 않습니다. 알림 메시지는 마음이 어지러워지기 시작합니다. "어 ... 아직 눌렀어?" "돈이 복제 될까요?" 또는 양식을 작성할 때. 실수로 약간 잘못된 것은 아무것도 아무것도 없어서 다시 실현 된 채널이 다시 실현되면 정보가 완전히 사라졌습니다! 이러한 좌절감, 혼란 및 불확실성. 웹 사이트에서 사용자가 실제로 "죽은"또는 "생생하지 않은"느낌을주는 문제이며, 좋은 고객이 당신의 좋은 고객이 다시 돌아가서 조용히 떠나는 중요한 요소입니다.

‍

왜 대부분의 웹 사이트가 "군주"가 아닌 의사 소통을 할 수없는 이유는 무엇입니까?

이 문제는 대부분의 웹 사람들 (디자이너와 프로그래머 모두)이 "큰 이미지"에 집중하는 경향이 있기 때문에 발생합니다. 예를 들어, 웹 페이지 구조는 아름답고 주요 기능이 작동해야하며 브랜드의 색상이 정확해야합니다. 이 모든 것이 매우 중요하지만 도중에 "작은 세부 사항"을 간과하는 경향이 있으며, 데이터를로드 할 때 작은 애니메이션을 누르거나 작은 애니메이션을 가질 때 색상 변경 버튼은 필요하지 않은 "장식"이며해야 할 시간을 낭비한다고 생각합니다. 그러나 실제로 이러한 세부 사항은 단순한 아름다운 것이 아닙니다. 사용자에게 직접 사용하는 것은 웹 사이트의 "신체 언어"입니다. "조용한"웹 사이트는 응답으로 고개를 끄덕이거나 눈을 마주 치지 않는 사람들과 대화하는 것과 같습니다. 마지막으로, 우리는 그가 우리의 말을 듣고 있는지 알 수 없습니다. 그리고 그것이 많은 웹 사이트에 매력이 부족하고 모르는 어색한 경험을 만드는 이유입니다.

‍

"조용한"웹 사이트를 계속하자 = 고객이 매일 "탈출"하도록하십시오.

당신이 생각하는 것보다 더 심각한 "의사 소통 할 수없는"웹 사이트가 있습니다. 그것은 단지 아름다움의 문제가 아닙니다. 그러나 비즈니스에 직접 영향을 미칩니다.

• 신뢰성이 줄어 듭니다. HABB : 피드백이없는 웹 사이트는 고객이 안전하지 않고 안전하지 않게 만듭니다. 특히 금융 거래를해야 할 때는이 웹 사이트가 "홍보를 보지 않는다"고 생각하며 사기 웹 사이트 일 수 있습니다.
• 전환율 감소 : 사용자가 자신의 행동이 성공했는지 여부 (예 : 자동차에 추가를 압박하는 등)가 UX라고도하는 기회는 고객이 매우 높게 사라질 수있는 기회를 확신 할 수 없을 때, 고객이 거의 이미 쇼핑 중에도 웹 사이트를 떠날 것입니다.
• 사용자는 좌절하고 다시 돌아오고 싶지 않습니다. 나쁜 경험은 항상 마음에 묻힐 것입니다. 귀하의 웹 사이트를 사용하기가 어렵고 혼란 스러우면 다시 사용할 이유가 없습니다. 더 나은 경험을 제공하는 경쟁자가있을 때
• 손상된 브랜드 이미지 : 웹 사이트는 회사의 얼굴입니다. 작은 세부 사항에주의를 기울이지 않으면 브랜드도 그와 같을 수 있음을 반영합니다. 이것은 권위를 파괴하고 쉽게 축적 된 자신감을 누릅니다.

‍

해결책은 "미세한 국제"입니다. 웹 사이트를 채우는 비밀 무기.

"Micro-International"(Micro-Interction) 이라고합니다 . 가장 쉽게 말하면, 사용자가 웹 사이트에서 무언가를 할 때 발생하는 작은 세부 사항이나 반응은 사용자에게 "당신이하고있는 일을 이미 알고 있습니다." 그리고 "이것은 결과입니다." 스마트 대화 파트너로 "조용히"하는 웹 사이트였습니다.

Nielsen Norman Group 과 같은 전문가들의 수용된 원칙에 따르면 4 개의 주요 부분으로 구성된 소기업 적 우수의 구성은 다음과 같습니다.

• 1. 트리거 (자극기) : 버튼 클릭, 스크롤 바 스크롤 바, 화면을 새로 고침하여 새로 고침하는 등 상호 작용을 시작하는 사용자의 동작입니까?
• 2. 규칙 (규칙) : 트리거가 발생할 때 "Like '버튼을 누르는 것과 같이"다음에 일어날 일 "은 숫자가 1을 추가하고 아이콘이 파란색으로 변경 될 것이라고 결정한 것입니다.
• 3. 피드백 (응답) : 애니메이션 아이콘을 보는 것과 같이 규칙이 작동하는 규칙이 작동하고있는 사용자가 "참조", "듣는"또는 "느낌"에 애니메이션이 나오거나 "Ting"을 부드럽게 듣거나 약간 흔들리는 느낌입니다.
• 4. 루프프 및 모드 (조건 및 루프) : 대화식이 시간이 지남에 따라 변경되거나 '좋아요'버튼과 같이 반복적으로 사용되는 추가 규칙입니다. 또는 다시 누르는 경우와 다릅니다

가장 좋은 출발은 웹 사이트에서 Call-to-Action 버튼, 결제 프로세스와 같은 가장 중요한 점을 찾는 것입니다. 또는 다양한 형태로 "생명"또는이 작은 피드백을 추가하기 시작합니다. 디자인 뒤에있는 심리학을 이해하면 미세한 정보를보다 강력하게 만드는 데 도움이됩니다.

‍

진짜의 예 : 지루한 형태가 감동 할 수있는 도구가 될 때

큰 문제가 발생한 B2B 소프트웨어 회사의 예를 제시하고 싶습니다. 고객은 "인용문 요청"페이지를 페이지에 많이 오지만 그 양식을 거의 작성하지 않습니다. 팀은 검사를 받고 그들의 형태가 길고 지루하다는 것을 발견했습니다. 무엇을 작성 해야하는지 아무것도 말하지 않았습니다. 또는 어떤 채널이 잘못되었는지

해야 할 일 : 그들은이 양식을 점검하기로 결정했습니다. 미세한 정보

• 하기 전에 : 그것은 긴 형태입니다. 한 페이지의 10 개 이상의 채널이 낙담 한 것처럼 보입니다.
• 수행 후 : 그들은 멀티 스텝 형식으로 변경되었고 진행 막대 (피드백)를 사용하여 3 개의 짧은 단계로 나뉘어 사용자가 거의 완료되었음을 알 수 있습니다. 올바른 정보를 채울 때마다 작은 녹색 표시가 약간 진동하고 빨간색 가장자리가 없습니다. 그리고 메시지 (피드백)를 지우고 마지막 단계를 채우면 "데이터"버튼이 로켓으로 하늘로 변경됩니다. "최고! 팀은 24 시간 이내에 연락을 서둘러 할 것입니다."

결과 : 그냥 조정하십시오. 이러한 미시적 인 행동, 양식 완료율, 최대 60%의 증가 와 고객으로부터 "최고의 형태를 채우는 경험"이라는 칭찬을 받았습니다. UX/UI가 좋고 세부 사항에 관심이 있다는 분명한 예입니다 웹을 좋은 고객에게 어떻게 맡기려고하는 사람은 어떻게 할 수 있습니까?

‍

무엇을하고 싶습니까? 웹 사이트의 간단한 점검표.

여기에서 웹 사이트를 개선하기 시작하고 싶습니까? 이 간단한 점검표를 사용하여 즉시 시작하십시오.

1. 주요 상호 작용 지점 탐색 : 고객으로서 웹 사이트를 탐색하려면 걸어갑니다. 그런 다음 사용자가 카트에 추가 버튼, 로그인 버튼, 검색 상자, 양식 수립,로드 페이지와 같은 무언가를 "수행"해야하는 위치를 나열합니다.
2. "클릭"의미 : 다양한 버튼의 경우 호버 효과를 추가하십시오 (마우스를 포인트로 가져갈 때 색상 또는 작은 크기를 변경하십시오) 및 활성 상태 (눌러 색상을 변경하거나 조금 붕괴)하여 사용자에게 "이 버튼을 누를 수 있습니다"와 "누를 수 있습니다"와 "누르고 있습니다"라는 것을 알리십시오.
3. 양식을 작성할 때 피드백을 제공합니다. 저렴한 방법으로 채우는 과정에서 녹색 표시와 같은 실시간 데이터 검증 추가 및 잘못된 길을 작성할 때 조언으로 빨간색 프레임을 위로 올리면 사용자가 "보내기"를 누를 때까지 기다리지 않고 잘못되었다고 말합니다.
4. 지루한 로딩 페이지를 유용하게 변경하십시오. 흰색 화면이나 썩은 아이콘을 응시하는 사용자 대신 골격 화면 (로드 할 웹 페이지의 개요) 또는 브랜드와 관련된 애니메이션으로 변경하십시오. 기다리는 느낌을 줄입니다
5. 약간의 행복을 창조하십시오 (유쾌한 세부 사항) : 예를 들어 사용자가 뉴스를 받기 위해 신청할 때 귀여운 애니메이션이 있거나 바구니에 제품을 드래그 할 때 "Tung"소프트가 있습니다. 이러한 것들은 감정적 관계를 매우 잘 만들어내는 데 도움이됩니다. 투자자를위한 웹 사이트 와 같은 높은 신뢰성이 필요한 비즈니스에서

이 모든 것을 한 번에 할 필요는 없습니다. 1-2를 중요하게 선택하고 시작하십시오. 와 같은 도구 이러한 것들을 훨씬 쉽게 만들 수있는 상호 작용 도구가 있습니다

‍

사람들이 궁금해하는 질문 (그리고 명확한 답변)

Q1 : 애니메이션을 입력하거나 미세한 국제 웹 사이트가 느려질까요?
A : 아주 좋은 질문입니다! 대답은 "아니오, 올바르게 수행하면"입니다. Micro-Incations 대부분은 CSS 전환/애니메이션 또는 SVG 파일을 사용합니다.이 파일은 매우 가볍고 웹 속도에 전혀 영향을 미치지 않습니다. 피해야 할 것은 큰 GIF 파일 또는 불필요한 스크립트를 사용하는 것입니다. 웹 속도는 항상 심장입니다.

Q2 : 단지 아름다운 장난감일까요? 당신은 그것을해야합니까?
A : 아니요! 설명 된 바와 같이, 주요 기능은 혼란을 줄이고 자신감을 높이고 목표를 목표로 안내하는 "커뮤니케이션 및 피드백"이라고 설명하는 것은 단지 즐거움 일뿐입니다. 전환율과 고객 충성도에 직접적인 영향을 미치는 우수한 사용자 경험 (UX)을 만드는 것입니다

Q3 : 코드를 작성할 근거가 없다면 이런 일을 할 수 있습니까?
A : 물론! 현재 최신 웹 사이트 제작 플랫폼, 특히 웹 플로우에는 시각적 대화 형 및 애니메이션 도구가있어 클릭하여 코드, 심지어 한 줄까지는 코드를 작성하지 않고도 놀라운 결과를 만들 수 있습니다. UX/UI 디자인 전문가 이상의 결과를 원한다면 성공의 지름길입니다.

Q4 : 미세한 정보 추가를 시작해야합니다. 가장 먼저 가장 좋은 곳은 어디입니까?
A : 비즈니스의 "돈 제작 조치"또는 가장 중요한 지점으로 시작하십시오. CTA (Call-to-Action) 버튼 (예 : 적용, 주문, 연락처) 및 의 정보는 이러한 지점의 개선이 가능한 한 신속하게 비즈니스 결과에 영향을 미치기 때문입니다.

‍

요약 : 이제 웹 사이트에 "생명"을 추가 할 때입니다. 그런 다음 청중을 고객으로 변경하십시오

이 시점에서, 나는 당신이 미세한 행동이 할 수있는 "작은 세부 사항"일뿐 만 아니라 인상적이고 다른 사용자의 경험의 "핵심"이라고 생각합니다. 웹 기능과 사용자의 감정을 연결하는 다리입니다. 불편한 관계에서 부드럽고 신뢰할 수있는 대화로 변경됩니다.

투자는 이러한 세부 사항에주의를 기울이는 데 효과적입니다. 고객에게 "우리는 당신을 걱정합니다"라고 말하는 것입니다. "우리는 당신의 모든 단계에 관심이 있으며"이 느낌은 "방문자"에서 "고객"으로 바뀌고 마침내 브랜드의 "진정한 팬"이되었습니다.

귀하의 웹 사이트가 외로운 온라인 브로셔가되지 않도록하십시오. 지금 웹 사이트를 탐색하고 "생명"을 추가 할 수있는 "작은 지점"을 찾으십시오. 그것은 단 하나의 버튼 일지 모르고 당신은 확실히 훌륭한 결과에 놀랄 것입니다!

Vision X Brain이 웹 사이트에 "당신의 삶을 채우는"데 도움이되기를 원합니다. 아름답고 비즈니스 결과를 창출하는 미세한 정보는 맞습니까? 전문가에게 무료로 문의하십시오! 우리는 고객이 WOW가 필요할 때까지 놀라운 경험을 만들기 위해 귀하의 웹 사이트를 변경할 준비가되었습니다!

‍

‍