한의원 홈페이지 제작, 청림한의원 '퇴근 후 원장 직접 진료'를 밤의 화면으로 만든 과정
요약 직장인 통증 한의원 홈페이지 제작에서 저희가 붙잡은 장면은 퇴근길 지하철에서 "지금 가도 되나"를 검색하는 순간이었습니다. 청림한의원은 블러썸팩토리가 서울 여의도의 가상 야간 진료 한의원을 정하고, 실제 의뢰처럼 원장님의 강점부터 세워 만든 포트폴리오 홈페이지입니다. 램프가 켜지는 인트로, 직접 눌러 보는 경혈 지도, 서울 시각으로 움직이는 황동 시계까지 어떤 판단으로 만들었는지 디자이너가 직접 정리했습니다.
여의도의 가상 야간 한의원, 강점부터 정했습니다
청림한의원은 실제 고객이 아니라 저희가 포트폴리오용으로 만든 가상의 한의원입니다. 서울 여의도에서 목·어깨·허리 같은 직장인 통증과 추나를 보는 한의원이라고 정하고, 실제 의뢰처럼 이 병원을 찾는 사람이 홈페이지를 여는 순간부터 떠올렸습니다.
하루 종일 모니터 앞에서 버틴 직장인은 낮에는 병원에 갈 수 없습니다. 퇴근길 지하철에서 목을 주무르며 "지금 가도 받아 주나", "밤에 가면 원장님 말고 다른 사람이 치료하는 거 아닐까"를 검색합니다. 야간 진료 자체는 드물지 않지만, 밤에도 원장님이 직접 한다는 약속은 드뭅니다.
그래서 강점 한 문장을 평일 밤 9시까지, 퇴근 후에도 대표원장이 추나와 침을 처음부터 끝까지 직접 한다로 정했습니다. 헤드라인은 "퇴근 후에도, 원장이 직접 풉니다."입니다. 시간과 사람, 두 가지 걱정을 한 문장으로 답합니다. 원장님의 강점에서 디자인을 시작하는 이유는 병원 브랜딩, 원장님에서 시작해야 하는 이유에 자세히 적어 두었습니다.
첫 화면: 어둠 속에서 램프 세 개가 켜질 때
사이트를 열면 어두운 화면에 황동 펜던트 램프 세 개가 깜빡이며 하나씩 켜지고, 그 빛 아래로 CHEONGRIM 로고가 드러납니다. '밤에 불을 켜는 한의원'이라는 정체성을 3초 안에 보여 주는 장면입니다. 낮의 한의원이 아니라 퇴근 후의 한의원이라는 것을 설명보다 먼저 느끼게 하고 싶었습니다.
첫 화면에는 여의도 야경을 등지고 목을 짚은 직장인 사진 위로 "퇴근 후에도, 원장이 직접 풉니다."를 크게 올렸습니다. 사진 위에서는 따뜻한 빛 원이 천천히 떠다니며 비추고, 마우스를 따라 움직입니다. 오른쪽 아래에는 서울 시각으로 움직이는 작은 시계와 '진료 중 · 21:00까지' 상태를 두었습니다. 버튼은 "오늘 밤 진료 확인"과 "내 통증 경혈 보기" 두 개입니다.

헤더에도 같은 상태 표시와 예약 전화 버튼을 붙였습니다. 퇴근길 검색에서 가장 급한 질문인 "지금 열려 있나"에 페이지 어디서든 답이 보이게 하려는 것입니다. 바로 아래 "밤의 몸은 낮보다 정직합니다." 섹션에는 21:00 평일 밤 9시까지, 1:1 원장 직접 추나·침, 1 ROOM 1인 1실 치료실 세 숫자를 나란히 놓아 약속을 한 번 더 정리했습니다.
한의원 홈페이지 디자인: 한지 대신 밤의 라운지
대부분의 한의원 홈페이지는 밝은 한지 톤입니다. 저희가 만든 담연한의원도 한지 아이보리 바탕의 수묵이었습니다. 청림은 정반대로 갔습니다. 검정에 가까운 딥 포레스트 그린 위에 황동 램프 빛만 켜 둔 시네마틱 나이트 무드입니다. 밤에 찾아오는 한의원이라면 화면도 밤이어야 한다고 판단했습니다.
영문은 로마 비문체인 Cinzel과 Marcellus로 클래식한 품격을 주고, 한글은 Pretendard 가는 굵기에 핵심 단어만 굵은 황동색으로 강조했습니다. 늦은 밤 고급 라운지에 들어선 듯한 긴장감을 주면서도, 피곤한 눈에 부담이 없도록 밝은 면적은 최소로 줄였습니다. 램프 빛에 비친 듯한 아주 적은 먼지 입자와 섹션 사이에 펼쳐지는 황동 라인이 화면의 공기를 채웁니다.
| 요소 | 고른 것 | 이유 |
|---|---|---|
| 바탕색 | 밤 녹흑 #070F0C, 딥 포레스트 #0F2A22 | 밤에 여는 한의원, 피곤한 눈에 편한 어둠 |
| 포인트 | 황동 #B8893B, 램프 빛 #F4CF8A | 불을 켜 두고 기다린다는 따뜻한 빛 |
| 보조 | 월넛 #5A3B26, 아이보리 #EDE3D0 | 나무 가구와 조명이 있는 치료실의 질감 |
| 서체 | Cinzel·Marcellus + Pretendard | 영문은 클래식한 품격, 한글은 가늘고 차분하게 |
| 빛 효과 | 램프 스포트라이트, 먼지 입자 | 사진과 화면이 같은 조명 아래 있는 느낌 |
경혈 지도와 황동 시계: 읽기 전에 눌러 보게
직장인 통증 한의원에서 흔히 받는 질문은 "목이 아픈데 왜 등에 침을 놓나요?"입니다. 이 설명을 글로 길게 쓰는 대신, 직접 눌러 보는 경혈 지도를 만들었습니다. "경락을 따라, 하루의 긴장을 읽습니다." 섹션에 들어서면 등·목·어깨 실루엣 위로 경락 선이 그려지고 경혈이 위에서 아래로 차례로 켜집니다.
목, 어깨, 허리, 두통 가운데 하나를 고르면 해당 경혈과 경락만 황동빛으로 흐르고, 옆의 목록에는 풍지(風池), 견정(肩井), 신수(腎兪)처럼 원장님이 먼저 살피는 경혈 이름이 나옵니다. 목록에 마우스를 올리면 그 경혈이 맥박처럼 빛납니다. "모니터 앞 하루 9시간이 남기는 자리들"이라는 제목처럼, 내 통증이 어디서 이어져 있는지를 몸으로 먼저 이해하게 하는 장치입니다.

진료시간 섹션은 "밤 9시, 아직 불이 켜져 있습니다."입니다. 서울 시각으로 실제로 움직이는 아날로그 황동 시계와 오늘의 진료 시간 막대를 두고, 막대 위에 지금 시각을 NOW로 표시했습니다. '지금 진료 중 · 오늘 21:00까지 · 마지막 접수 20:30' 상태는 헤더와 모바일 하단 바까지 함께 바뀝니다. 진료시간표를 읽고 계산하게 하지 않고, 지금 가면 되는지를 바로 알려 주는 것이 목표였습니다.

| 섹션 | 담은 것 | 풀어 주는 망설임 |
|---|---|---|
| 밤의 한의원 | 21:00, 1:1 원장 직접, 1인 1실 | 퇴근하고 가도 받아 줄까 |
| 대표원장 | 한마디, 추나 진료 22년, 야간도 직접 | 밤엔 다른 사람이 치료하지 않을까 |
| 경혈 지도 | 목·어깨·허리·두통별 경혈과 경락 | 내 통증은 어디서 오는 걸까 |
| 진료 과목 6가지 | 목·어깨, 허리, 추나, 침, 두통, 교통사고 | 내 증상도 보는 곳일까 |
| 추나 진료 과정 | 문진·촉진 20분부터 책상 앞 처방까지 | 가면 무엇을 하게 될까 |
| 진료시간과 치료실 | 황동 시계, 1인 1실, 치료복·사물함 | 정장 차림으로 가도 될까 |
대표원장 섹션에는 램프 아래 앉은 원장님 사진과 "퇴근하고 오신 분의 몸은 하루를 그대로 말해 줍니다. 그 이야기를 제 손으로 직접 듣는 것이 제 진료입니다."라는 한마디를 두었습니다. 경력 목록에도 '평일 야간 진료를 포함한 모든 추나·침 치료 직접 시행'을 넣어, 강점 문장이 원장님 소개에서 다시 확인되게 했습니다.

추나 진료 과정은 "손으로 먼저 확인합니다." 제목 아래 I부터 IV까지 로마 숫자로 정리했습니다. 문진·촉진 20분, 원장 직접 추나, 침·약침·뜸, 그리고 모니터 높이와 의자, 30분마다 하는 동작 하나를 알려 주는 '책상 앞 처방'입니다. 직장인에게는 치료만큼 내일 회사에서 무엇을 하면 되는지가 중요하기 때문입니다. 치료실 섹션에서는 1인 1실, 치료복·사물함, 낮은 조도, 예약 우선을 보여 주며 "정장 그대로 오셔도 됩니다"라는 걱정까지 풀었습니다.
휴대폰 화면: 진료 상태, 전화, 예약을 한 줄에
퇴근길 검색은 거의 휴대폰에서 일어납니다. 그래서 모바일 하단 바에 '진료 중' 상태 표시와 '전화', '예약하기' 버튼을 한 줄로 고정했습니다. 지하철에서 화면을 내리다가도 지금 열려 있는지 보고, 엄지 하나로 바로 전화할 수 있습니다.
경혈 지도는 실루엣을 화면 폭에 맞춰 크게 키우고 증상 버튼을 그 아래 두 줄로 배치해, 손가락으로 고르기 쉽게 했습니다. 마우스가 없는 휴대폰에서는 램프 스포트라이트가 터치를 따라 움직입니다. 어두운 화면이라 글자가 묻히지 않도록 본문 밝기와 크기를 휴대폰에서 따로 확인했고, 390px 폭에서 가로 밀림이 없는지도 검수했습니다.



검색 세팅, 그리고 실제 한의원에 적용한다면
직장인 통증 한의원은 "여의도 한의원 야간", "여의도 추나", "거북목 한의원"처럼 지역과 시간, 증상을 붙여 검색합니다. 그래서 페이지 제목은 "청림한의원 — 일하는 몸을 위한 밤의 한의원"으로 정하고, 설명 문구에 평일 21시, 원장 직접 추나·침, 여의도를 담았습니다. 효과가 많아도 첫 화면 아래 이미지는 지연 로딩해 처음 열리는 속도를 지켰고, 가상 병원이라 검색 제외(noindex)를 걸어 두었습니다.
실제 제작에서는 요일별 진료시간을 구조화 데이터로 정확히 넣어, 지도와 검색 결과에서도 "지금 영업 중"이 맞게 뜨도록 합니다. "거북목 추나 효과", "퇴근 후 허리 통증"처럼 직장인이 검색하는 질문으로 칼럼 6편을 함께 쓰고, 원장님과 치료실은 실제 밤 조명 아래에서 직접 촬영합니다.
같은 한의원이라도 강점이 다르면 홈페이지의 낮과 밤까지 달라집니다. 40분 진료를 수묵화로 담은 담연한의원 제작기, 사상체질 다이어트를 컬러 블록으로 만든 소요한의원 제작기와 비교해 보세요.
병원 홈페이지 제작 비용은 330만 원(부가세 포함)이며 직접 촬영, 페이지와 수정 횟수 제한 없음, 검색용 칼럼 6편, 오픈 후 3개월 유지보수가 포함됩니다. 이후 유지보수 정기권은 월 110만 원이며, 월 마케팅이나 개원 마케팅을 함께 하시면 무료입니다. 우리 한의원 홈페이지에서 무엇부터 바꾸면 좋을지는 무료 사전 진단으로 먼저 확인해 보세요. 마케터가 직접 보고 답장드립니다. 다른 업종 사례는 홈페이지 포트폴리오에서 보실 수 있습니다.
자주 묻는 질문
한의원 홈페이지 제작 비용은 얼마인가요?
330만 원(부가세 포함)이며 직접 촬영, 페이지와 수정 횟수 제한 없음, 검색용 칼럼 6편, 오픈 후 3개월 유지보수가 포함됩니다.
'지금 진료 중' 표시는 실제 시간에 맞춰 바뀌나요?
네, 서울 시각과 병원의 요일별 진료시간을 비교해 진료 중, 마지막 접수, 휴진을 자동으로 보여 주도록 만듭니다.
어두운 디자인이면 글이 잘 안 읽히지 않나요?
본문은 아이보리 계열로 밝기를 충분히 주고 크기를 키워, PC와 휴대폰에서 모두 읽기 편한지 직접 확인한 뒤 오픈합니다.
경혈 지도 같은 기능은 진료 내용에 맞게 바꿀 수 있나요?
네, 원장님이 실제로 먼저 보는 부위와 경혈을 인터뷰로 정리해, 그 병원의 진료 방식에 맞는 그림과 설명으로 새로 만듭니다.
야간 진료 시간이 바뀌면 고쳐 주시나요?
오픈 후 3개월은 무료로 수정해 드리고, 이후에는 유지보수 정기권으로 이어 가거나 마케팅을 함께 하시면 무료로 관리해 드립니다.