지방흡입을 전문으로 하는 성형외과 의원 홈페이지입니다. 의원 소개와 시술 안내에서 그치지 않고, 방문자가 상담을 신청하고 시술 전후 사진을 확인하고 이벤트에 참여하는 흐름까지 한 사이트 안에서 이어지도록 구성했습니다. 콘텐츠가 지속적으로 업데이트되는 운영 중심의 사이트인 만큼, 관리자가 직접 다룰 수 있는 기능 구조를 함께 갖췄습니다.
프로젝트 구성 방식
역할을 나눠 진행한 프로젝트입니다. 디자인 시안, 텍스트, 이미지, 다국어 콘텐츠는 고객사에서 제공했고, 그 디자인을 웹에 구현하고 기능을 개발하는 작업을 담당했습니다.
디자인 파일을 받아 화면을 구현하는 방식이기 때문에, 시안과 실제 웹 화면이 얼마나 가깝게 맞아 떨어지는지가 중요합니다. 글꼴, 색상, 간격을 스타일 가이드 기준으로 일관되게 적용했고, 모바일부터 태블릿, PC까지 화면 크기별로 레이아웃이 자연스럽게 이어지도록 개발했습니다. 이미지는 필요한 시점에 불러오는 방식으로 처리해 초기 페이지 속도를 줄였습니다.
주요 기능 구성
상담 신청과 설문 이벤트
상담 신청 기능은 방문자가 이름, 연락처, 희망 상담 내용을 입력하고 개인정보 제공에 동의하는 구조입니다. 신청이 접수되면 관리자에게 이메일로 알림이 자동 발송되고, 신청 내역은 관리자 페이지에서 확인할 수 있습니다.
설문 이벤트는 관심 있는 시술 항목, 성별과 연령대, 병원 방문 경험, 원하는 혜택을 선택하는 방식으로 구성했습니다. 설문을 완료한 방문자에게는 쿠폰이 문자 또는 이메일로 자동 발송됩니다. 응답 데이터는 관리자 페이지에서 통계로 확인할 수 있어, 어떤 시술에 관심이 많은지 방문자 성향을 파악하는 데 활용할 수 있습니다.
비포애프터 갤러리
시술 전후 사진을 올리고 시술 종류나 부위별로 분류해 볼 수 있는 갤러리입니다. 방문자는 관심 있는 항목으로 필터를 걸어 원하는 사진만 모아볼 수 있습니다.
사진 추가, 수정, 삭제는 관리자 페이지에서 직접 처리합니다. 새 사진을 올리거나 분류를 바꿀 때 코드를 수정하지 않아도 됩니다.
게시판 시스템
공지사항, 고객 후기, Q&A 세 가지 게시판을 개발했습니다. 공지사항은 병원 소식과 이벤트 안내를 올리는 영역이고, 고객 후기는 방문자가 직접 글을 남길 수 있는 구조입니다. Q&A는 고객이 질문을 남기면 관리자가 답변하는 방식이며, 자주 올라오는 질문은 FAQ로 자동 분류됩니다.
관리자 기능
직접 운영할 수 있는 구조
상담 신청 내역, 설문 통계, 갤러리, 게시판을 모두 관리자 페이지에서 다룰 수 있습니다. 콘텐츠를 추가하거나 수정할 때 개발자에게 요청할 필요가 없고, 이벤트가 바뀌어도 관리자 페이지에서 직접 업데이트하면 사이트에 즉시 반영됩니다.
상담 내역과 설문 데이터가 한 관리자 페이지 안에서 정리되기 때문에, 자료를 따로 취합하거나 정리하는 수고를 줄일 수 있습니다.
보안 처리
상담 신청과 설문 폼에는 봇의 자동 접근을 막는 캡차(CAPTCHA)를 적용했습니다. 방문자가 입력하는 개인정보는 암호화해 보호하고, 접속 구간 전체에 HTTPS(자물쇠 표시 보안 접속)를 적용했습니다.
반응형 처리
모바일, 태블릿, PC 세 가지 화면 크기에 맞게 레이아웃이 자동으로 바뀌는 반응형 구조를 적용했습니다. 갤러리와 게시판은 화면 너비에 따라 배열이 달라지고, 상담 신청 폼은 스마트폰에서도 입력하기 편한 크기로 구성됩니다. 시술 안내, 상담 신청, 비포애프터 갤러리, 고객 후기가 하나의 흐름 안에서 연결되도록 정보 구조를 정리해, 방문자가 관심 있는 시술에서 상담 신청까지 자연스럽게 이어지도록 했습니다.
