[번역] 프로덕트 클릭율 높이기: Information Scent

[번역] 프로덕트 클릭율 높이기: Information Scent

2021. 1. 12. 21:16ㆍUX 아티클 ✏️/③ UX 디자인 방법론

Information Scent: 사용자는 다음 클릭할 곳을 어떻게 결정할까?

원문: https://www.nngroup.com/articles/information-scent/

Information Scent: How Users Decide Where to Go Next

When deciding which links to click on the web, users choose those with the highest information scent — which is a mix of cues that they get from the link label, the context in which the link is shown, and their prior experiences.

www.nngroup.com

웹은 많은 하이퍼링크로 구성되어 있습니다.

다수의 링크에 노출됐을 때, "사용자가 어떻게 어떤 링크를 클릭하는지를 결정하고 어떤 것을 무시하는지" 아마 당신은 궁금할 것입니다. 그 해답은 <information scent>입니다. 음식 냄새가 동물들에게 그들의 식사임을 안내하는 것처럼 information scent는 사용자가 원하는 콘텐츠를 포함한 것 같은(예상) 페이지로 안내합니다.

Tra's Think💡
Information Scent를 다음과 같이 이해하고 읽으면 좋아요!
How promising a potential source of information appears to the user (필요한 정보가 포함된 것처럼 보이게 하는 요소, 단서)

information scent는 정보수집 이론의 핵심 컨셉입니다. — 이 이론은 '어떻게 사람들이 웹을 탐색하는지', '질문이나 필요한 정보를 만족시키기 위해 어떻게 그들이 잠재적인 정보와 상호작용하는지'를 이해하기 위해 필수적인 이론입니다. 간단히 말해서, 만약 사람들이 알고 싶은 정보가 있을 때, 추측을 기반으로 이동할 웹 페이지를 결심할 것입니다.

추측 (1) 그들의 질문에 그 페이지가 올바른 답변을 제공할 가능성
추측 (2) 그 대답을 발견하기까지의 시간

만약 방문했다면, 그 페이지가 어떻게 보일지에 대한 추측이 바로 information scent입니다.

정의: 필요한 정보의 information scent는 가치에 대한 불완전한 추측을 나타냅니다. 이 가치는 사용자에게 보이는 정보의 표현방식에 따라 부여됩니다.

Information scent는 상대적 개념입니다. — 같은 정보더라도 필요한 정보에 따라 각기 다른 Information scent를 지닙니다. 예를 들어, 음식이라는 타이틀의 링크는 만약 치즈를 찾고 있다면 높은 Information scent를 지닙니다. 하지만 만약 클렌징 폼을 찾고 있다면 낮은 Information scent를 지닐 것입니다.

당신은 정보가 무엇을 의미하는지 그리고 어떻게 나타날지 아마 궁금할 거예요. 웹페이지의 정보는 보통 링크로 표현됩니다. 링크 라벨, 링크 주변 콘텐츠, 그것이 등장하는 맥락과 (다른 사람의 추천을 포함해) 사용자가 가진 모든 배경지식은 사용자가 링크를 누를지 말지 결정할 때, 그 페이지를 방문할지 무시할지의 가능성인 Information scent에 영향을 줍니다.

출처: https://medium.com/astrolabs/understanding-information-scent-95a6554007d4

음식 수집으로 유추해보면, 정보는 음식입니다 — 우리는 이것을 사바나라 부릅시다. 그리고 사바나로 대표되는 것은 동물이 실제로 보거나 느끼는 것일 겁니다. — 예를 들어 영양의 시각이나 후각처럼 말이죠. 포식자는 사냥하기 전 이전의 나쁜 경험 (사냥하기 힘들었다던지, 다른 포식자와 먹잇감을 위해 싸웠던 기억) 같은 다른 요인을 고려할 것입니다. 그리고 만약 사냥이 진행될지라도, 매력적인 단서에도 불구하고 성공하지 못할 수도 있습니다.

자, 여기 네 가지 개념이 있습니다

1. 실제 소스 (웹 페이지나 사바나)
2. 그것의 표현방식 (웹페이지로 갈 수 있는 링크나 먹이의 시각적, 후각적 측면)
3. 실제 가치 (소비 전까지 알 수 없는 가치, 페이지를 읽거나 음식을 먹는 소비 후까지 알려지지 않은 가치)
4. 추정 가치 (소비 전 평가, 클릭 혹은 사냥을 진행할지 말지를 결심할 때 사용되는 가치)

information scent는 아래 (1), (2)로부터의 추정가치입니다:

1) 사용자가 보는 것 (포식자가 냄새를 맡는 것으로 유추)
멀리서도 인식되는 소스의 모습(표현) (검색, 결과 페이지); 그 모습(표현)은 링크 텍스트뿐만 아니라 그것을 둘러싼 즉각적이고 더 일반적인 맥락을 포함한다.

2) 사용자가 정보에 대해 아는 것
사용자가 검색 도메인, 브랜드, 그 자료의 작가에 대한 지식

지금부터 information scent를 구성하는 각각의 요소들을 탐구해봅시다!

Information scent의 구성

우리는 이미 이전에 information scent를 구성하는 두 가지 큰 요소를 살펴봤습니다. 사용자가 보는 것과 사용자가 이미 알고 있는 것. 첫 번째 요소는 대체로 디자이너에 의해 컨트롤이 가능합니다 : 우리는 보통 어떻게 페이지가 다른 페이지에서 표현될지 결심(결정)할 수 있습니다. (만약 다른 페이지가 검색엔진 결과 페이지라면 더 적은 범위일 것입니다.) 두 번째 요소는 디자이너가 과거에 브랜드나 정보 소스를 위해 구축한 인지 가치를 통해서만 간접적으로 컨트롤할 수 있습니다.

사용자가 보는 것

① 링크 라벨

아마도 information scent에서 가장 중요한 요소인, 링크 라벨은 어떤 페이지인지에 대한 정확하고 간단명료한 설명으로 되어 있을 것입니다. 만약 설명이 사용자의 목표와 관련성 있게 느껴진다면, 그 링크는 사용자와 테스크에 대해 높은 수준의 information scent를 지녔을 것이며 클릭할 확률 또한 높아집니다.

이것은 우리가 "링크 라벨은 자명적이고 명료했야 한다."라고 반복적으로 주장하는 메인 이유입니다. 만약 그 링크의 이름이 너무 모호하고 애매하다면, 사람들은 좋은 정보를 놓칠지도 모릅니다. 심지어 링크 라벨이 정확하고 그 웹페이지의 핵심을 잘 설명했더라도, 만약 단어가 타깃 사용자가 이해하기 힘든 용어라면, 낮은 information scent를 가질 것입니다. 전문용어, 브랜드만의 용어, 너무 단순히 철학적인 단어는 결국엔 무시되고 당신의 모든 사용자들이 이해할만한 충분한 신호를 제공하지 못할 것입니다.

(예시 1)

Cisco.com:
상단 헤드라인은 해당 브랜드의 기술에 친숙하지 않은 사람들은 이해하지 못할 많은 브랜드 용어를 사용하고 있습니다. NGFW는 Next Generation Firewall (차세대 방화벽)을, AnyConnect는 VPN 서비스를, Duo는 통합 멀티 인증서비스를 의미합니다.

Note. 🧐

UX에서 우리는 "더보기나 더 알아보기 등과 같은 라벨은 낮은 informaion scent를 가진다'는 구문을 종종 사용합니다. 간단히 말해, 당신이 필요한 정보가 뭐든지 간에 어떤 링크로 이어질지를 추측하는 것은 어렵기 때문입니다. 우리는 또한 가끔 그것이 정확하고 포괄적으로 그것의 결과를 묘사할 때, "이 라벨(News와 같이)은 높은 information scent를 지녔다"라고 말합니다. 기술적으로, 두 번째는 옳지 않습니다. — 라벨은 오직 높은 뉴스를 찾는 사용자에게만 높은 information scent를 갖고 다른 것을 찾는 사람들에게는 낮은 information scent를 지닐 것입니다. 그러나, 다른 정보가 필요한 사람들에게 올바른 라벨은 유용하고 가치 있습니다. 왜냐하면 그들이 필요한 것이 아닌 것을 찾기 위해 페이지를 클릭하며 얻은 실망과 노력을 줄여주기 때문입니다.

② 링크 주변 콘텐츠

종종 링크 다음에는 사용자에게 추가적인 정보를 보여주는 짧은 텍스트 정보나 썸네일 이미지가 있습니다. 비록 사용자가 링크에 수반된 모든 텍스트를 읽지 않을지라도, 그들은 여전히 살펴보고 추가적인 신호를 얻습니다. 이러한 신호는 링크의 information scent를 증폭시킵니다. 이 사실에는 두 가지 큰 의미가 있습니다.

1. 기사나 페이지를 위한 요약 텍스트는 정보의 요점을 전달하고 링크의 디테일을 추가할 것입니다.

하찮은 요약은 사이트의 낭비된 기회와 낭비된 사용자의 시간입니다. 그 사이트는 사용자에게 관련 있는 아티클인지 말할 기회를 놓칩니다. 당신이 위 Cisco의 예시를 봤다시피, 헤드라인의 요약은 모호한 타이틀 용어에 어떠한 영향도 주지 않습니다.

2. 링크 관련 이미지는 페이지의 콘텐츠와 나타내는 카테고리를 위한 묘사이자 표현입니다.

너무 종종 사이트들은 페이지의 콘텐츠와 느슨하게 관련된 일반적인 이미지를 선택합니다.

(예시 2)

Sutterhealth.org:
Find Walk-in Care와 Find Urgent Care와 관련된 이미지들은 일반적이고, 순전히 장식적이고, 라벨에 추가적인 신호를 주지 않습니다. 그러나, 링크 아래 summary text는 walk-in care와 urgent care의 차이점을 설명합니다. (그리고 파란색으로 키워드를 보여줍니다.)

하지만, 연관된 이미지를 선택하는 것은 항상 좋지만은 않습니다. — 특히 만약 그 이미지가 대상의 카테고리를 나타낸다면 더욱 그렇죠. 카테고리화에 대한 학술문헌에 따르면, 해당 범주의 모든 구성요소가 동등한 것을 나타내지 않음을 보여줍니다. 예를 들어 사람들은 닭 이미지를 새로 해석하는 것이 울새를 해석하는 것보다 더 오랜 시간이 듭니다. 왜냐하면 닭은 울새보다 새 카테고리에서의 대표성이 낮기 때문이죠. 그렇기에, 당신은 카테고리의 이미지를 고를 때 미적이고 편리한 것을 당신의 기준으로 두지 마세요! 무엇을 나타내는지 명확하게 알 수 있는 대상을 고민해보세요.

(예시 3)

Costco.com:
Coffee & Sweeteners 카테고리를 나타내는 이미지는 사람들이 일반적으로 커피를 생각할 때 떠오르는 이미지는 아닙니다. 그러므로 커피 카테고리를 찾는 사용자에게 있어 그 이미지는 낮은 information scent를 줍니다. (만약 그 사용자가 이미지에 나타난 정확한 그 제품을 찾는 것이 아니라면..)

③ 링크가 나타나는 맥락

페이지에 있는 무엇이든 '링크를 어떻게 받아들일지'에 영향을 줄 것입니다. 예를 들어, '크리스마스'라는 단어는 HarryandDavid.com(미국의 프리미엄 식품 및 선물 생산 업체)와 Williams-Sonoma.com(주방 용품 및 가정용 가구를 판매) 같은 두 개의 다른 사이트에서는 (같은 정보가 필요할지라도) 각기 다른 information scent를 지니고 있습니다. 비록 전에 이 사이트들에 대해 들어보지 못했더라도, 만약 당신이 크리스마스 테이블 세팅을 찾고 있다면, Williams Sonoma’s 사이트는 정확한 정보를 제공해줄 것입니다. 왜냐하면, 연관된 다른 콘텐츠 또한 페이지 내에서 함께 볼 수 있기 때문입니다. 하지만 HarryandDavid 사이트에서는 같은 이유로 낮은 information scent를 지니고 있죠.

(예시 4)

HarryandDavid.com (왼) / Williams-Sonoma.com (오)

만약 당신이 크리스마스 테이블 세팅을 찾고 있다면, 크리스마스라는 이름이 달린 링크가 다른 사이트와 다른 information scent를 가질 것입니다. Harry& David’s 사이트에서 Bakery, Gift Baskets & Towers, or Pears & Fruit 같은 이름의 카테고리뿐만 아니라 페이지의 다른 이미지들이 크리스마스 정보처럼 보이지 않게 합니다. 하지만, Williams Sonoma’s 사이트에서 그릇이나 차 주전자 이미지는 링크의 information scent를 향상시킵니다.

비록 맥락은 강한 신호이지만, 디자이너는 종종 맥락에 너무 의존하는 실수를 합니다. 특히 작은 화면에서, 맥락은 항상 전반적으로 보이지 않거나 무시됩니다. (아마 사람들은 관련된 것을 찾기 위해 빠르게 스크롤하기 때문일 것입니다.) 그래서 추가적인 신호를 제공하는 맥락에 의존하는 것보다 가능한 구체적인 링크 이름인 것이 더 좋습니다.

Tra's Think💡
이 글에서 '맥락에 너무 의존하는 실수'는 웹과 모바일에서 통일된 카테고리 명을 쓰는 것을 의미합니다. 지나치게 통일된 맥락(경험)을 제공하고자 할 때 디자이너는 모바일 환경을 고려하지 않은 채 낮은 information scent를 전달하곤 하죠. 필자는 이와 관련된 사례를 아래 (예시 5)를 통해 보여줍니다.

👇👇👇

(예시 5)

Williams-Sonoma.com (왼) / HarryandDavid.com (오)

모바일에서, Williams Sonoma’s 사이트(왼)에서 단어 '크리스마스'가 무엇에 관한 것인지 이해하기란 힘듭니다. 왜냐하면 더 적은 맥락만이 보이기 때문입니다. 사용자들은 그들이 전에 봤던 것을 기억하거나 회사에 대해 알고 있는 정보를 모두 사용해야 합니다.

Harry & David (오)는 모바일에서 링크의 이름을 특별함을 높이기 위해 '크리스마스 선물'로 변경했습니다.

또 다른 종종 발생하는 디자이너의 실수는 충분한 맥락을 제공하지 않는 것입니다. 우리는 종종 매우 작은 글자와 큰 이미지가 첫 화면을 가득 매운 랜딩페이지를 봅니다. 심지어 이런 페이지가 사용자를 위한 옳은 정보를 포함할 때에도 많은 상황 속에서 (사람들에게 옳은 방향인지 아닌지 말하기 위해) 그들은 충분한 맥락을 제공하지 않습니다. 그 결과, 사용자들은 맞는 정보를 찾기 위해 더 이상 스크롤하려 하지 않습니다. 또는 보이는 링크조차도 누르지 않습니다. 그들은 빠르게 그 페이지는 더 이상 탐구하기에 가치 없다고 판단하며 떠나버립니다. 그러므로 사이트로 가기 위해(예를 들어 검색 결과 페이지) 링크가 제공하는 좋은 information scent는 실제 페이지의 잘못된 맥락에 의해 낭비되어집니다.

Tra's Think💡
서비스의 첫 랜딩 화면은 굉장히 중요합니다. 인상을 결정짓는 요소이기 때문에 서비스에 대한 충분한 맥락을 제공해야 합니다.
관련 글이 궁금하다면? >>> 2021/01/04 - [디자인 아티클✏️/① 디자인 아티클] - 첫 화면으로 사로잡아라

(예시 6)

PosturePillow:
랜딩페이지의 첫 번째 화면은 큰 침대 이미지입니다. 이 회사 이름과 뭔가 애매한 이미지가 이 사이트에서 판매하는 상품의 유일한 단서입니다.

검색엔진을 통해 우연히(사전 지식 없이) 방문한 고객에게 이러한 맥락은 링크 중 하나를 누르거나 페이지를 스크롤하는 것을 충분히 방해할 뿐입니다.

페이지 내에서 아이템의 위치 또한 맥락입니다. 종종 오른쪽 레일에서 나타나는 정보는 비록 그 링크의 설명이 충분하더라도 광고로 잘못 해석될 수 있습니다. — 간단히 말해 페이지의 오른쪽에 광고를 집행하는 것을 사람들이 잘 알고 있기 때문에 그래서 어떤 정보든지 사용자와 관련 없는 정보로 여깁니다.

사용자가 이미 알고 있는 것

④ 사용자의 지식: 사용자의 이전 경험

information scent의 또 다른 요소는 과거에 사용자가 모은 직접 지식(회사, 같은 유형의 콘텐츠와의 이전의 경험 또는 단순히 웹 사용 경험) 혹은 친구나 낯선 이로부터의 추천이나 말을 통한 간접 지식입니다.

📌사용자의 이전 지식에 대한 몇몇 요소 :

1) 익숙한 브랜드와 신뢰
만약 당신이 Williams Sonoma에 대해 이미 알고 있고 전에 브랜드를 경험해봤다면, 페이지의 맥락이 부족하더라도 웹사이트에 나와있는 'Christmas'가 무엇을 의미하는지 이해할 수 있습니다. 또는 만약 당신이 Cisco와의 좋은 경험이 있다면, 아마 링크의 이름이 설명적이지 않더라도 상품 중 하나를 클릭할 것입니다.

2) 경험한 웹 도메인
만약 학부생으로 대학에 지원한 적이 있다면, CDS(입학과 관련된 기본 자료: 매해 신입생 입학 등급-시험 점수 등급, GPAs, 다른 입학 조건 등..)는 대학교 사이트의 재무정보를 제공하는 섹션에 있다는 것을 압니다. 그래서, 이런 사람에게 있어서 'Office of Vice Chancellor of Finance (재무 부총장실)'와 같은 링크 라벨은 높은 information scent를 지니고 있지만, CDS에 대해 처음 들은 또 다른 누군가는 이 링크를 해석할 수 없습니다. (하지만 어떠한 것도 CDS라는 단어를 대체할 수 없습니다. 그러므로 초보 사용자는 정보를 찾기 위해 노력하면서 불만족스러운 두 가지 레벨의 information scent를 극복해야 합니다.)

(예시 7)

UC버클리(왼)와 캘리포니아 공대 사이트(오)에서 보이다시피 입학기준에 대한 정보뿐만 아니라 신입생 입학에 대한 통계를 포함한 CDS는 대학 웹사이트의 재무 파트에서 제공됩니다. 하지만 이런 종류의 배경 지식은 이전에 대학에 지원해 보지 않은 사람이라면 알 방법이 없죠.

⑤ Social Foraging: 입소문 및 다른 이들의 추천

Tra's Think💡
Social Foraging를 직역하면 '사회로부터 정보를 모으는 행위'라고 할 수 있습니다. 흔히 SNS를 통해 맛집 정보를 얻거나, 지식인, 위키피디아를 통해 궁금한 정보를 찾는 행위, 친구로부터 요즘 유행하는 제품을 추천받는 것 등이 이에 포함됩니다.

Social Foraging 이론은 정보 수집을 위해 사람들의 관계가 어떻게 형성되는지에 대해 설명하는 정보 수집 이론의 확장입니다. 이러한 관계는 형성(같은 문제를 연구하는 과학자 커뮤니티)되거나 필요에 따라 (위키피디아 기고자, 아마존 리뷰어, 협업 태그 시스템의 태거) 관계가 맺어집니다. 이 이론에 따르면, 사람들이 정보를 찾거나 상호작용할 때 다양한 정보의 퀄리티에 대해 흔적을 남긴다고 합니다. 그리고 이러한 흔적들은 다른 사용자들을 위한 information scent를 증가시킵니다.

그럼, 이제 아마존에서 헤어 매직기를 찾아봅시다!

당신은 상품을 선택해서 리뷰를 읽습니다. 한 리뷰는 "이 매직기는 좋은데, 다른 것만큼 좋진 않아요."라고 말합니다. 이후 검색 페이지로 다시 돌아오면, 두 번째 상품에 대한 정보는 조금 다르게 보입니다. 첫 번째 헤어 매직기의 리뷰가 추가적인 information scent를 제공했기 때문에 클릭하는 것과 그 상품을 구매하는 것을 고려함에 있어 편견을 갖게 합니다. (아래 예시 8 이미지 참고)

(예시 8)

다른 매직기가 더 좋다고 말한 리뷰를 현재 보고 있습니다. 이 리뷰는 사용자에게 정보를 추가해 상품 리스트에서 더 추천하는 매직기를 선택하게 합니다.

Click Bait (클릭 미끼)가 장기적으로 작동하지 않는 이유

지금까지 당신은 information scent의 요소들을 이해했습니다. 아마 당신은 사용자가 필요한 정보가 아니더라도 당신의 사이트로 유입시키고 싶을 거예요.

예를 들어 당신이 지루한 아티클을 위해 '주제와 상관없는' 흥미로운 제목을 떠올리고 싶을 수도 있습니다. 하지만 이러한 접근은 역효과를 낳을 수 있습니다. 그래요, 물론 당신은 클릭을 얻어낼 것입니다. 하지만 동시에 방문객의 신뢰를 소진할 거예요. 피리 부는 소년 이야기처럼 당신이 만약 실제 관련된 콘텐츠를 올렸을 때에는 사람들은 과거의 기억을 떠올리면서 링크를 클릭하지 않을 것입니다. 더 나아가, 그들은 그 경험을 혼자 갖고 있지 않을 거예요. 그들은 다른 사람들에게 불평을 할 것입니다. 그러면 당신은 아마 틀림없이 첫 클릭조차 얻어내지 못할 거예요.

반대로, 만약 사람들이 당신을 신뢰하고 브랜드의 힘이 강력해진다면, 당신은 약간 더 많은 오류를 갖게 될 거지만 걱정 말아요. (많지는 않습니다. 브랜드는 상호작용 경험이기 때문에 많은 실수는 결국 잠식될 것입니다.) 하지만 기본적으로 만약 당신이 스스로 당신의 사이트에서 원하는 것을 찾을 수 있다는 사용자의 기대심을 높일 수 있다면 (당신이 라벨과 이미지 같은 것을 약속한다면 언제든지) 당신은 큰 신뢰를 얻을 수 있을 것입니다. 그렇다면 사람들은 가끔 실수하는 것에 대해 당신에게 혜택을 줄 가능성이 많아집니다.