회원 가입 화면 (sign-up screens) 구상 전략
회원가입 페이지는 이메일 주소나 사용자의 필수 정보를 수집하여 제품이나 서비스에 등록하도록 설계된 랜딩 페이지입니다. 회사는 신규 고객의 트래픽을 유치하기 위해 마케팅 캠페인을 집행하거나 웹 사이트 개편과 같이 다양한 노력을 기울입니다. 돈은 돈대로 썼는데 회원가입 페이지에서 유저를 놓쳐 서비스를 소개할 기회를 놓친다면 너무 억울할 거 같아요.
회원 가입 랜딩 페이지의 디자인에 따라 이끌어온 트래픽을 안정적으로 유치시킬 수도 있고, 공들여 디자인한 반면 사용자의 주위를 분산시켜 트래픽 유실이 발생될 수도 있다는 아티클을 읽고 흥미로워 포스팅하게 되었습니다! 사용자의 마찰을 줄이고 원활한 온보딩을 위해 functional design과 delightful design의 차이를 예시를 통해 살펴보겠습니다.
1. functional design이란?
기능적 디자인은 실용성과 사용성을 강조합니다. 기능적 디자인은 효율과 효과를 중심으로 서비스의 성과를 나타냅니다.
2. delightful design 이란?
delightful은 기분좋은, 기쁘게 하는이라는 뜻으로 delightful design은 기능성을 넘어 즐겁고 감정적으로 충만한 사용자 경험을 제공하는 디자인입니다. 주로 애니메이션, 영상, 다양한 일러스트를 활용하여 사용자에게 긍정적인 감정을 유발하고 좋은 인상을 오래도록 유지하기 위한 목적으로 쓰입니다.
3. 디자인 개편사례 : ring
delightful design에서 functional design으로 전환. 배경 이미지대신 서비스명과 핵심 카피를 중심배치하여 사용자 CTA를 높임.
functional design의 온보딩률이 높은 이유
1. 유저 주의 분산
회원가입 페이지에 일러스트나 배경 영상을 더할 경우 사용자 주의가 CTA로부터 분산되어 가입 가능성을 낮추게 됩니다.
CTA (Call To Action) : 웹 사이트 내 목표를 달성하기 위해 고객에게 '행동'을 유도하는 버튼이나 배너. 보통 '행동 유도 버튼' 또는 '목표 달성 버튼'이라고 해석되기도 함
2. Bandwidth(대역폭)와 앱 크기 문제
비디오, 일러스트, 애니메이션과 같은 요소는 앱 크기를 크게 증가시킬 수 있고 이는 비용 문제와도 직결됩니다. 또한 인터넷 속도가 느린 국가나 지역의 사용자가 앱을 성공적으로 다운로드할 가능성을 낮추기도 합니다.
Think,
사용자 CTA개념을 모른 상태에서 UI 디자인을 고려했다면 delightful designed sign up 페이지의 생동감으로 인해 디자인을 채택했을 것 같다. 하지만 이번 스터디를 통해서 단순히 심미성만을 고려하여 화면을 구성했을 경우 어떤 문제점이 따라오는지 알게 되었다. 웹 접근성 향상을 위해서 앱 크기를 최소화할 수 있는 부분은 최소화 하는 것이 좋고, 핵심 기능보다 시선이 오래 머무는 디자인은 잘 디자인된 것이라 할지라도 그 역할이 화면 목적성을 위배하는 것임을 배웠다. 아티클에서 말했듯 가끔은 지루함이 더 나은 결과물을 만들어 낸다!
Sometimes, just sometimes, boring can be good.
출처 : https://userpilot.com/blog/sign-up-page-examples/
25 Sign-Up Page Examples That Convert
Wondering how you can optimize your sign-up page conversion rates? Learn how to do it with these 25 sign-up page examples!
userpilot.com
출처 : https://read.first1000.co/p/use-boring-sign-up-screens
👵 Use boring sign-up screens
Learnings from Spotify, Nextdoor, Ring and AllTrails sign-up screen redesigns.
read.first1000.co
'Today I learned > 서비스기획' 카테고리의 다른 글
서연주 UI 디자이너(UI LAB 운영) 인터뷰 인사이트 정리 (3) | 2024.10.02 |
---|---|
당근 역기획 2. 서비스 프로세스 분석 (0) | 2024.09.10 |
'지역 기반 커뮤니티 플랫폼' 당근 역기획 1. 비즈니스 모델 파악 (11) | 2024.08.26 |
서비스 기획자 관점에서 기획하는 법 (0) | 2024.08.11 |
비개발자도 이해하기 쉬운 깃허브(GitHub) 용어 이해하기 (0) | 2024.07.09 |