brunch

You can make anything
by writing

C.S.Lewis

by BUNDI Feb 12. 2018

악마의 UI/UX

Dark Patterns: The Devil in Mobile UI UX

핸드폰에서 결제를 할 때 빠지지 않고 나오는 UX단계가 있습니다. 바로 약관 동의 부분인데요. 가끔 어떤 결제 사이트는 수많은 마케팅 동의사항(필수가 아닌 선택사항들)을 마치 필수 사항들인 것처럼 위장한 모습을 보이기도 합니다. 이러한 UI/UX에서의 속임수들을 어둠의 패턴 Dark Pattern이라고 합니다. 오늘은 다양한 어둠의 패턴들을 소개한 글을 가지고 왔습니다.

https://medium.muz.li/malachidigest-3cad286bba

*지금부터는 위 글에 대한 번역입니다




악마의 UI/UX

Dark Patterns: 

The Devil in Mobile UI UX Design?


모바일 앱에서 선택을 하느라 헷갈린 적이 있으신가요? 서비스를 무료로 가입하는 건 언제나 쉽지만, 탈퇴하는데 종종 어려움을 느끼셨나요? 예를 들어 여러분은 한 주 동안 서비스를 무료로 이용할 수 있을 겁니다. 하지만 서비스에서 탈퇴하는 걸 까먹거나 탈퇴하는 방법을 찾기 힘들어서 그대로 방치하면, 서비스는 자동으로 당신의 카드에서 돈을 가져갈 겁니다. 이러한 경우를 ‘어둠의 패턴 Dark Patterns’라고 합니다.



(위 사진) Honest UI 정직한 UI(왼쪽) ~ UI 디자이너 ~ Dark Patterns어둠의 패턴(오른쪽)

User’s needs 사용자의 필요: 기업의 매출과 전환율이 저조하더라도 사용자는 최우선 고려사항입니다.

Companie’s interest기업의 관심: 기업은 무척이나 교묘합니다. 법의 울타리를 넘지 않으면서, 사용자를 섬세하게 속입니다.




정확히 어둠의 패턴이 무엇인가?


어둠의 패턴은 UI 디자이너가 특정한 행동을 가능한 어렵게 만들어 사용자에게 혼란을 주는 방법들을 의미합니다.


즉, 사용자들로부터 어떠한 정보를 숨기는 방법입니다.


탈퇴하는 것처럼 몇 가지 거쳐야 하는 단계가 있기는 하겠지만, 여전히 그런 메뉴에 접근이 가능하긴 합니다.


어둠의 패턴은 기업이 원하는 행동을 사용자들이 먼저 수행하도록 설득하고 의도하기도 합니다. 그 예시로, 핸드폰 화면의 가장 중요한 부분에 스폰서 광고를 배치하는 것을 생각할 수 있습니다.




어둠의 패턴, 그 예시


어둠의 패턴도 UI 디자인의 일부이기에 인터페이스 디자인의 원칙을 따릅니다. Shneiderman의 8가지 황금 법칙을 따르는 것은, 여러분이 훌륭하고 윤리적인 어둠의 패턴을 디자인하기 위한 좋은 시작이 될 것입니다. 이 법칙의 카테고리에 따른 몇 가지 어둠의 패턴 예시를 살펴보겠습니다.



1. 싸구려 모텔


싸구려 모텔이란, UI/UX 디자인에서 어떠한 상황에 들어가기는 쉬우나, 동시에 그 상황에서 빠져나오기는 매우 힘든 상황을 의미합니다. 그 예시로 구독하는 걸 생각할 수 있습니다.



들어올 땐 마음대로지만, 나갈 때는 아니다.

Equifax는 당신에게 한 번의 클릭으로 한 달간의 무료 신용평가서를 받을 수 있다고 제안합니다. 하지만, 온라인으로 취소할 수 없기에, 당신이 탈퇴하기를 찾으려면 평생이 걸릴지도 모릅니다.


들어올 때: 클릭 한번과 양식 작성나갈 때: 취소하려면 전화를(누가 받는다면)





2. 검문소


검문소 패턴은 사용자가 콘텐츠를 보려고 하는데, 팝업 광고가 튀어나와 방해할 때 발생합니다. 이런 검문소는 특정한 기업(특히 미디어/뉴스 관련 기업)의 비즈니스 모델의 일부일 수 있습니다. 실제로 검문소는 UX를 방해하며, 사용자들이 두 번 다시 이런 방해를 용납하지 못하게끔 만듭니다. 실제로 한 연구에서는 정기 구독 광고를 보여주기 시작한 이후 온라인 뉴스의 방문율이 51% 감소했다고 강력히 말하고 있습니다.


전체 페이지를 덮어버리는 팝업 광고

Sports Directd와 Toms의 홈페이지는 콘텐츠로 넘어가기 위해서는 광고를 먼저 보라고 사용자를 강요하고 있습니다. 콘텐츠를 보면서 사용자는 별 다른 방법이 없기에, 방해받고 있다고 느낍니다.






3. 헷갈리는 색깔


대부분의 경우, UI 디자이너들은 사용자들에게서 바람직한 행동을 유도하기 위해 알맞은 색깔을 사용합니다. 하지만 어둠의 패턴은 의도적으로 저 음영의 색을 사용하여 사용자들이 읽기 힘들게 만듭니다. 비록 ‘탈퇴하기’ 텍스트가 다른 메시지들보다 조금 더 굵고 하얗지만(더불어 매우 좁은 터치 영역과, 밑줄이 쳐져있지 않은 상태까지), 이처럼 화면에 적용된 헷갈리는 색깔과 타이포그래피의 사용 때문에 사용자들은 클릭이 가능한지도 모를 것입니다.



비슷한 음영과 색조

Rayban은 검은색 바탕에 짙은 회식을 사용하고 있습니다. 이것은 사용자들을 읽기 힘들게 하고, 탈퇴 버튼이 어디 있는지 찾기 어렵게 만듭니다.



특정 색깔

Norwegian Air은 사용자들의 눈을 속이기 위해 바디 텍스트와 눌러야 하는 액션 텍스트 모두에 흰색을 사용하고 있습니다.



다른 어둠의 패턴 예시로는 New York Times를 들 수 있습니다. 당신이 기사를 읽기 전에, 구독할 것인지 팝업 광고가 나옵니다. 뭐, 짜증은 나지만 속이고 있지는 않습니다. 근데 정말 구독을 해야 할까요? 대답은 ‘아니오’입니다. 대비가 적은 색상으로 만들어져 보기 힘든 닫기 버튼이 광고 왼쪽 위에 있습니다. 동시에 적절한 위치인 오른쪽 구석이 아닌 왼쪽 구석에 있어서 사용자들은 거의 보지 못합니다.






4. 은근슬쩍 장바구니에 추가하기


당신이 생각했던 금액보다 돈을 더 내본 경험이 있나요? 결제하기 전 장바구니에서 확인한 어처구니없는 금액을 통해 얻은 엽기적인 경험을 어둠의 패턴이라고 할 수 있습니다. 예를 들어, Thompson으로 휴가 패키지를 예약할 때, 자동으로 국제 구호 기금을 당신 대신 장바구니에 추가하는 걸 생각할 수 있습니다. 잘 살펴보지 않거나, 또는 일을 빨리 끝내려고 한다면, 당신은 아마 당신이 원하지도 필요하지도 않은 것을 추가한 채로 결제할 것입니다.



숨겨진 금액

Thomson은 자선 기금 기부를 자동으로 추가해줄 만큼 친절합니다. 근데 먼저 물어봐야 하지 않을까요?





5. CTA버튼에 링크된 약관들


CTA버튼을 만드는 것 자체가 큰 도전이지만, CTA버튼 자체가 어둠의 패턴이 될 수 있습니다. 예를 들어, Ryan Air은 ‘지금 예매하기’라는 CTA버튼에 약관 동의를 링크했습니다. 때문에 사용자가 예매한다는 것은 자동으로 약관에 동의하는 것을 의미합니다. 물론 UI/UX적으로 이점도 있습니다. 단순한 CTA버튼으로 사용자의 시간을 절약해주고, “사용자 약관에 동의합니다”라는 UX단계를 압축했습니다. 사용자는 이로써 세부 단계를 고민할 필요가 없어졌습니다.





6. 작은 글자


Booking.Com에서는 전체 예매 가격은 실제로 더 높지만, 사용자가 낮은 가격에 얼마나 현혹될 수 있는지를 보여줍니다. 매우 작은 글자를 사용했기 때문에, 사용자의 눈은 즉시 오른쪽의 잘 보이는 위치에 표시된 굵은 가격에 집중됩니다. 그리고 사용자에게 오직 이 가격에 나온 금액만을 낼 것이라는 인상을 심어줍니다. 사용자들은 Informavores(https://www.interaction-design.org/literature/article/web-user-behaviour-directed-by-information-scent. 정보를 소비하며 사는 현대인들을 뜻합니다)입니다. 끊임없이 인터페이스를 살펴보고, 그들이 원하는 정보를 가능한 빠르게 찾기 위해 노력합니다(이러한 정보는 보통 더 크고, 굵고, 강한 색상의 글자를 사용합니다).






요약


제 생각엔 어둠의 패턴은 UI 디자인에서 선도 아니며 악도 아닙니다. 저는 차라리 어둠의 패턴이 비윤리적인 디자인에서 꼭 나쁜 법은 없다고 믿습니다. 우리가 자세히 살핀다면, 어둠의 패턴은 비즈니스 또는 스폰서 광고가 그들이 목표하는 고객들에게 적절히 접근하게 도와주고, 이로써 더 높은 가입률과 더불어 더 많은 수익을 낼 것입니다.


어둠의 패턴이 계속해서 나타나며, 간단한 행동을 헷갈리게 하기 때문에, 저를 포함한 사용자들은 당연히 짜증 날 겁니다. 우선, 저는 어둠의 패턴을 보면 정직하지 못해 보이고, 대부분의 경우 윤리적으로 정당화될 수 없다고 생각합니다. 하지만, 저는 Facebook 장기 기증에서는 어둠의 패턴에 의해 좋은 경험을 할 수 있었습니다.


솔직히 말해서, UI 디자이너들이 아름다운 어둠의 패턴을 만들기 위해 그들의 창의력을 사용한다는 것은, 그들이 디지털 환경에서의 윤리적 범위를 몰라서 그러는 게 아닙니다. 아마 UI 디자이너는 항공사 또는 여행사와 같은 기업의 비즈니스 모델의 일환으로 어둠의 패턴을 디자인해야 할 것입니다.


결국 UI/UX 디자이너는 어둠의 패턴이 사용자의 행동에 영향을 미치는 것과 그들을 속이는 것 사이에서 줄타기를 하는 것이기 때문에, 어둠의 패턴을 피해야 합니다. UX 디자이너들은 좋은 의도에서 어둠의 패턴을 사용해야 하며, 사용자와 기업 모두에게 win-win이 될 수 있는 방법으로 사용해야 합니다. UI/UX다지이너들은 헷갈리거나 거짓된 인터페이스로 사용자를 속여서는 안 됩니다. 왜냐하면 사용자들은 웹사이트 또는 기업에 대한 신뢰를 급격히 잃을 것이기 때문이죠. 사용자와 서비스 사이의 이상적인 수익을 연결하는 것은 UI 디자이너들의 숙명과 같습니다. 그리고 이것은 단순히 UX에서만 한정된 것이 아닙니다.

브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari