brunch

매거진 웹사이트 사용자의 UX 분석

라이킷 68 댓글

You can make anything
by writing

C.S.Lewis

계정을 잊어버리셨나요?

by 뷰저블 Beusable Aug 08. 2018

간단히 사용자 경험을 높일 수 있는 UX 체크리스트 3

하나의 목적 / 간결하고 명료한 카피 / 절제된 비주얼 요소

안녕하세요 뷰저블입니다. 오늘은 여러분의 웹 사이트 사용자 경험을 높이기 위한 3가지 체크리스트에 대해 이야기 나누고자 합니다. 이 3가지 체크리스트만 준수하여도 여러분들의 웹 사이트의 사용자 경험이 훨씬 더 좋아질 수 있습니다.

하나의 목적에 집중하는지 확인하세요.

명료하고 간결한 카피 문구를 작성하세요.

비주얼 장식 요소를 적절히 제거하세요.

1. 하나의 목적에 집중하는지 확인하세요.

여러분의 웹 사이트가 지니는 최대 목적은 무엇인가요? 아마 회원가입, 데모 버전 이용하기, 구독하기, 구매하기 등 매우 다양한 목적들이 존재할 것입니다. 명확한 한 가지 목표에 최우선 순위를 두고 사용자가 해당 목적을 달성하는 데 집중하도록 디자인하세요. 여러 개의 목표가 존재하더라도 디자인 요소에 강약을 둘 수 있어야 합니다. 예를 들어 아래 이미지처럼 슬랙의 경우 회원가입을 유도하는 것에 최우선 순위를 두고 있습니다. 애어 비앤비는 여행지를 검색할 수 있는 검색창이 여행지 배경 화면 정 가운데에 위치해있습니다. 하나의 명료한 CTA를 통해, 사용자는 사이트에서 자신이 무엇을 해야 하는지를 바로 이해하고 집중할 수 있게 됩니다.

슬랙에서는 이메일 회원가입을 유도하는 CTA를 페이지 정 가운데에 배치하고 있습니다.

애어비앤비에서는 여행지 검색창을 웹 페이지 정 가운데에 매우 크게 배치하고 있습니다.

인비전 또한 Slack처럼 이메일 회원가입을 유도하는 입력 양식을 가운데에 두고 있습니다.

신선 식품을 배송하는 Good eggs에서도 Zip code 입력을 유도하는 입력 양식을 정 가운데에 배치합니다.

2. 명료하고 간결한 카피 문구를 작성하세요.

여러분이 웹페이지를 통해 전달하고 싶은 내용은 무엇인가요? 명료하고 간결한 카피 문구를 작성하여 사용자에게 여러분의 서비스 또는 제품을 소구 하세요. 그럼 구체적으로는 어떻게 작성하는 것이 좋을까요?

먼저 '당신'이라는 단어를 사용하는 것이 좋습니다. 여러분과 여러분의 독자인 '당신'과의 관계를 확립할 수 있도록 주의를 환기시키세요. MailChimp에서는 'your brand'라며 당신에 대해 이야기합니다.

메일침프에서는 'Build your brand. Sell more stuff.(브랜드를 구축하고 더 많은 물건을 파세요)'로 소구합니다.

두 번째로는 표적시장에 소구 할 수 있어야 합니다. 목표 대상 고객과 그들의 욕구에 맞는 카피 문구를 작성하세요. 이들이 받을 수 있는 혜택이나 해결방안을 제시하면 더욱 좋겠죠? 미국의 Lyft에서는 'Grab the wheel and start earning'이라는 문구로 소구하고 있습니다.

Lyft는 'Grab the wheel and start earning(바퀴를 쥐고 수익을 올리세요)'이라는 명료한 카피문구로 사용자에게 소구합니다.

기업이 돈을 버는 데 급급하다는 인상을 주지 않고, 고객의 입장에서 왜 서비스를 이용해야 하는지를 설명하는 것도 좋은 방법입니다. 우버 이츠는 사용자가 우버 이츠를 사용하면 좋아하는 음식을 배달받을 수 있고 편리하다고 이야기합니다. 맛있어 보이는 수제버거 이미지와 함께 설명하고 있습니다.

UBER eats에서는 'Uber Eats는 좋아하는 음식을 배달 받을 수 있는 편리한 방법입니다.'라는 명확한 카피문구를 지녔습니다.

Handy는 'Book top-rated professionals for all you hoem needs'라는 문구로 소구 합니다.

미국 'Handy'는 'Book top-related professionals for all your home needs'로 소구합니다.

아래 글을 참고하여 카피 문구 작성을 위한 팁을 얻어가세요.

5 Great Ideas to Improve the UX of Your Copy

We’ve said it before and we’ll probably say it again; the copy used in products is as important to the user experience as any other part of the design. Great graphics, awesome information architecture and simple processes can still be completely wasted if

www.interaction-design.org

16 Rules of Effective UX Writing – UX Planet

by Nick Babich

uxplanet.org

3. 비주얼 장식을 적절히 제거하세요.

마지막으로는 불필요한 비주얼 장식을 적절히 제거하여 사용자가 CTA, 목적에 집중할 수 있게 하세요.

비주얼적 요소는 브랜딩을 효과적으로 드러내고 사용자의 시선을 끌기에 충분하지만, 너무 지나치다면 사용자 경험에 오히려 부정적인 영향을 미치게 됩니다. 미국의 BORN사는 채용 페이지에 장식 요소를 철저히 배제하여 사용자가 오로지 채용 공고에 집중할 수 있게 하고 있습니다.

Born의 Career 페이지에서는 장식 요소를 두지 않고 오로지 채용 공고에 집중할 수 있게 합니다.

PINATEX에서는 브랜드 이미지를 연상케하는 이미지와 레이블만으로 간결하게 구성하였습니다.

웹 사이트의 목적이나 종류에 따라 체크리스트가 유용한 곳이 있는가 하면 그렇지 않은 곳도 있을 것입니다. 예를 들어 커머스 업체라면 조금 달라지겠죠? 하지만 B2B 사이트나 스타트업 등의 사이트라면 굉장히 유용한 체크리스트가 될 것입니다.

하나의 목적에 집중하는지 확인하세요.

명료하고 간결한 카피 문구를 작성하세요.

비주얼 장식 요소를 최대한 제거하세요.

마지막으로 뷰저블로 개선 전후 성과를 추적하세요.

최적화를 실시하였다면 이후에는 뷰저블로 달라진 UX 성과를 추적할 차례입니다. CTA의 전환율이 어떻게 달라졌나요? 사용자의 응시 지점이 어떻게 개선되었나요? 스크롤 도달률이 늘어났나요? 콘텐츠 숙독률은 얼마나 늘거나 줄어들었나요? 뷰저블의 UX Heatmaps로 성과를 추적하세요.