오진수의 작업실
 · 포트폴리오

조회수 50% 올린 상세페이지 디자인 리뉴얼 사례

접속하자마자 보이는 위치에 연관 콘텐츠 섹션 추가하기

홈페이지 리뉴얼이라고 하면 대체로 색깔 바꾸고, 글자 크기 손보고, 버튼 몇 개 옮기는 정도로 끝나는 경우가 많죠. 그런데 이번엔 조금 달랐습니다. "어떻게 하면 방문자가 떠나지 않고 더 둘러보게 만들까?"를 고민하다가, 디자인이 아니라 유저 플로우를 건드렸습니다. 접속하자마자 보이는 위치에 연관 콘텐츠 섹션을 새로 추가한 결과, 열흘 만에 조회수가 50% 올랐습니다. 단순히 예쁘게 꾸미는 게 아니라, 사용자 시선의 동선을 바꾼 것이 핵심이었습니다.

연관 콘텐츠 섹션 끌어올리기

Screenshot 2025-10-10 at 11.48.11 PM.png

리뉴얼한 상세페이지입니다. 보시다시피 본문 우측에 연관 콘텐츠 섹션을 추가했습니다. "#사무실 인테리어"라고 표시된 부분입니다. 어찌보면 사소한 변경이라고 느껴질 수도 있는데, 실제 효과는 꽤 컸습니다.

Screenshot 2024-04-29 at 3.55.45 PM (1).png

이건 기존 상세페이지입니다. 새로 연관 콘텐츠 섹션을 추가한 위치는 원래 평면도가 있던 자리였습니다.

상세페이지 개선 동기

상세페이지를 바꾼 이유는, 고객 입장에서 홈페이지 서비스 이용 흐름을 시뮬레이션하다가 문제점을 발견했기 때문입니다.

sdd.png


굿테리어 홈페이지는 키워드 검색을 통해 곧장 포트폴리오 상세 페이지로 들어오는 유입 수가 많습니다. 그러한 탓에 혹시나 접속한 페이지에서 보여주는 내용이 마음에 들지 않는다면 곧바로 사이트를 떠날 수 있다고 생각했습니다.

Screenshot 2024-04-29 at 3.55.58 PM (1).png

사실 스크롤을 맨 아래로 내리면 이미 이렇게 연관 콘텐츠를 보여주는 섹션이 있었습니다. 하지만 첫머리부터 페이지 내용이 마음에 들지 않는 사용자는 연관 콘텐츠 섹션까지 스크롤을 내리기도 전에 이탈할 것이라고 생각했습니다.


그래서 페이지에 접속하자마자 보이는 위치연관 콘텐츠를 보여줌으로써 접속한 페이지 내용이 마음에 들지 않더라도 자연스럽게 다른 콘텐츠를 찾아볼수 있도록 유도했습니다. 실제로 마음에 드는 콘텐츠가 다른 페이지에 있을 수도 있으니까 말입니다.

개선 결과


물론 위치가 본문 오른쪽 편이라서 모바일 반응형 웹에서는 보이지 않습니다. 모바일 화면을 위한 추가 조치가 필요하다고 생합니다. 그렇지만 현재 홈페이지 PC/모바일 이용 비율은 PC가 2:1쯤이라서 우선 PC 버전을 적용했습니다.

급상승.png

Google Analytics 데이터입니다. 열흘 전 쯤에 적용했는데, 그 결과 예상대로 홈페이지 조회수가 50% 상승한 통계를 볼 수 있었습니다. 간단한 조치로도, 큰 성과를 거두었다는 점에서 효과적인 작업이었습니다.

좋은 웹 디자인이란?

이번 리뉴얼은 거창한 기능이나 화려한 디자인 없이도, 사용자의 행동 패턴을 이해하면 충분히 큰 변화를 만들 수 있다는 사실을 보여줍니다. 페이지의 첫인상과 시선의 흐름을 바꾸는 것만으로도 사이트 체류 시간이 늘고, 조회수가 확실히 달라집니다. 앞으로는 모바일 화면에서도 같은 경험을 줄 수 있도록 보완할 예정입니다. 결국 좋은 웹 디자인이란 보기 좋은 화면이 아니라, 사용자가 자연스럽게 머무는 이유를 만드는 것임을 다시 한 번 확인하는 사례였습니다.

프로필 이미지

댓글

포트폴리오 카테고리 다른 글