서비스 이용 관련 FAQ

서비스 이용 관련 FAQ 서비스 이용 범위 Q1. 뷰저블 도입이 가능한 환경인지 궁금합니다. 뷰저블 도입을 위해서는 아래와 같은 환경이 충족 되어야 합니다.(1) HTML 스크립트 코드 설치가 가능할 것(2) 외부에서 접근 가능한 URL이 존재할 것(3) 앱의 경우, 하이브리드 앱의 웹뷰 영역까지 지원하며, 네이티브 앱은 지원되지 않음 ▶︎서비스 이용에 필요한 조건 확인하기: https://forum.beusable.net/ko/solomon/post/977 Q2. 네이버 블로그, 브런치 페이지도 분석이 가능한가요? 코드 설치 권한이 없는 네이버 블로그, 브런치, 타사의 결제 시스템 등의 페이지는 코드 설치가 불가능하기 때문에 뷰저블로 분석할 수 없습니다. <코드 설치 가능한 사이트>1. 자체 제작 사이트운용중인 사이트의 html에 뷰저블 코드를 직접 설치/배포하는 방식으로 설치하시거나,Google Analytics를 이용하고 계신 경우 GTM(Google Tag Manager)을 활용하여 설치가 가능합니다. 2. 웹빌더 제작 사이트카페 24, 아임웹, 워드프레스 등의 웹 빌더로 제작된 사이트라면 사이트의 관리자 모드에서 트래킹 코드 설치가 가능합니다. ▶︎트래킹 코드 설치 가이드: https://forum.beusable.net/ko/solomon/category/246 페이지 등록 Q3. 로그인이 필요한 마이페이지의 개편 성과를 분석하고 싶습니다. 가능할까요?네, 뷰저블로 로그인 이후 페이지도 분석 가능합니다. 단, 페이지 등록 시 반드시 [로그인 이후 페이지]로 설정해 주셔야 하며, 이 때 개인정보 보호를 위해 모든 텍스트는 ‘xxx’로 마스킹 처리됩니다. [로그인 이후 페이지] 설정하기로그인 이후 페이지로 설정 시, XXX로 치환된 화면 #Note로그인 이후 페이지는 캡처 서버가 등록 url에 직접 방문할 수 없기 때문에 등록 url에 접속한 사용자의 html 정보를 바탕으로 캡처화면을 구성합니다. 이런 경우 직접 사이트에 로그인 후 라이브히트맵을 활용하시면 캡처 이미지와 무관하게 로그인 이후 화면의 데이터 조회가 가능합니다. ▶︎로그인 페이지 등록 가이드: https://forum.beusable.net/ko/solomon/post/2153 ▶︎라이브히트맵 가이드: https://forum.beusable.net/ko/solomon/post/785 Q4. SPA 페이지로 제작된 경우에도 분석이 가능한가요?NoteSPA란, URL이나 페이지가 바뀐 것 같더라도 실제로는 콘텐츠만 갱신되는 형태의 단일 페이지입니다.대시보드에서 SPA토글을 On하시면 SPA기능이 적용됩니다.- SPA기능 적용 시, URL 변경을 추적하여 각 페이지 별 데이터를 수집할 수 있습니다. - SPA기능은 도메인 별(서브 도메인 포함)로 적용됩니다.대시보드 우측 상단 SPA 토글 ▶︎SPA 페이지 등록 가이드: https://forum.beusable.net/ko/solomon/post/1046 도메인/페이지 관리 Q5. 여러 고객사의 사이트를 관리하는 마케팅 에이전시입니다. 도메인/사이트를 몇 개까지 등록할 수 있나요?도메인과 페이지는 개수에 제한 없이 등록하실 수 있습니다. (Journey Map은 Pro 이용 혜택)또 도메인별 ‘월간 PV제한’, 페이지별 ‘PV수 제한’ 기능으로 PV수를 관리하실 수 있습니다. ▶︎Journey Map 도메인 등록/관리 가이드: https://forum.beusable.net/ko/solomon/category/198 ▶︎UX Heatmap 페이지 등록 가이드: https://forum.beusable.net/ko/solomon/category/456▶︎UX Heatmap 페이지 관리 가이드: https://forum.beusable.net/ko/solomon/category/562 트래킹 코드 설치 Q6. 도메인이 다른 여러 고객 사이트의 페이지를 등록했습니다. 모두 동일한 트래킹 코드를 설치하면 되나요? 뷰저블 통합 트래킹 코드는 계정별로 발급되기에 도메인과 무관하게 모두 동일합니다.동일한 통합 코드를 각각의 사이트에 한번만 설치해 주시면 UX Heatmap과 Journey Map 서비스를 모두 이용하실 수 있습니다. ▶︎통합 코드 설치 가이드: https://forum.beusable.net/ko/solomon/post/740 PV 이용 Q7. 해당 월에 무료로 제공 또는 충전된 PV를 다 못쓴 경우, 다음 달로 이월이 가능할까요?당월에 소진되지 않은 PV는 다음 달로 이월되지 않으니 이용에 참고 부탁드립니다.

Data-Driven UX 스터디 지원

같은 직무의 현업자들이 어떻게 뷰저블을 활용하는지, 혹은 Data-Driven UX를 실무에 적용하는 방식이 궁금하셨나요? 현업자들과 인사이트를 나누며 역량을 키울 수 있도록 서포터즈분들께 Data-Driven UX 스터디를 지원해드립니다! 스터디 지원 조건은 어떻게 되나요?뷰저블 서포터즈로 선정된 분들에 한해 지원해 드리는 서포터즈 혜택입니다. 스터디 멤버 구성은 어떻게 되나요?- ①, ② 중 원하는 방식을 택하여 진행합니다. (각각 1개씩 최대 2개까지 참여 가능) ① 본인이 직접 동료/지인들로 그룹을 결성인원: 최소 2명 ~ 최대 5명리더: 서포터즈 본인신청 방법:뷰저블 교육 메일 계정(edu@4grit.com)으로 스터디 참가 신청 스터디 멤버를 구성 한 후 뷰저블 팀에 공유해 주세요.스터디 멤버 분들의 성함, 소속 정보 요청 예정뷰저블 팀에서 디스코드 채널을 생성하여 리더분께 초대 링크를 공유해 드릴 예정입니다. ② 뷰저블 측에서 안내해주는 서포터즈 내 구성원들로 진행인원: 최대 5명 (업종/직무가 비슷한 멤버들로 구성 예정)리더: 구성원 내 리더 선출 필요신청 방법:뷰저블 교육 메일 계정(edu@4grit.com)으로 스터디 참가 신청뷰저블 측에서 멤버를 구성하여 그룹별로 디스코드 초대 링크를 이메일로 공유해 드릴 예정입니다.초대 링크에 접속하신 후 자율적으로 리더를 선출해 주시고 뷰저블 팀에 공유해 주시면 됩니다.*뷰저블 서비스 (UX Heatmap/Jouney Map)는 멤버 초대 기능을 지원하지 않습니다. 어떤 방식으로 진행되나요?스터디 기간: 3월 ~ 8월 내 자유롭게 그룹 결성(①) 또는 기존 그룹에 합류 가능(②)최초 모집 후, 매달 20일까지 스터디 추가 신청(취소 후 재참여 포함) 및 미 연장 의사를 알려주면 다음 달부터 반영월 최소 1회 이상 진행 권장 (횟수 제한 없음)스터디 시간: 1~2시간 권장방식: 오프라인/온라인 병행 가능주제: Data-Driven UX세부주제: 1) 뷰저블 팀에서 제시하는 커리큘럼에서 원하는 주제를 선택하여 진행2) 자율적으로 선정 ※이 경우 뷰저블 담당자와 사전 협의 부탁드립니다.스터디 진행 회차별 결과 보고서 제출 필수(결과 보고서 작성 가이드: https://forum.beusable.net/ko/solomon/post/2377 ) 어떤 지원을 받을 수 있나요?공통 지원사항Data-Driven UX 도서 오프라인 진행 시 스터디룸 이용에 대한 비용 지원비용 지원 신청 가이드: https://forum.beusable.net/ko/solomon/post/2378 1인당 월 최대 2만원까지 지원스터디룸/카페에서 사용한 비용(공간 대여, 커피, 간식)은 모두 지원 대상 우수 스터디 그룹에 뷰저블 교육 최대 2회 제공스터디 진행 횟수, 멤버 참여율, 결과보고서 내용물 등을 종합적으로 검토하여 우수 스터디 그룹을 선정합니다.스터디 진행 횟수는 온라인/오프라인 무관하게 인정됩니다. 우수 그룹은 5월과 7월에 총 2번 선정하며, 두 번 다 선정된 그룹의 경우 2번의 뷰저블 교육을 받을 수 있습니다. 교육 진행 일정은 뷰저블 담당자와 그룹 리더간의 협의를 통해 조율할 예정입니다. ※ 스터디 진행 횟수나 참석율, 활동 결과물에 따라 지원이 제한될 수 있습니다. FAQ Q. 직접 동료/지인으로 멤버를 구성할 경우 지켜야할 조건이 있나요?A. Data-Driven UX 주제에 관심이 있고, 함께 학습하며 도움을 주고 받을 수 있는 지인과 동료로 구성해 주세요. Q. 멤버를 직접 구성한 그룹, 서포터즈 내 구성원으로한 그룹 2개 다 참여도 가능할까요? A. 네, 각각 1개씩 최대 2개의 그룹에 참여 가능합니다. Q. 스터디 그룹의 리더는 어떤 역할을 하나요?A. 스터디 주제, 진행 방식(주기/대면,비대면/장소 등)을 정하고, 결과 보고서 제출 및 비용 지급 등에 대해 뷰저블 팀과 커뮤니케이션을 담당합니다. 로테이션도 가능하지만, 이 경우 뷰저블 팀에 반드시 공유해 주셔야 합니다. Q. 중간에 리더가 탈퇴하면 어떻게 되나요?A. 탈퇴 시 다른 분께 리더를 위임할 수 있으며, 위임이 어려운 경우 그룹 해체 후 재결성이 필요합니다. 사정상 탈퇴가 필요하신 경우 뷰저블 담당자에게 미리 공유 부탁드립니다. Q. 스터디를 진행한 내용에 대한 콘텐츠를 작성하고 싶습니다. 월 작성 콘텐츠 개수에 포함인가요? A. 네, 스터디를 진행하신 내용을 콘텐츠로 작성해 주셔도 되고, 이는 월 작성 콘텐츠 개수에 포함됩니다. Q. 4월부터 바로 진행은 어려운데, 중간 합류도 가능할까요?A. 네, 매달 20일까지 뷰저블 팀에 메일로 추가 신청을 해주시면 요청일 기준 다음 달부터 진행 가능하십니다. Q. 개인별 최소 참석 기준이나, 그룹별로 채워야 하는 최소 진행 횟수가 있나요?A. 뷰저블 측에서 요구하는 최소 참석/진행 기준은 없습니다. 스터디 주기와 방식 등은 그룹별 협의를 통해 개별 규칙에 따라 진행해 주시면 됩니다. 단, 스터디를 진행한 횟수가 많을 수록 우수 그룹으로 선정될 확률도 높아집니다. Q. 1시간 미만 진행시 지원이 안되는지, 시간에 대한 증빙도 필요한가요? A. 1~2시간 진행을 권장하고 있지만, 별도 증빙은 필요하지 않습니다. 단, 결과 보고서의 내용에 따라서 지원이 제한될 수 있습니다. Q. 온라인으로만 진행 시 지원되는 내용은 없나요?A. 온라인으로 진행 시 별도 비용 지원은 없으며, 우수 그룹에 선정 시 뷰저블 온라인 교육이 최대 2회까지 지원됩니다. 스터디 관련 문의: edu@4grit.com

서포터즈 활동 관련 FAQ

활동 범위 Q. 확인해보니 뷰저블 코드 설치가 어려운 사이트인데, 활동에 제한이 있을까요? 분석 사례 외에도 <활동 가이드> 에 기재된 다양한 주제로 콘텐츠를 작성해 주실 수 있습니다.작성 가능한 주제는 아래 참고해 주세요! 1.뷰저블 도서에 대한 후기 콘텐츠- 실무에서 어떤 식으로 활용해 보았고 인사이트를 얻을 수 있었는지 2.뷰저블 세미나/박람회/학회 참석 후기 콘텐츠- 23년도 상반기 세미나 내용, 현장 스케치와 후기 등 - 학회, 세미나 등 이벤트를 함께 홍보 3.뷰저블 데모 계정 및 뷰저블 사이트 리포트를 활용한 콘텐츠- 자사 홈페이지 분석 내용, 주요 기능 활용법 등 - 데모 계정 정보, 리포트 공유가 필요하신 경우 뷰저블 팀에 문의해 주세요. 4. 스터디 진행 내용 및 후기 - 스터디에서 다룬 내용, 이를 통해 얻은 인사이트 등 5.이외에도 기타 자유로운 콘텐츠 제작 가능 - 이 경우 뷰저블 팀과 사전 협의 후 작성 부탁드립니다. 보안 이슈 Q. 회사명, 특정 화면 공개가 어려울 경우 어떻게 작성하면 될까요?콘텐츠에 특정 회사명 또는 캡처 화면을 공개하는 경우, 반드시 데이터 제공자와 사전 협의가 필요합니다.만약 공개가 어려우신 경우, 기업명이나 특정 화면을 마스킹 처리하여 콘텐츠를 작성해 주셔도 됩니다.

서포터즈 커뮤니티 채널

커뮤니티 Q. 서포터즈의 정기 모임이나 커뮤니티가 있나요?뷰저블 포럼 외에도 서포터즈 분들의 네트워킹 및 소통 활성화를 위한 커뮤니티 채널을 제공해 드립니다. <서포터즈 커뮤니티 가입 / 활동 가이드>1. 디스코드 서비스에 가입해 주세요. (바로가기)2. 공유 받은 초대 링크를 통해 커뮤니티에 입장해 주세요. 3. 활동명을 뷰저블 포럼과 동일하게 설정해 주세요. *뷰저블 서비스 (UX Heatmap/Jouney Map)는 멤버 초대 기능을 지원하지 않습니다.

[서포터즈] 오프라인 스터디 비용 지원 신청은 어떻게 하면 되나요?

오프라인 스터디 진행에 대한 [비용 지원 신청] 가이드입니다.궁금하신 점은 edu@4grit.com으로 문의해 주시면 답변드리겠습니다. [비용 지원 신청 프로세스]1. 지원 비용/대상 확인 > 2. 스터디룸 이용 결제 진행 > 3. 결과 보고서 작성 > 4. 증빙 서류/정보 제출 1. 지원 비용 / 대상 1-1. 지원 비용인당 월 최대 2만원씩 지원되며, 인원수 x 2만원로 지원 받을 수 있는 월 최대 금액을 계산하시면 됩니다.예) 5인이 스터디를 진행할 경우 월 최대 10만원 지원 8만원 사용한 경우 → 8만원 지급13만원 사용한 경우 → 10만원 지급 1-2. 지원 대상스터디를 진행한 스터디 룸 또는 카페 내에서 발생한 모든 비용(공간대여/커피/간식/프린터 이용)은 지원 대상입니다. 2. 결제 진행 스터디룸에서 발생한 비용은 스터디 그룹의 리더가 대표로 결제를 진행해 주세요.영수증 처리가 가능한 카드 또는 현금으로 결제를 진행해 주세요.※ 카페 / 공간 대여를 각각 결제할 경우 각각 결제한 영수증을 모두 제출해 주시면 됩니다.결제 후 결제 일자, 스터디룸/카페명이 기재된 영수증을 반드시 보관/촬영해 주세요.※ 결제 일자는 스터디를 진행한 일자와 동일해야합니다. 3. 결과 보고서 작성 아래 정보를 포함하여 그룹당 1개의 결과 보고서를 작성해 주세요. 스터디 진행 일시※ 영수증에 기재된 날짜와 동일해야 합니다. 스터디 진행 장소/네이버 지도 링크※ 영수증에 기재된 상호명과 동일해야 합니다.스터디 참가 멤버 이름(예. 홍길동, 홍길동1, 홍길동2)과 단체 사진 첨부(기재된 멤버가 모두 포함되어야 함)※ 뷰저블 측에서 초대 드린 디스코드 채널에 참여 중인 멤버여야 합니다. 진행한 회차스터디 세부 주제 학습한 내용 및 인사이트 (최대한 구체적으로 작성해 주세요.) 4. 증빙 서류 / 정보 제출 아래 증빙 서류들을 스터디가 진행된 날짜를 기준 7일 이내로 edu@4grit.com 메일로 제출해 주시면, 내부 확인 후 영업일 10일 이내 비용이 지급됩니다. 결과 보고서 영수증 지원 금액을 송금 받으실 분의 성함과 계좌번호 FAQ Q. 1시간 미만 진행시 지원이 안되는지, 시간에 대한 증빙도 필요한가요? A. 1~2시간 진행을 권장하고 있지만, 별도 증빙은 필요하지 않습니다. 단, 결과 보고서의 내용에 따라서 지원이 제한될 수 있습니다. Q. 온라인으로만 진행 시 지원되는 내용은 없나요?A. 온라인으로 진행 시 별도 비용 지원은 없으며, 우수 그룹에 선정 시 뷰저블 온라인 교육이 최대 2회까지 지원됩니다.

유저에 대해 알아보기

7월 한달간 뷰저블의 히트맵과 저니맵을 통해 유저에 대해 더 분석해 보았다.우선, 꽤 다양한 나라에서 회사에 관심을 보이고 있었다. 또한 꾸준히 신규 방문자 수는 늘고 있었다. 평일 방문자 수와 주말 방문자수의 증감은 이전에 분석한 것과 동일했다. 사용자 환경을 자세히 분석하면, 일반적인 데스크탑 환경 사이즈 (1920*1080) 이 가장 비율이 높았고, 이후 크고 작은 해상도를 볼 수 있었다. 1536*864 사이즈는 어떻게 나온 것인지 조사해보니, 윈도우 10 에서 1920*1080 해상도를 125% 리스케일하여 볼 경우 저 값이 나온다고 한다. 이를 통해 관심 유저가 연령대가 살짝 있을 것으로 예상하였다.사용자가 대부분 윈도우를 사용한다는 것은 아래 그래프에서도 확인이 가능하다.도메인 특성 및 리스케일 유저의 비율을 고려하였을 때, 향후 홈페이지의 폰트는 작지 않게 가져가야겠다는 결론을 내릴 수 있었습니다. 라이브 히트맵을 통해 분석한 내용을 보면,위치적으로는 더 좌측/ 상단에 있는,이미 판매되고 있는 제품의 관심도가 더 높다는 것을 알 수 있었다. 다만, 텍스트로 구분을 주는게 아닌 제품의 성격으로 명확하게 고를 수있게 하면 좋겠다는 생각이 들었다.

AI 커뮤니티 '지피터스' 분석 인사이트 6가지

많은 분들이 랜딩 페이지를 정성껏 만들지만, 실제로 사용자들이 얼마나 스크롤을 내리고, 어느 버튼을 눌렀는지는 막연히 짐작만 할 뿐입니다. 그런데 뷰저블같은 분석 툴을 통해 실제 데이터를 살펴보면 의외의 결과들이 드러납니다.‘상단 CTA가 플로팅 버튼보다 훨씬 많이 클릭된다’, ‘요일 검색이 주제(카테고리)보다 관심도가 높다’, ‘하단 후기까지 내려가서 꼼꼼히 읽는 사람들이 있다’ 등등. 이러한 발견들은 곧 전환율 개선의 기회가 되기도 합니다.지피터스 스터디 신청 페이지를 뷰저블로 분석하고 얻은 핵심 인사이트 6개를 소개합니다. 뷰저블? 뷰저블은 아주아주 간단하게 고객의 서비스 이용 여정(Journey Map)과 UX 히트맵(화면에서 유저의 행동 패턴)을 볼 수 있게 구현해 주는 서비스입니다. 자체 개발하거나 wix, 카페24, 아임웹 등 웹페이지 제작 툴로 만든 웹페이지에 아주 간단하게 트레킹 코드를 붙여서 구현할 수 있어요. 5분 컷? 이면 대기업 UX팀에서 보는 듯한 대시 보드가 짜라란하고 만들어집니다. 단 네이버 스마트스토어나 브런치처럼 스크립트 코드를 설치할 수 없는 경우는 도입이 불가합니다. 트레킹 코드만 심으면 이런 데이터를 볼 수 있습니다! 1. 예상밖 결과: 최상단 CTA가 가장 많이 클릭된다일반적으로 “사용자는 스크롤을 어느 정도 해서 정보를 확인한 뒤, 결정을 내릴 때 플로팅 버튼을 누를 것”이라고 예상하기 쉽습니다. 그러나 데이터 상으로는 페이지 상단(히어로 섹션)의 ‘신청하기’ 버튼이 클릭 1위를 차지했습니다.클릭 1순위는 상단 '신청하기 버튼'왜 그럴까요? 혹시 재방문 사용자들은 이미 스터디를 알고 있어서 그런가해서 재방문/신규를 비교해보았는데, 큰 차이가 없었습니다.첫 화면에 시선 집중: 모바일·PC를 막론하고 상단 CTA가 가장 먼저, 가장 크게 눈에 띄어서이겠죠? 개선 아이디어 상단 CTA와 플로팅 CTA 간 디자인, 텍스트, 색상을 다르게 하여 A/B 테스트를 해보세요.신규 유입 경로(광고·SNS)에서 쓰는 문구와 히어로 섹션 문구가 일치하면, 바로 신청하기로 이어질 가능성이 높습니다. 2. “요일”을 먼저 본다: 카테고리보다 요일 필터에 집중“스터디를 찾을 때, 주제(카테고리)보다 ‘언제 할 수 있는지’가 더 중요하다”는 점이 데이터로 확인됐습니다. 요일별 클릭 수가 훨씬 높았습니다.요일은 전체 클릭 수 6위, 카테고리는 25위왜 그럴까요? 사용자 입장에서는 “내 스케줄에 맞는 요일인가?”가 가장 큰 결정 요인.취미·직무·외국어 등 어떤 카테고리든, 일단 시간이 맞아야 참여가 가능하기 때문이죠.개선 아이디어 메인 목록에서 요일 탭을 전면에 배치하거나, 달력 형태로 노출해 사용자가 빠르게 탐색하도록 유도하세요.카테고리는 ‘필요하면 추가 필터링하는’ 보조 역할로 배치해도 무방합니다. 3. 후기, 아래에 있어도 사용자들은 끝까지 본다페이지 하단에 배치된 “후기 섹션”이 생각보다 높은 클릭·체류 시간을 기록했습니다. 신청 전 “실제 사용자들의 경험”을 꼭 확인하려는 심리가 강하기 때문이죠.후기가 상당히 하단에 위치하고 있었음에도 불구하고, 후기 좌우를 넘기는 클릭이 전체 페이지의 35위를 차지했습니다.개선 아이디어 후기를 중간중간에도 짧게 노출: 주요 후기나 한두 줄짜리 추천 문구를 스터디 목록 사이, 혹은 진행 방법 섹션 아래 등에 배치해 스크롤 이탈을 줄이고 클릭을 유도하세요.“후기 OO개 더 보기”처럼 구체적인 수치를 강조하면 사용자 호기심을 자극할 수 있습니다. 4. Expert 스터디, 분리하지 않고 통합하니 노출률이 높아졌다전문성이 있는 사람만 참여할 수 있는 Expert 스터디를 이번에 출시했는데, 초기에는 별도 섹션으로 강조했습니다. 다른 스터디 목록을 보다가 Expert 스터디 영역에서는 이탈해 버리는 유저가 많았습니다. 반면, 일반 스터디와 하나의 목록에 섞어두니 스크롤 도중 자동으로 시선이 닿았습니다.Expert 스터디를 분리했을 때 Expert 스터디를 하나로 합쳤을 때개선 아이디어 스터디 전체 목록 안에서 Expert 스터디를 카드로 구분 표시하되, 화면 흐름은 합쳐주세요.특별한 혜택이나 난이도만 카드 디자인에서 간단히 언급해도 충분히 강조 효과를 얻을 수 있습니다. 5. “무엇을 배우는가” vs. “어떻게 진행되는가”데이터로 본 체류 시간: 스터디 주제 목록(카드) > 진행 방식(운영 방법) 섹션 사용자는 주제(내게 맞는지)를 먼저 확인하고, 그다음에 운영 방법을 궁금해합니다.스터디 진행 방법 설명 섹션 체류 시간 7초, 스터디 목록 체류 시간 10초로 30% 차이가 났습니다.화살표가 있는 영역 = 스터디 카드가 있는 부분. 스터디 진행방식 탐색보다 훨씬 오래 체류개선 아이디어 주제 목록을 먼저 충분히 보여주고, 진행 방식은 개괄적 개념+자세히 보기 링크 정도로 구성해 보세요.다양한 아이콘·짧은 문구를 활용해 직관적으로 “이렇게 진행됩니다”를 표현하면, 텍스트 과잉으로 인한 스크롤 부담을 줄일 수 있습니다. 6. 모바일 환경, ‘작은 화면에서 첫인상’이 더더욱 중요모바일은 스크롤을 활발히 하는 편이지만, 분석에서는 모바일에서도 상단 CTA 클릭률이 매우 높다는 사실이 드러났습니다. 오히려 pc보다 상단 CTA를 누르는 비율이 2배 가까이 되었습니다.왜 플로팅의 신청하기 대신 상단 버튼을 누를까..?왜 그럴까요? 작은 화면 탓에 “처음에 보이는 버튼”이 눈길을 사로잡으면, 바로 클릭이 이뤄짐.플로팅 버튼이 있어도 디자인·배치 문제가 있다면 오히려 상단 CTA만 눈에 들어올 수 있습니다.개선 아이디어 플로팅 CTA나 고정 메뉴가 충분히 시인성을 갖추도록 디자인·레이아웃을 재검토하세요.“처음 화면에서 간단히 스터디 핵심 장점을 확인할 수 있도록” 콘텐츠를 최적화해, 이탈을 줄이고 전환율을 높이세요. 데이터가 말해주는 진짜 사용자 행동데이터를 보기 전에는 “어쩌면 이런 식으로 클릭하거나, 이런 식으로 스크롤할 것이다”라는 예상으로 기획하고 디자인합니다. 하지만 뷰저블 분석 결과가 보여준 실제 사용자 행동 패턴은 생각과 전혀 다를 수 있습니다. 이번 사례에서도 그 점이 확연히 드러났습니다. 플로팅보다는 최상단 CTA가 압도적카테고리보다 요일이 우선후기는 끝까지 찾아 읽는다Expert 스터디, 함께 노출하는 편이 효과적첫 화면 정보가 모바일에서도 더욱 중요 여러분의 페이지에도 비슷한 현상이 일어나고 있지는 않을까요? 뷰저블의 히트맵·스크롤맵 툴을 사용해 확인해 보시면, 예상치 못한 인사이트를 얻을 수 있을 거예요. 작은 UI·UX 조정만 하셔도 전환율에 긍정적인 변화를 가져올 수 있으니, 꼭 시도해 보시기 바랍니다. '뷰저블 서포터즈 1기로 제품을 무료로 제공받아 작성된 솔직한 후기입니다.' 누리 스레드 구경 가기

2023 데이터드리븐 UX 라이팅 세미나 후기 (ft. 실무사례)

오늘의 포스팅 주제는UX에 관심 있으신 분이라면 모두 알고 계실 "UX 라이팅"입니다. 바로 2023 데이터드리븐 UX 라이팅 with Beusable 세미나 참여 후기입니다! 뷰저블 서포터즈 혜택으로 UX 라이팅 세미나에 초대되었는데요,참여 후기와 함께 UX Writing에 대한 정보를 공유해 보겠습니다:) 2023 데이터드리븐 UX 라이팅 with Beusable 일시: 2023년 4월 27일 목요일 14시~18시장소: 롯데월드타워 SKY31 오디토리움 출입 방법: 롯데월드타워 1층 "East Gate" 뷰저블 행사 데스크에 방문 > 참석 등록 후 출입증 수령 롯데월드타워 스카이31 가는길 날씨가 굉장히 화창했답니다! 잠실역에서 내려 목적지인 롯데월드타워를 향해 가봅니다.1층 East Gate에 뷰저블 행사 데스크가 바로 보이더라고요.이곳에서 참석 등록 후, 출입증 명함을 받을 수 있었어요. 참고로 맞은편에 엔제리너스가 있는데요~ 세미나가 4시간 정도 소요되니 커피 사는 것도 좋겠더라고요!!오디토리움에 음료 반입 가능! 그땐 몰랐습니다.. 딱 맞게 도착해서인지.. 엘리베이터 이용하시는 분이 많았어요!도착층을 미리 누르면 탑승 엘리베이터를 알려줍니다.약간의 인내.. 기다림 후 탑승!! 하니 금방 도착했어요.반가운 뷰저블 세미나 안내판이 기다리고 있네요:) 뷰저블 행사에 빠지지 않는 굿즈!!!이번 세미나에도 어김없이 등장~~정말 센스 있게 준비해 주셔서 항상 감동받아요! 멋진 뷰저블팀.. 그저 빛... 이번 세미나는 특히 질문하시는 분이 많았어요~세미나 내용도 너무 좋지만, 질문하면 굿즈를 마구마구 주시니더 질문하고 싶게 만드는 매력이 있다죠ㅋㅋㅋ 딱 맞춰 도착하니.. 자리들이 가득 찼더라구요?!정말 많은 분들이 관심을 주셨다고 들었는데요, 이번 UX 라이팅 세미나 내용은지난 HCI 학회 발표 내용으로 구성되었다고소개해주셔서 더욱 기대가 되었답니다.주제를 보니 알찬 세미나가 될 것이라는 예감이 마구 들었습니다! < UX 라이팅 세미나 주제 >1. UX 라이팅 with Beusable 포그리트 박태준 대표2. UX 라이팅이 서비스에 미치는 영향 3. UX 라이팅, 실제 사례로 듣는 그 현장의 이야기 4. 금융 서비스의 UX 라이팅 성과 개선 사례 5. 데이터로 분석하는 UX 라이팅 UX 라이팅이 서비스에 미치는 영향 본격 세션 첫 번째로 UX Writing Lab 이춘희 대표님께서전반적인 UX라이팅 원리와 방법론을 소개해주셨어요. 이춘희 대표님은 UX Writing 전문가로탈잉 강의와 브런치 작가로도 활동 중이라고 해요. UX Writing Lab 이춘희 대표님 세션 UX 라이팅은 무엇인가? UX 라이팅의 정의는 이렇습니다. "사용성이나 브랜드 경험을 향상시키기 위해 인터페이스 안에서 사용하는 언어와 언어의 포맷" 결국 UX 라이팅의 목적은서비스 내 사용성이나 브랜드 경험을 향상시키기 위함입니다.인터페이스 안에서 사용하는 언어와 그 포맷을 정의하고,이를 적절하게 사용해 서비스의 UX, BX를 향상할 수 있습니다. 그리고 이를 5가지 업무 영역으로 나눠볼 수 있다고 해요. UX 라이팅의 5가지 업무 영역1. 언어2. 사용성3. 브랜딩4. 전환율5. 일관성 먼저 언어 측면을 이야기하면 아무래도 Writing즉, 글쓰기 영역으로 가독성을 좋게 만드는 업무를 의미합니다. 사용성 측면에서 보면UX영역으로 사용자가 서비스를 쉽게 이해할 수 있게 만들고,브랜딩 영역에서는UX 라이팅으로 친밀도와 일관성을 표현하기도 합니다. 또 전환율 측면에서 각 단계를 최적화시키거나 사용자 가치를 전달하거나, 비즈니스 목표 달성을 돕기도 합니다.만약 이커머스 사업이라면 구매 전환이라는 KPI를 달성하도록 돕는 것입니다. 마지막으로 일관성 측면에서 고객과의 일관된 커뮤니케이션을 통해 신뢰도를 얻는 영역으로 이해할 수 있습니다. 좋은 UX 라이팅이란 뭘까? 전반적인 사용자 경험(UX) 위에 존재하면서5가지 업무 영역의 UX 라이팅을 통해비즈니스 목표 달성을 돕고,사용성을 개선하고, 가독성을 높여갈 수 있습니다. 비즈니스에 기여하는 것이 좋은 UX 라이팅 이라고 할 수 있어요. 개인적으로 이 주제에서 인상 깊은 부분들을 정리해 보았습니다! UX 라이팅과 사용성 사용성에서 중요한 점은 서비스 내에적절한 위치와 타이밍에 문구를 배치하는 것입니다. 이것을 아주 잘하기 위해서는사용자가 서비스에서 마주하는 상황과그 속에서 사용자 심리를 고려한 적절한 타이밍에문구를 디자인할 필요가 있습니다. 서비스 내 단계마다 고객 심리를 이해한 UX 라이팅을 통해다음 단계로 유도하는 역할을 할 수 있습니다. 또, UX 라이팅으로 문제를 방지할 수도 있습니다.사용자가 서비스 사용 중에 발생할 수 있는 문제를 사전에 고지하여 서비스를 이탈하지 않도록 길잡이 역할을 합니다! 따라서 심플하고 가독성 좋은 글로 교정하는 일도 중요하지만,시기 적절히 필요한 위치까지 모두 고려한 UX 라이팅 디자인이 중요하다는 인사이트를 얻었습니다. 브랜딩을 위한 UX 라이팅에서 유의할 점 브랜딩 관점에서 보이스앤톤이라는 개념이 등장하는데요, UX 라이팅 + 브랜딩 = 보이스앤톤 기업이 정의한 브랜딩에 UX 라이팅이 더해지면"보이스앤톤"이 됩니다.보이스앤톤 디자인을 통해 기업의 일관적인 이미지를 줄 수 있고,한 사람과 대화하는 듯한 느낌까지 주는 효과가 있다고 해요. "보이스앤톤 디자인은안전한 부분부터 신중히 접근해야 합니다." 많이 실수하는 부분은 본인만의 브랜딩이 없는 상태에서타 보이스앤톤을 따라 하거나,성급히 진행할 시 역효과가 날 수 있다고 합니다.사용자 입장에서 '왜 친한 척 해?'와 같이 오히려 반감을 살 수 있다는 것! 따라서 안전한 부분에서부터 시작해사용자들의 반응을 관찰하며 신중히 접근하고적용해 나가기를 추천하고 있습니다. chatGPT로 UX 라이팅? chatGPT와 같은 생성 AI가 생활 전반에 많이 활용되고 있습니다.특히 업무 영역에서 활용도가 굉장히 높죠.chatGPT를 이용해 카피라이팅 작업도 가능해진 시대입니다. 생성 AI 시대, UX 라이팅에 어떤 능력이 필요할까? 바로 우리만의 느낌, 기업만의 브랜딩을 기준으로변별하는 능력이 더욱 중요합니다. 적절한 프롬프트를 통해 chatGPT를 활용할 수 있는 능력과UX 라이팅 전략이 더욱 중요해질 것이라고 합니다. UX 관점에서 사용자와 기업 분석 및 전략이 선행되고그것을 기반으로 우리만의 느낌을 살린 UX 라이팅을 할 수 있는 능력이 필요할 것입니다! UX 라이팅,실제 사례로 듣는 그 현장의 이야기 두 번째 세션은 와이어링크에서 기획을 담당하시는박승원 선임연구원님께서 발표해주셨어요! 와이어링크는 현재 UX 라이팅 컨설팅을 진행하고 있고,국내 TMS(text management system)을 개발한 회사입니다.UX 라이팅 가이드라인을 내재화한 서비스를 제공하는 것까지 준비 중이라고 해요. 실제 UX 라이팅을 도입하려면 많은 준비가 필요합니다.회사마다 다른 브랜딩과 메세지, 비전을 가지고 있기 때문인데요,따라서 기업만의 일관적인 UX 라이팅 가이드라인을 만드는 일과이렇게 만든 가이드라인을 적절한 타이밍에 누구나 사용할 수 있도록 만드는 것이 핵심입니다. 기업의 UX 라이팅 문화를 만들고,효과적으로 프로덕트에 반영하는 일이 중요한데이를 시스템화하여 사용할 수 있는 솔루션이라니너무 궁금해지더라고요:) UX 라이팅은 어디서부터 시작할 수 있나요? 콘텐츠 개선부터 시작할 것을 추천! 앞서 이춘희 대표님이 유의할 점으로작은 부분부터 점진적으로 진행할 것을 말해주셨는데,와이어링크에서는 콘텐츠 개선부터 시작하기를 추천합니다. 기존 서비스에 UX 라이팅을 적용할 때 기준은 다음과 같다고 해요. 더 좋은 서비스 < 나쁘지 않은 서비스 기존의 많은 서비스들이 UX 라이팅을 적용하지 못하고 개발되어의외로 맞춤법이나 외래어 표기 등 잘못된 사용이 많다고 합니다. 이 부분이 매우 공감되었어요.실무에서는 화면 설계 단계에서 유저 시나리오상, 정책상데이터 누락을 점검하기도 바쁜데UX 라이팅까지 신경 쓰는 것이 쉽지 않습니다. 또, 언어의 영역이기에..좋은 글에 대한 기준이 없거나 지식이 부족하기도 합니다. UX 라이팅.. 중요한 건 알겠는데 하려니 막막한 상황인 거죠. 결국 타 기업 서비스를 벤치마킹하거나익숙한 언어를 사용하게 되는데문제는 여기에도 잘못된 사용이 많다는 것입니다. 그래서 처음 UX 라이팅을 적용할 때는기존 서비스를 나쁘지 않게 만드는 것부터 시작할 수 있습니다! UX Writing 교정 가이드라인 예시 기존 서비스의 UX 라이팅이 잘 되어있는지체크리스트로 확인해 볼 수 있는데요,특히 자주 보이는 안 좋은 사례를 공유해 주시더라고요! 공유하기 앞서 퀴즈 하나를 내주셨어요. 한번 맞춰보세요~! 이 중 맞는 사용은 무엇일까요? 1. 예 / 아니요2. 네 / 아니오3. 네 / 아니요 과연 정답은!? 바로 1번이었습니다! 예/아니요 입니다. 너무 헷갈렸는데요..!예시처럼 기존 서비스에 잘못된 쓰임이 많다는 것을 알 수 있어요. 또 대표적으로 다이얼로그 메시지도 많은 개선이 필요한데요,여기서는 사용자는 서비스를 목적을 가지고 이용한다는 사실을 기억해야 합니다! 예를 들어,프로세스를 종료할까요?정상적으로 수행되지 않았습니다. (X)화면을 나가면 입력 정보가 삭제돼요.그래도 나가시겠어요? (O)암호화 오류입니다. (X)비밀번호가 일치하지 않습니다. (O) 위 예시와 같이 시스템과 업무를 처리하는 듯한 메세지보다는사용자 입장에서 필요한 메시지를 전달하는 것이 중요합니다. 또, 로딩화면에서 중요한 점은 정확한 로딩 시간 안내와기다리는 동안 소비자가 변화를 트래킹 할 수 있도록계속 상태 문구를 변경하면 좋다고 합니다! 이 세션에서 실제 기업이 가지고 있는 UX 라이팅에 대한 이슈와현업에 UX 라이팅을 어떻게 적용하면 좋을지에 대해알 수 있는 유익한 시간이었습니다:) Wirelink 발표 금융 서비스(신한카드)의UX 라이팅 성과 개선 사례 세 번째로는 신한카드 DX 박광훈 부부장님의 발표입니다.금융서비스에서 실제 UX 라이팅 적용 사례를 공유해 주신 시간! 신한카드에서는 실제 뷰저블을 사용해UX Writing A/B 테스팅 기능으로 가설을 검증하며개선 작업을 하고 계시더라고요! 너무 흥미진진한 생생 후기:) 특히 신한카드는 UX 라이팅 가이드북을 출시할 정도로 진심인 회사이더라고요~! UX Writing? Technical Writing! 신한카드 부부장님은UX 라이팅을 테크니컬 라이팅이다! 라고 정의하십니다. 흔히 아는 카피라이팅 개념과 비교해 알려주신 점이 좋았어요. 카피라이팅 vs UX 라이팅 카피라이팅의 목적은 마케팅 효과를 높이기 위함입니다.사용자 시선을 이끌며 한눈에 들어오고 재미있는 요소가 핵심이죠. UX 라이팅의 목적은 사용성을 높이기 위함입니다사용자 중심으로 어려움 없이 서비스를 이해하고사용할 수 있게 만드는 것이 중요합니다. 금융서비스에서 UX Writing의 목적은? 그기 돈이 되나? 결론적으로 금융 비즈니스의 목적인영업이익을 만드는 것이 제일 중요합니다! 신한카드에서도UX 라이팅을 통해 사용성과 일관성을 높이는 것은 물론비즈니스 목표를 달성하기 위해다양한 가설로 검증을 반복하고 있었어요. CTA 버튼 이름 변경 효과 하나의 예시로 13일간 전체 트래픽의 20%를 대상으로CTA 버튼의 A/B 테스팅을 진행하였다고 하는데요, 기존 버튼 이름 변경으로 클릭률과 전환율을 높일 수 있었다고 해요!사용자의 관심이 전환으로 이어지기까지 시간을0.2s에서 0.1s으로 50% 감소시킨 결과라니.. 대단하죠? 약 350억 규모의 실질적 영업 이익 효과 UX에 진심인 신한카드는 여러 가설 검증 과정을 통해현금 서비스 신청 1,2,최종 단계를 거쳐 신청 완료까지약 5%의 추가 실질적 영업 이익 효과가 있었다고 해요! 뷰저블 UX 라이팅 기능의 최대 이점 일관된 결과물로 얻은 명확한 데이터로조직에 커뮤니케이션하는 것이 가능하다는 장점! 조직 내에서 UX를 하는 사람들에게 가장 중요한 역량은아무래도 설득력 즉, 커뮤니케이션 능력입니다. UX가 점점 일반화가 되고,다양한 직군에서 UX에 대한 이해도가 높아지면서조직 내 시어머니들이 많이 생기게 된다고 하는데이 부분이 너무 공감되더라고요..! ㅋㅋ 이런 상황에서 UX 전문가로서 설득력을 가지기 위해뷰저블 같은 UX 데이터 툴을 사용하면이해관계자를 설득할 수 있는 강력한 도구로 활용 가능! 실제 현업 상황을 이야기해 주시니더욱 공감이 되었던 시간이었습니다:) 데이터로 분석하는 UX 라이팅 마지막으로 포그리트의 UX 리서처이신임지연 팀장님의 세션입니다:) 뷰저블리 서포터즈 발대식에서도뷰저블 기능을 자세히 설명해주셨는데요!!이번 세미나에서도,뷰저블을 통해 UX 라이팅 테스트를 어떻게 진행할 수 있는지와관련 핵심 기능들을 설명해 주시는 유익한 시간이었습니다~~ 협업에서 '좋은 인사이트, 좋은 데이터'란? 실제 고객의 데이터로 얻은 인사이트여러 번 반복 진행될 수 있는 Lean 테스트의 데이터 뷰저블 서포터즈를 하며 항상 느끼고 있는 뷰저블의 장점은쉽게 진짜 고객의 데이터를 얻을 수 있고,쉽게 테스트를 반복할 수 있는 환경을 제공한다는 점입니다. 이렇게 실제 현업의 적용 사례와 함께뷰저블을 이용해 본 기업의 생생한 이야기를 들으니한번 더 뷰저블의 장점을 느낄 수 있었던 시간이었어요! 많은 분들이 이번 세미나를 통해UX 라이팅에 대한 지식과 인사이트를 얻고,실무에 적용해 유의미한 결과를 만들어내는 기회가 될 것 같아요:) 뷰저블 세미나 장소 후기 세미나 후기니만큼 장소 이야기를 안 할 수 없죠!롯데월드타워 SKY31 컨벤션은 너무나 멋진 뷰를 가진 곳..! 세션마다 쉬는 시간이 넉넉히 주어졌는데요렇게 멋진 공간에서 쉴 수도 있고, 뷰를 감상할 수도 있었어요!!또, 연사님께 개인적인 질문을 하시는 분도 보았네요ㅎㅎ 롯데월드타워 SKY31 뷰 뷰저블 UX 라이팅 세미나에 참석 이벤트 마지막으로 간단한 설문조사 참여하고,뷰저블 굿즈도 받을 수 있었답니다 후후 또, 해시태그 이벤트에 참석 후기를 공유하면 추첨을 통해데이터 드리븐 UX 도서를 받을 수 있는 기회도 있다고 해요~! 시작부터 마지막까지 너무 유익한 지식과인사이트를 가득 얻을 수 있었던 시간이었어요:)좋은 기회를 주신 뷰저블 팀에게 감사드리며 포스팅 마치겠습니다! 뷰저블 설문조사 참여 굿즈 * 뷰저블 서포터즈 1기로 제품을 무료로 제공받아 작성된 솔직한 후기입니다.

사용자 중심의 홈페이지로 개선하기 with 뷰저블

지난번 뷰저블에서 추출한 데이터를 바탕으로 홈페이지 디자인을 변경한 후 전후 데이터를 비교해보았는데요. 크게 차이가 나진 않지만 그래도 유의미한 결과를 도출한 것을 볼 수 있었습니다. 지난 1차 데이터 분석에 이어 뷰저블을 활용한 2차 데이터 분석을 진행해보려고 합니다. 수정 전 데이터 분석 *4월 4일부터 4월 10일까지 일주일 동안의 데이터를 분석해보았습니다. 1. 마지막 단락의 높은 클릭수 해당 부분은 신규 유입자를 위한 홈페이지 이용 가이드인데요. 이 부분을 클릭하면 회원가입 방법부터 주문 및 결제방법 등 자세한 사항을 한 눈에 확인할 수 있습니다. 가이드 안내가 있는 단락의 주목도가 16%인 것에 비해 클릭수가 상당히 높으니 많은 이용자가 해당 정보를 필요로 한다는 것을 알 수 있습니다. 2. 급감하는 주목도와 함께 증가하는 이탈률 메인 배너 밑 ‘베스트’ 단락은 1차 때 수정을 진행하였지만, 여전히 주목도가 급감하는 모습을 볼 수 있습니다. 따라서 1차 데이터 분석과는 다른 기준점을 두고 디자인 변경이 필요해 보입니다. 수정사항 1. 사용자의 눈에 잘띄는 이용 가이드 이용자의 편의를 위한 가이드 사항을 누구나 쉽게 볼 수 있게 주목도가 높은 상단으로 배치시켰습니다. 맨 마지막 단락에 작은 글씨로 있었던 이전 디자인에서 메인 배너 밑에 버튼을 위치시켜 클릭하면 해당 내용을 확인할 수 있게 수정하였습니다. 2. 구매건수가 많은 상품을 추가하여 주목도 높이기 지난 1차 데이터 분석에는 해당 단락을 최근 한 달간 구매 건수가 많은 상품 순서대로 배치시켰지만 별다른 효과가 드러나지 않았습니다. 그래서 이번에는 2022년부터 현재까지 구매 건수가 많은 상품 순서대로 배치하여 단락을 수정하여 사용자의 주목도를 높이고자 하였습니다. 수정 후 데이터 분석 *4월 18일부터 4월 24일까지 일주일 동안의 데이터를 분석해보았습니다. 1. 주목도 디자인 수정 후 스크롤 주목도를 분석해보니 수정 전 데이터와 거의 차이가 없는 것으로 보입니다. 수정 전에는 페이지의 50%까지 도달한 사용자 비율이 24.5%였다면 수정 후에는 25%로 0.5%가 증가했습니다. 이용자의 이탈률을 줄이고 스크롤 주목도를 높이기 위해 다른 대안책이 필요해 보입니다. 2. 클릭수 ‘베스트’ 단락을 수정한 후 스크롤 주목도에는 큰 차이가 없었지만 이용자 클릭수는 증가하였습니다. 해당 단락의 클릭수가 증가한만큼 이용자들의 관심도가 증가한 모습을 볼 수 있습니다. 3. 버튼 클릭 새롭게 삽입한 버튼은 메인 페이지에서 클릭 순위 9위, 클릭수 11, 클릭률 2.4%의 데이터를 보이고 있습니다. 많은 사용자들이 해당 버튼을 클릭한 것을 확인할 수 있었습니다. 결론 수정 전 데이터 수정 후 데이터 마지막으로 전반적인 데이터를 정리해보면 디자인 수정 후 전체 방문자 증가와 함께 페이지 뷰가 증가했습니다. 일주일간 평균 이탈률이 48%에서 38%로 크게 감소한 것으로 보아 메인 페이지를 수정한 것이 유의미한 결과를 이루었다고 볼 수 있습니다. 이번 2차 데이터 분석을 통해 홈페이지를 조금 더 유저 친화적인 UI/UX로 수정할 수 있었습니다. 뷰저블을 활용한 데이터 분석과 홈페이지 개선을 지속적으로 실행하고 더 나은 결과를 도출해내도록 할 것입니다. * 뷰저블 서포터즈 1기로 제품을 무료로 제공받아 작성된 솔직한 후기입니다.

UX 스터디 3회차 후기 : 사용자 여정 지도를 활용한 케이스스터디

UX스터디 오프라인 모임​UX 스터디 3회차는 오프라인 모임으로 진행했다.온라인도 좋았지만, 멤버들과 친밀감도 쌓였고 좀 더 자유롭게 토론하듯 진행해도 좋을 것 같아서 강남역 근처 회의실에서 스터디를 진행했다. 온라인으로 벌써 두번이나 만났기에 어색함 없이 모임을 시작했고data driven UX 책 : 5~6장 읽고 발제된 아젠다 5가지 - 1시간 토론실습 3가지 : CTA 버튼 설계, 패스슬롯을 통한 웹 개선, 사용자 여장 지도를 활용한 케이스스터디 - 1시간 진행되었다. 각자 관심 또는 구매한 서비스에 대해서 분석, 발표, 공유하면서, 새로운 서비스를 알게된 시간이라 즐거웠다. 다양한 레퍼런스를 쌓아두면 나중에 실무에서 활용할 수 있는 강력한 무기가 되는 경험을 예전에도 했기에, 하반기에는 케이스스터디 관련하여 모임을 진행해볼까 한다.​6월 3회차 스터디 모임 후기 PART 1. 토론하고 싶은 주제 5가지1) 사이트 운영 목적과 서비스 목적에 대한 관점사이트 운영 목적 (비즈니스 이윤 창출) > 여러가지 서비스 (하부 카테고리)서비스 설명 > 홍보 및 판촉 > 신뢰도 > 자세한 정보 안내에 따라서 KPI 목표 & UXUI 설계 집행2) 사용자 여정 지도에서 과제와 해결방안에 대한 구분점유저 : 터치포인트, 행동, 사용자 기분기업 : 과제, 해결방안 (문제 - 해결)3) 데이터 기반 퍼소나 작성, 페인포인트 도출 경험테스트 실험이 편리한 광고 매체를 통한 경험페이스북 또는 배너 광고 - 소재 제작시 퍼소나 설정에 따라 페인포인트 메시지 테스트 진행 후 디벨롭4) 담당하고 있는 프로덕트/서비스 데이터를 학술 근거에 의해 설계한 경험방향 리서치 (제품의 세부 방향 > 방향성) & 기반 리서치 (고객 의사 결정 기반 > 전략)헤이조이스 UX 리서치 실천 노하우 강의 (김은희님 추천)5) UX writing 공부 방법UX 라이팅 관련 서적 및 아티클 PART 2. 실습 3가지1) CTA 버튼 설계 : 목적, 디자인, 서비스, 기타 개선사항에 대한 논의MR : 뉴스레터 (메일리, 메일침프, 스티비)L 서비스를 이용해볼 수 있도록 '가입 유도' 강조할 것, 메일침프 상세페이지 '전문성' > 레퍼런스 분석해보고 싶다는 생각을 했다.SJ : yes24, 왓챠, 구글 (오늘 뭐볼까)L OTT 서비스 전체에 대한 추천 서비스로 인기, 신규, 추천 콘텐츠 추천 서비스 (OTT 구독, 가격을 한번에 확인할 수 있는 점이 편리하게 느껴짐)HN : OTT 서비스 (넷플릭스, 디즈니플러스, 쿠팡플레이, 티빙, 왓챠)L 상세페이지 전체 목적과 흐름, 그에 어울리는 'CTA' 설계에 대한 분석 예시 2) 패스슬롯을 통한 웹 개선포트리그 > 문화(컬처) 웹사이트 분석 후 개선점 찾기신규 : 재방문자에 비하여 움직임이 많은 이유는 찾고 있는 정보가 많거나 혹은 명확하지 않다고 파악됨 > 프로세스가 이어질 수 있도록 다른 페이지로 연결될 수 있는 '버튼' 삽입재방문 : 신규보다는 움직임이 단조로움 > 상단에 업데이트 된 배너나 버튼 추가하여 다음 페이지로 연결될 수 있도록 개선 3) 사용자 여정 지도를 활용한 케이스스터디HN : 패스오더 (B2C-B2B 카페 온라인 주문 서비스)좋은점- 자체 '앱'개발이 어려운 사장님에게 플랫폼을 이용할 수 있게 한 점이 신선했고 (B2B)- 고객에게는 '쉽고 빠르게' 이용할 수 앱을 구현해 줘서 사용성이 좋음 (B2C)- 자주 이용하는 카페의 사이렌오더 기능으로 사용 중, 또는 신규 카페를 찾을 때 이용개선점- 신규 유입을 쿠폰, 추천하기, 앱푸시로 마케팅 비용을 태워서 진행하고 있는데 너무 자주, 매번 다른 사람 추천이 떠서 불편함 (반감이 생김)- 1차적으로 메인화면 UXUI 개편이 절실해 보임 (원하는 서비스를 찾기 어려움)- 속도와 결제면에서 개발의 기술 디벨롭이 필요해 보임 MR : 앳플리 (측정 데이터 기반 체중계 서비스)좋은점- 대중적인 인바디의 경우 금액이 비싸 일반 사용자의 접근성이 낮은데 비해 저렴한 금액으로 접근성이 높은 편- 쉽고 빠른 연동으로 간편한 측정 가능개선점- 내 기기의 모델을 정확하게 인지하고 있지 않으면 측정시 혼란을 야기함- 디바이스 별 측정을 하기에 모든 디바이스를 총합산한 데이터 파악 불가- 측정시 확인가능했던 리포트 형태를 추후 확인할 수 없음- 측정된 데이터로 기기 판매 이상의 유의미한 수익구조 내는 것이 필요해보임 SJ : 와요 (강아지 시터 서비스)좋은점- 회원가입이 간편하고 애완동물 관련하여 제공되는 서비스가 다양해서 오히려 앱을 다운로드 받고 이용하고 싶은 마음이 더 커졌음. UI가 깔끔한 편- 하단 GNB 메뉴에 [라이브 보기]라는 메뉴가 있고, 해당 메뉴를 선택하면 서비스를 이용 중일 때 실시간으로 강아지의 상태를 확인할 수 있는 기능인 것으로 보임. 신선하고 서비스를 이용하는 사용자들의 니즈를 충족시킨 핵심 기능으로 보임개선점- 서비스 신청 프로세스가 너무 복잡함. 프로세스 자체는 단순하겠으나 입력해야 할 정보가 너무 많음. (정말 급해서 필요한 사람이 아니라면 입력하지 않을 수준의 정보)- 구매 전환이 무척 어려운 서비스일 것 같음. 첫 구매에 대한 혜택이 제공되어야 할 듯 함- ↑ 비교 및 검토란에 기재한 것처럼 입력된 내용이 저장된다는 안내가 필수적으로 제공되어야 사용자가 인내심을 갖고 입력할 것임 -driven data UX 책으로 스터디 모임 운영한지 3개월째.마지막 1회차 모임만 앞두고 있다. 웹개선 및 결과리포트 작성으로 마무리하려고 한다. !뷰저블 서포터즈 1기로 제품을 무료로 제공받아 작성된 솔직한 후기입니다.

CTA 버튼 설계 시 체크리스트 & OTT 서비스 분석 예시

'전환' 목적의 웹페이지 메인 버튼, 어떻게 설계하고 있나요? 웹페이지가 잘 구축된 기업의 메인 페이지를 참고하여, 감에 의존하여 기획하지 않으신가요? 프로모션 기획자로 초창기에 일할 때 제가 그랬거든요.메인 페이지 어디 위치? 어떤 색상과 모양? 어떤 워딩으로? 클릭 시 이벤트 영역의 어디로 이동할 건지? 다양한 고민을 했는데요. © 뷰저블 l 디바이스별 클릭 전환 확인 후 페이지 개선 페이지를 기획, 분석하면서 좀 더 다양한 테스트를 하면서 저만의 설계 공식을 쌓아가는 중입니다.Data Driven UX 스터디 6월 노션 가이드 준비 중, 효과적인 CTA (Click to Action) 설계를 위한 체크리스트 10가지에 대한 예시가 있어서 참고하시면 좋을 것 같아 공유합니다. 홈페이지, 광고 외에도 콘텐츠 만들 때 '전환' 목적으로 버튼 설계할 때 참고해 보세요!효과적인 CTA 버튼 설계 시체크리스트 10 목적, 디자인, 서비스 기획적인 3가지 요소로 나누어 확인해 보세요! [목적]1) 서비스 또는 웹 사이트의 목적? 운영 목적을 확인 > 서비스 목적을 명확히 한 뒤 설계 '행동' 촉구 유도 필요2) 사용자가 얻을 수 있는 가치가 명확한가? 사용자의 이익 - 당연한 기대 심리를 활용 [디자인]3) 사용자의 시선을 끄는 디자인인가? 클릭이 가능한 디자인, 여백을 활용하기4) CTA 버튼 위치가 적절한가? 피츠의 법칙에 따라 버튼 크기가 크고 가까이 있을수록 편의성이 올라감5) 선택할 수 있는 버튼이 너무 많지 않은가? 더 적은 선택지를 주고 쉽게 선택할 수 있게 함6) Average Fold 상단/하단에 있는가? 페이지에서 제공하는 상품과 서비스 난이도에 따라 위치 검토 [서비스 기획]7) 행동을 촉구하는 구어체 문구인가? 희소성 (긴장감, 긴박감)8) 1인칭 시점에서 소 구하는가? 1~2인칭의 당신, 나, 너가 공감이 더 잘됨9) 프로세스가 이어지는 느낌을 줄 수 있는가? 이어진다는 암시를 계속 줄 것10) SEO를 실행하기 위해 마케터와 협업이 가능한가? 검색엔진최적화 작성 시 유의 CTA 버튼 설계 시 10가지 체크리스트를 고려해 설계한 후, 어떤 경우에 '전환수 or 전환율'이 높은지 테스트와 분석을 거쳐서 최적화된 설계를 만들어가면 됩니다. 책 본문에도 9가지 예시가 있는데 이미지와 해석이 같이 설명되어 있어서 확인 꼭 해보세요. 본문에 넷플릭스 예시가 있어서, 경쟁사 페이지 확인하던 중 디즈니, 쿠팡플레이, 티빙, 왓챠 5개 페이지를 비교해 보면 좋겠다 싶어서 해당 기업의 CTA 버튼을 잘한 점, 개선점을 작성 및 비교해 보려고 합니다. * 전문 서비스 기획자가 아니기 때문에 사용하는 '워딩, 단어'가 명확하지 않을 수 있습니다. 1) 넷플릭스 https://www.netflix.com/kr/© 넷플릭스 메인 좌측 가운데 'CTA' * 목적 : 신규 구독자를 늘리기 위해서 [이메일 주소 - 시작하기 >]' 설계해 직관적이다. * 디자인 : 메인 상단 좌측, 가장 잘 보이는 영역에 [빨간색], [네모 박스]로 디자인하여 메인 브랜드 컬러와도 잘 어울리고 눈에 띈다. * 서비스 : 메인 상단 - 하단 푸터 위에 동일한 버튼을 두 번 설계하여 가입을 놓치지 않게 구성한 점은 좋았으나 워딩을 다르게 바꿔보는 테스트를 해봐도 좋지 않을까 싶다. © 넷플릭스 푸터 위 'CTA'* 기타 의견 : [메인 - 본문 (특징4) - 자주 묻는 질문 - 푸터] 구성으로 심플하지만, 다른 OTT 서비스와 차별점을 내세우지 않아서 아쉽다. 본문에 버튼을 넣어 어떤 콘텐츠를 볼 수 있는지 팝업창 혹은 연결 페이지로 이동하게 만들어서 전환하게 만드는 방법으로 개선하면 좋을 것 같다.  2) 디즈니 플러스 https://www.disneyplus.com/ko-kr© 디즈니 플러스 메인 좌측 가운데 'CTA' * 목적 : 신규 구독자를 늘리기 위해서 [이메일 주소 - 시작하기 >]' 설계해 직관적이다. (넷플릭스와 동일)다른 점이 있다면, 멤버십 가격을 기재해 두었고 '무료'라는 말이 없어서 가입을 망설이게 된다. * 디자인 : 메인 상단 좌측, 가장 잘 보이는 영역에 [파란색], 이메일과 연결되어 디자인. 메인 브랜드 컬러와도 잘 어울리고 눈에 띈다. * 서비스 : 메인 바로 밑에 4가지 특징, 특징을 설명하는 3가지 본문 설명, 콘텐츠, 자주 묻는 질문 구성으로 되어있다. 메인 바로 밑에 이미지 없이 겹치는 내용은 삭제해도 좋을 것 같다. 본문은 마찬가지로 이미지로 되어있고 클릭 요소는 없다. © 디즈니 플러스 우측 상단 '지금 가입' * 기타 의견 : 우측 상단에 '지금 가입'이라는 탭이 메인 미틍로 내려가면 생기는데 잘 눈에 띄지는 않는 것 같다. 차라리 하단 푸터 배너를 설치하여 전환을 유도하는 쪽으로 버튼을 크게 디자인하는 게 어떨까라는 생각이 들었다. 3) 쿠팡플레이 https://www.coupangplay.com© 쿠팡플레이 메인 좌측 가운데 'CTA' * 목적 : 메인 상단에 '첫달 무료로 시작하기' 무료한 버튼 1개만 있다. 그아래 와우회원 로그인 (와우는 무료)이라 순서상 '신규 회원 유치'가 중요도가 더 중요한 요소로 보인다. * 디자인 : 버튼 'hover'시, 색상이 바뀌거나 버튼이 움직이는 기능이 없어서 행동이 촉구되지 않는다. 좀 심심한 느낌이랄까? 그리고 브랜드 컬러가 빨강(쿠팡), 파랑(쿠팡플레이) 서로 달라 브랜드 컬러가 인지가 안된다. 디즈니의 파란색이 연상된다. * 서비스 : 쿠팡플레이 시리즈를 가장 내세웠고, '이용하면 좋은점' 4가지 이유를 짧고 명확하게 기재 했다. 콘텐츠는 오픈 및 연결하지 않았다. 쿠플 시리즈 중 인기 있었던 콘텐츠를 움직이는 영역으로 더 많이 보여줬다면 더 좋을 것 같다. * 기타 의견 : 하단까지 내려가면 어떤 '버튼'도 없다. 상단/하단 푸터 배너로 '신청하기'를 유도하면 좋을 것 같다. 4) 티빙 https://www.tving.com/© 티빙 메인 가운데 영역에 버튼* 목적 : '티빙을 플레이'하세요는 가입보다는 신규/기존 구분 없이 로그인 하는 느낌의 워딩이라 수정하면 좋을 것 같다. 그리고 버튼 클릭 계정 선택이 너무 많다. 더 적은 선택지를 주고 2~3개 정도로 줄이는 게 어떨지. * 디자인 : 콘텐츠 영역에 버튼은 없지만, 영상이나 이미지 자동 롤링으로 다양한 콘텐츠를 보여주는 점은 5개 회사 중 가장 잘했다고 느껴진다 (개인적인 취향) 5월 라이브 중인 콘텐츠, 실제 티비나 모바일에서 시청하는 듯한 레이아웃 디자인에 영상도 끊기지 않고 잘 나와서 개발 분야가 전문적으로 보인다.* 서비스 : '무료, 체험, 가입' 등 행동을 취할 수 있는 워딩이 좀 더 명확하면 가장 마음에 드는 페이지였다. * 기타 의견 : 다양한 콘텐츠를 볼 수 있는 이점이 있으나, 다양한 쿠폰 프로모션을 하고 있어서 인지 쿠폰 등록, 가입 절차가 복잡해 보여서 신규 유입자를 쿠폰 유무에 따라 나누는 게 어떨지 고민하게 되는 부분이다. 5) 왓챠 https://watcha.com/ * 목적 : '신규 가입' 시키기 위해 본문 5가지 영역 모두 동일한 위치에 '버튼'을 넣었다. '2주 무료 이용 시작', 새로고침하면 이미지가 계속 바뀐다. 가장 심플하긴 하다. * 디자인 : 버튼 'hover'시, 색상이 바뀌거나 버튼이 움직이는 기능이 없다. '손가락'은 나왔다 안나왔다 한다. * 서비스 : 어떤 영역에서 효율이 잘 나올지 버튼 영역의 텍스트를 바꾸어 테스트해보면 좋을 것 같다. 원하는 데이터를 추출하려면 해당 영역은 스터디가 필요하다. 퍼포먼스 마케터가 있어서 세팅되어 있지만 유의미한 인사이트를 뽑아내기 위해서 내가 직접 확인해야 한다.​웹페이지 개선1) 스크롤 뎁스 도달률 < 이탈률, 체류시간 검토2) 클릭률 < 클릭수로 고객 니즈 파악, 디바이스(PC/M) 클릭수 비교 후 UXUI 개선3) 전환 페이지 < 이탈하는 페이지와 연관성 확인​중점으로 보는 데이터를 주차별로 정리해 가설을 세우고 결과를 확인해보면 된다. 프로모션은 2주 간격으로 업데이트하면서 진행하고, 효율이 나빠지지 않게 유지하면서 진행하며, 다음 달에 성과 측정 시 어떤 유의미한 값을 얻을지 지속적으로 테스트하는 과정으로 웹페이지를 개선할 수 있다.​유효 전환1) 전환 < 실제 진성 유저가 맞는지 파악2) 진성 유저의 니즈 파악L 유입 경로, 전환 소재, 신청한 니즈 등L 관련 핏에 맞게 광고, 매체, 프로모션 개선 위에서 소개했던 10가지 체크리스트를 웹페이지 버튼 전반에 적용하여, 테스트 > 실행 > 결과 > 반영 > 테스트의 과정을 거치면서 개선 효과를 보셨으면 좋겠다. !뷰저블 서포터즈 1기로 제품을 무료로 제공받아 작성된 솔직한 후기입니다.

2023 데이터 드리븐 UX 라이팅 세미나 후기/요약

다음 세개의 팝업 중, 어떤게 옳은 것일까? (*본문내용은 동일) 정답은01번! 최근에 회사의 제품을 개선하는 과정에서, 사용자들이 버튼 내 텍스트의 의미를잘 이해하지 못했다는 걸 UT를 통해 알 수 있었고, 결국 그것은 ‘그 버튼을 누르는것이 주저된다’ 로 이어졌다.특정 단어를 보고 사용자가 이게 무슨뜻이지? 라고 멈칫하는 부분을 개선해서 해당 버튼의 전환율을 올리고자했다. 그런 상황에 마침 운이좋게도 뷰저블 서포터즈에서 기회를 마련해주어이번 목요일에 UX Writing에 전문가들이 인사이트를 공유하는 세미나에 참석할 수 있었다.그 내용을 간단하게 요약해서 공유하고자 한다. 들어가며, 좋은 UX 라이팅이란 무엇일까?사용자 경험을 기반으로, 언어나 사용성을 고려하여 전환율 / 이해도 / 가독성을 올릴 수 있는게 좋은 UX 라이팅이다. 전환이 잘 되는 카피의 기본 원칙1. 짧고 쉽고 유용하게 사용자는 일상에서 실제로 사용하는 용어일수록, 더 부담없이 받아들인다. ex) 구글 부킹에서 [예약하기] 라는 워딩이 부담스럽고, 일상적이지 않아서 [빈 방 찾기] 로 변경했을 때, 전환율이 17%정도 상승한 사례에서 볼 수 있듯 사용자의 일상에 더 익숙한 용어에 대한 고민을 해야한다. 2. 가치 + 적합성 고려하기 중요한 라이팅을 쓰기 전, 고민해야하는 포인트는이 버튼을 클릭하는 사용자의 동기가 무엇인가?이 버튼을 클릭해서 사용자가 얻는 것이 무엇인가? Session< 1. UX라이팅, 실제 사례로 듣는 현장이야기 : Wirelink Leader > < 2. 왜 UX 라이팅을 개선해야하는가? - 신한카드 DX 박광훈 부부장 > ? UX 라이팅을 개선해서 우리 서비스를 더 좋게 만든다? 보다는 우선 '나쁘지 않게!'만들기 부터 시작하자 금융 서비스를 예로, 흔하게 개선할 수 있는 UX라이팅 사례 짧고 쉽고 헷갈리지 않게 (말 줄이기, 더 명확하게, 혼란없애기!)결제를 취소하시겠어요? [확인/취소] > [예 / 아니요]문자메시지 알림서비스를 신청하시겠어요? [신청/비신청] > [신청 / 신청안함] 혹은 [네,할래요 / 다음에] 가치 + 적합성 고려하기 (사용자가 이걸 하고자하는 이유, 얻을 수 있는 가치고려)이벤트, 간편결제 마다 스페셜룰렛 기회까지! [스페셜룰렛 하러가기] > [최대 1만 포인트 받기]카드 혜택 및 실적에 관한 내용 확인? [카드실적 세부확인] > [내 카드혜택 보러가기]아래 예시와 같은 상황, 당연하게도 이상한 상황이고 지양해야한다고 생각하겠지만 실제로 우리 서비스를 돌아보면 사용자입장에서는 굉장히 어렵게 쓰여진 라이팅들이 많다. 카드 신청 중에 종료버튼을 클릭한 경우.기존) 진행 중인 프로세스를 종료할까요? 종료 시 정보가 삭제돼요 개선) 화면을 나가면 입력한 정보가 삭제돼요, 카드 신청을 그만두시겠어요? 신규 카드발급 상황에서, 카드를 배송받을 정보란을 입력하지 않은 경우기존) 카드 수령지 입력이 정상적으로 수행이 안됐습니다 개선) 카드 받을 곳을 입력해 주세요. 사용자가 멈칫하고, 생각해서 이탈하는 부분을 최소화시켜야한다.끊임없이, 사용자의 입장에서 생각하라!“고객의 입장에서 생각하자”“고객이 이 단계에서 원하는게 뭐지?””고객이 이 단계에서 얻고자하는게 뭐지?” UX라이팅을 잘 하고있는 서비스가 ‘토스’지만, 모든 서비스가 ‘와 토스 같다’면 좋은 건가? No우리 서비스나 브랜드를 분석해서 비전/미션/핵심가치를 정의하고,사용자에게 전달하고자하는 것들을 워딩에 담아낼 수 있도록 노력해야함. 모든게 그렇지만, UX 라이팅에 정답은 없다.어떤 혜택을 받을 수 있는지 미리 찾아뒀어요 !받을 수 있는 혜택 확인하기두 문장 다 말이된다. 어떤 보이스톤으로 일관되게 서비스에 적용할 건지 정하면 되는 것이다. 디자인 처럼 취향이나 개개인의 주관이 담길 수 있는 부분은더더욱 기준이 필요하다.한 화면에 들어가는 버튼에도 A, B, C, D 의견이 나올 수 있다. 다 틀린말도 아닐 수도 있고그럴 때 서비스에서 정해둔 방향성 (가치)가 없다면 매번 흔들리고, 목소리가 강한사람 의견에만 결정되는 상황 반복 ‘단순한 것이 가장 직관적이고‘익숙한 것이 가장 편리하다’‘쉬운 것이 가장 좋은 혜택이다’카피라이팅과 UX라이팅의 차이?카피라이팅 : 재미 한눈에 들어오는 마케팅효과를 높이는 문구UX라이팅 : 어려움없이 단번에 이해할 수 있는 문구 현재 신한카드에서 진행하고있는 실무사례중 1개가설 : 사용자 친화적 용어 사용이 전환율에 영향이 있을까?뷰저블을 통한 버튼 클릭율 Conversion Rate로 체킹 > 약 1%의 상승이 일어남을 확인(다른 변수요소 통제 후 실험)가설 : ‘-하기’ 레이블이 전환율 상승에 진짜 영향을 줄까?실제로 데이터상 거의 차이가 없었다. (버튼 내 텍스트 어미의 차이가 다른 영향을 가져올 순 있지만, 전환율에는 영향이 없었다.) 마치며, 현재 서비스에서 UX 라이팅 개선을 위해, 어떤 카피를 바꾸지? 고민중이라면우선순위로는 Clickable한 요소와, 클릭율이 높은 곳을 변경해보길 추천한다. * 뷰저블 서포터즈 1기로 제품을 무료로 제공받아 작성된 솔직한 후기입니다.