피부과 홈페이지를 열어 본 환자분들이 가장 먼저 하는 일이 뭘까요. 저는 늘 "가격부터 찾는다"고 대답해요. 시술 이름은 낯설고, 어떤 걸 받아야 할지도 모르겠고, 일단 얼마인지부터 알고 싶은 마음이요. 셀린의원 수원점 홈페이지는 바로 그 마음에서 출발한 프로젝트였어요.
이번 글에서는 이 홈페이지가 어떤 순서로 만들어졌는지, 그리고 왜 예약 방식을 장바구니로 바꾸었는지 제작 현장의 이야기를 차분히 들려드릴게요.
작업을 시작하기 전에 무엇을 먼저 했을까요?
본격적인 디자인에 들어가기 전에, 저희는 제안 영상을 직접 만들어 병원과 공유했어요. 기존 홈페이지를 진단한 내용, 앞으로의 작업 방식과 방향, 제작 방안을 영상 한 편에 담은 거예요.
문서로 된 제안서는 바쁜 원장님이 끝까지 읽기 어려워요. 영상으로 보면 "아, 이런 흐름으로 바뀌는구나" 하고 한 번에 그려지거든요. 이 단계에서 병원과 제작팀의 그림이 맞춰지면, 이후 시안 수정이 훨씬 줄어들어요.
검색 쪽도 이때 함께 잡았어요. 웹 표준 규약을 지켜 사이트를 짜면 검색 결과에서 홈페이지와 정보를 바로 찾을 수 있어요. 환자분이 검색창에서 길을 잃지 않고 곧장 병원 홈페이지로 들어와 필요한 정보를 찾도록 돕는 길잡이 역할이에요.
진단 과정에서 특히 꼼꼼히 본 건 기존 홈페이지의 예약 동선이었어요. 몇 번을 눌러야 예약이 끝나는지, 가격 정보는 어디에 숨어 있는지, 모바일에서 버튼이 손가락에 잘 닿는지요. 이 진단 결과가 뒤에서 말씀드릴 장바구니 예약의 출발점이 되었어요. 진단은 결국 "지금 무엇이 불편한가"를 병원과 같은 눈으로 보는 일이에요.
메인 화면의 첫인상은 어떻게 만들었을까요?
뷰티클리닉은 공간의 분위기가 곧 신뢰예요. 그래서 메인에는 병원 인테리어 영상을 넣었어요. 이 영상은 기획부터 촬영, 제작까지 제작팀이 직접 맡았어요. 깔끔하고 전문적인 공간을 한눈에 보여주면, 처음 방문한 분도 "한번 가 보고 싶다"는 마음이 생기기 쉬워요.
메인 아래쪽에는 셀린의원의 특화 시술을 슬라이드로 배치했어요. 맑은 이미지와 부드러운 애니메이션으로 시술을 하나씩 넘겨 볼 수 있게 했고요.
색은 병원의 대표색인 분홍을 중심에 두었어요.
- 분홍 그라데이션을 메인 페이지의 포인트로 사용했어요.
- 밝은 표정의 모델 이미지와 함께 써서 자신감 있는 느낌을 더했어요.
- 인기 시술을 모은 메뉴에서 시술 내용과 예약 가능일을 바로 확인할 수 있게 했어요.
시술 안내와 가격은 어떻게 정리했을까요?
시술 안내와 가격 페이지는 들어가자마자 원하는 정보가 보이도록 직관적으로 구성했어요. 원하는 시술을 누르면 종류와 가격이 바로 나와요.
목록 아래에는 Q&A를 두었어요. 상담 전화에서 자주 반복되는 질문을 미리 풀어 두면, 환자분은 궁금증을 덜고 병원은 같은 답을 반복하는 시간을 줄일 수 있어요. 저희가 콘텐츠를 정리할 때 늘 지키는 원칙은 불필요한 정보는 줄이고 필요한 정보는 짧게 보여주는 거예요.
왜 예약을 장바구니 방식으로 바꾸었을까요?
이 홈페이지에서 가장 공을 들인 부분이 장바구니 예약이에요. 날짜와 시간부터 고르는 기존 예약 방식은 피부과와 잘 맞지 않는 경우가 많아요. 환자분은 보통 "이 시술과 저 시술을 같이 받고 싶다"에서 시작하거든요.
그래서 순서를 바꾸었어요. 원하는 시술을 고르고 예약을 누르면 그 시술이 장바구니에 담겨요. 장바구니를 열면 담아 둔 시술 내역이 보이고, 예약자 정보와 날짜, 시간, 요청사항을 적은 뒤 예약 내용을 확인할 수 있어요. 고른 시술의 합계도 한 화면에서 바로 보이니, 쇼핑하듯 편하게 예약할 수 있어요.
병원 쪽에도 좋은 점이 있었어요. 예약이 들어올 때 어떤 시술을 함께 원하는지가 처음부터 정리되어 오니, 상담과 일정 조율이 한결 수월해져요. 전화로 시술 이름을 하나씩 다시 확인하던 시간이 줄어드는 거예요.
물론 장바구니가 모든 병원에 맞는 정답은 아니에요. 시술 종류가 적거나 상담 위주로 진행하는 병원이라면 간단한 상담 신청이 더 어울릴 수 있어요. 기능은 병원의 진료 방식에 맞춰 고르는 것이고, 셀린의원처럼 여러 시술을 조합해 받는 환자가 많을 때 장바구니가 특히 힘을 발휘해요.
이 구조는 PC와 모바일 모두에서 같은 흐름으로 움직이도록 반응형으로 만들었어요. 병원 홈페이지 제작에서 기능을 고를 때, 예약 동선은 꼭 실제 휴대폰으로 눌러 보며 정하시길 권해요.
이 사례에서 가져갈 수 있는 것은 무엇일까요?
셀린의원 수원점 작업은 "환자가 먼저 묻는 것부터 보여준다"는 원칙을 화면 순서로 옮긴 과정이었어요. 크로스디자인랩이 지금도 피부과 프로젝트를 시작할 때 먼저 확인하는 것도 같아요. 환자가 어떤 순서로 정보를 찾는지, 그 순서대로 화면이 놓여 있는지요.
지금 운영 중인 홈페이지가 있다면, 휴대폰으로 시술 하나를 골라 예약까지 가 보세요. 몇 번을 눌러야 끝나는지, 중간에 가격을 다시 찾아야 하는지 살펴보면 개선할 지점이 보일 거예요. 혼자 판단하기 어려우시면 상담 신청으로 편하게 물어봐 주셔도 좋아요.
