프로젝트 상담 신청 프로젝트 소개로 건너뛰기

연세아이소망여성의원Yonsei Fertility Clinic

원이 열리는 엿새

배양실에서 배아가 자라는 엿새를 스크롤로 넘기는 메인 페이지를 만들었습니다. 그리고 그 마지막 장면이 병원의 로고와 닮았다는 것을 알게 되었습니다.

Client
연세아이소망여성의원
Scope
메인 페이지 리뉴얼 제안
Year
2026
  1. DAY 0수정

    난자와 정자가 만나는 순간입니다. 수정이 어려우면 정자 하나를 난자에 직접 넣어 줍니다.

  2. DAY 1전핵 확인

    수정 다음 날 두 개의 전핵이 보이면 정상적으로 수정된 것으로 봅니다.

  3. DAY 24세포기

    세포가 둘로, 다시 넷으로 나뉩니다. 분열 속도와 모양을 꼼꼼하게 기록합니다.

  4. DAY 38세포기

    여덟 개로 나뉜 세포가 고르게 자라는지 확인합니다.

  5. DAY 4상실배

    세포들이 서로 단단히 붙으면서 하나의 덩어리가 됩니다.

  6. DAY 5배반포

    안쪽에 빈 공간이 생기고, 아기가 될 세포와 태반이 될 세포가 나뉩니다.

  7. DAY 6부화

    배아가 투명대의 한쪽을 열고 빠져나와 착상을 준비합니다.

DAY 0수정 전

01 / OVERVIEW소개

엿새를
지켜보는 병원

연세아이소망여성의원은 경기도 안산에서 시험관아기와 인공수정, 가임력 보존을 진료하는 난임 전문 의원입니다. 보건복지부가 지정한 배아생성 의료기관이자 난임시술 의료기관이며, 원내 난임의학연구소에서 난자 채취부터 배양과 이식, 동결까지 이어서 진행합니다. 부설 한국정자은행도 함께 운영합니다.

이 병원의 홈페이지를 여는 사람은 대부분 오래 기다려 온 부부입니다. 검사 결과를 기다리고, 배아가 자라기를 기다리고, 이식 뒤 2주를 기다립니다. 그래서 메인 페이지를 기다림의 시간으로 설계했습니다. 첫 화면에서는 배양실의 엿새를 스크롤로 넘기고, 화면을 내릴수록 새벽에서 아침으로 밝아지게 했습니다.

  • 6일

    배양실에서 배아를 지켜보는 시간수정한 날(Day 0)부터 부화하는 날(Day 6)까지
  • 240

    직접 렌더링한 배아 필름의 프레임WebGL2 볼륨 렌더링 · 데스크톱 1400px · 모바일 820px
  • 3

    처음 검토한 방향엿새의 필름 · 아침 여덟 시 · 씨앗 한 톨
  • 20

    다시 정리한 공개 메뉴메인 1 · 병원과 진료 7 · 운영 안내 5 · 게시판 5 · 외국어 2
  1. 2026.10
    지금의 홈페이지 읽기NOW

    공개 메뉴 스무 개와 게시판 다섯 종, 자주 묻는 질문을 읽고 메인 페이지에 무엇을 먼저 둘지 정했습니다.

  2. 2026.10
    세 갈래의 방향ROUND 1

    배양실의 엿새, 아침 여덟 시, 씨앗 한 톨이라는 세 가지 방향으로 무드보드와 첫 화면을 그렸습니다.

  3. 2026.10
    배아 필름 렌더링ROUND 2

    수정부터 부화까지 자라는 배아 하나를 240프레임의 필름으로 직접 렌더링했습니다.

  4. 2026.10
    메인 시안ROUND 3

    필름으로 여는 첫 화면부터 아기 손을 잡는 마무리까지 열한 장면을 이었습니다.

  5. 2026.11
    이 기록

    로고를 다시 읽고, 기다리는 시간을 그리고, 세 갈래가 하나로 합쳐진 과정을 정리했습니다.

02 / THE NAME이름 읽기

  1. 01 · NAME

    열 글자의 병원 이름 한가운데에 「아이」와 「소망」이 들어 있습니다.

  2. 02 · QUOTE
    아이를 기다리는 부부의 ‘아이 소망’이 이루어지도록 연세아이소망여성의원이 함께하겠습니다.

    지금 홈페이지 메인의 병원 소개 문장

  3. 03 · SLOGAN

    소망현실

    기다림기쁨

    병원의 문장 「소망을 현실로, 기다림을 기쁨으로」는 두 번 모두 기다리던 것이 이루어지는 순간을 말합니다. 그래서 메인 페이지의 주인공을 병원이 아니라 기다리는 사람으로 정했습니다.

  4. 04 · 願

    이 기록의 제목에 쓴 「원」은 로고의 동그라미이면서, 바라는 일(願)이기도 합니다. 원이 열리는 날은 소망이 이루어지는 날입니다.

03 / THE MARK로고 읽기

열매 안의
열린 원

로고를 새로 만들지 않았습니다. 지금 쓰는 로고를 크게 키워 획 하나하나를 다시 그려 보고, 그 안에서 이야기를 찾았습니다.

  1. 01 · FRUIT열매

    연두색 열매는 닫힌 동그라미가 아닙니다. 위쪽 가운데에서 출발한 획이 한 바퀴를 돌아, 시작한 자리 안쪽으로 파고들며 끝납니다.

  2. 02 · GAP틈

    그래서 열매 위쪽에 가는 틈이 하나 생깁니다. 마크 전체에서 열려 있는 곳은 이 자리 하나뿐입니다.

  3. 03 · LEAF잎

    잎은 그 틈 바로 위에서 오른쪽 위로 돋아납니다. 열린 자리에서 무언가가 자라 나오는 모양입니다.

  4. 04 · SEED노란 태아

    열매 안의 노란 모양은 몸을 웅크린 태아이자, 열매 속의 씨앗입니다. 로고에서 가장 따뜻한 색이 여기에만 있습니다.

열매 · 잎#C2D236 노란 태아#FCD70C

현미경 속 엿새째와
겹쳐 보기

현미경으로 본 엿새째의 배아도 같은 구조입니다. 둥근 투명대 안에 배아가 있고, 투명대의 한쪽이 열리면서 배반포가 오른쪽 위로 빠져나옵니다. 로고에서 열매의 틈과 잎이 놓인 자리와 같은 방향입니다.

로고가 처음부터 배아를 그린 그림인지는 알 수 없습니다. 다만 이 닮음 덕분에, 첫 화면의 배아 필름이 끝나는 순간을 로고로 이을 수 있었습니다.

엿새째 배아가 투명대의 오른쪽 위를 열고 빠져나오는 필름의 한 장면
현미경 로고
  • 연두 열매의 원투명대
  • 열매 위쪽의 틈열리기 시작한 투명대
  • 오른쪽 위로 돋는 잎빠져나오는 배반포
  • 노란 태아안쪽 세포 덩어리
손잡이를 오른쪽으로 끌면 필름의 부화 장면 위에 로고 마크가 같은 중심과 크기로 겹칩니다. 마크는 잎이 배반포 쪽을 향하도록 34° 돌렸습니다.
04 / THE WAIT기다리는 시간

한 주기의 대부분은
기다림입니다

시험관아기 한 주기는 보통 4~6주가 걸립니다. 그 가운데 병원에서 무언가를 하는 날은 며칠뿐이고, 나머지는 주사를 맞으며 기다리거나 결과를 기다리는 시간입니다.

메인 페이지는 진료 전에만 읽히지 않습니다. 기다리는 동안 몇 번이고 다시 여는 화면입니다. 그래서 장면마다 지금 이 사람이 어느 시간에 있는지를 먼저 생각했습니다.

  1. 01 첫 상담 · 원인 검사 주기 전

    부부가 함께 오시면 좋습니다. 생리 시작 2~3일째에 오시면 기본 호르몬 검사를 바로 받을 수 있습니다.

    홈페이지가 하는 일전화 예약 · 카카오톡 · 온라인 상담 세 창구를 첫 화면과 마지막 장면에 두고, 첫 진료 때 챙길 것을 목록으로 적었습니다.

  2. 02 과배란 유도 약 10~14일

    주사와 초음파로 난포를 키우는 시간입니다. 병원에 자주 오가야 합니다.

    홈페이지가 하는 일진료 시간과 지금 진료 중인지를 메인 페이지에서 바로 확인하게 했습니다. 평일과 토요일 모두 오전 8시에 문을 엽니다.

  3. 03 난자 채취 · 수정 Day 0

    난자를 채취하고 같은 날 수정합니다. 수정이 어려우면 미세정자주입술을 씁니다.

    홈페이지가 하는 일첫 화면 필름의 Day 0 자막에 같은 설명을 넣었습니다.

  4. 04 배양 Day 1~5

    배양실에서 배아가 자랍니다. 부부는 이 시간을 직접 볼 수 없습니다.

    홈페이지가 하는 일볼 수 없는 엿새를 스크롤로 넘겨 보는 첫 화면 필름을 만들었습니다. 배아를 꺼내지 않고 지켜보는 타임랩스 인큐베이터의 방식과 같습니다.

  5. 05 배아 이식 Day 3~5

    잘 자란 배아를 골라 자궁에 이식합니다.

    홈페이지가 하는 일「이식할지, 동결할지를 정하는 시점」이라는 Day 5 자막으로 결정의 순간을 설명합니다.

  6. 06 이식 뒤 2주 약 14일

    가장 길게 느껴지는 시간입니다. 결과는 아직 알 수 없습니다.

    홈페이지가 하는 일이 시간을 위한 장면은 정보보다 문장이 먼저입니다. 새벽빛 영상 위에 대표원장의 인사말을 두고, 시술비 지원과 자주 묻는 질문을 이어 두었습니다.

  7. 07 임신 확인 이식 2주 뒤

    혈액 검사로 임신 여부를 확인합니다. 한 주기는 보통 4~6주가 걸립니다.

    홈페이지가 하는 일마지막 장면에서 아기 손이 어른의 손가락을 쥐며 「기다림이 기쁨이 되는 날까지」라는 문장으로 끝납니다.

기간은 메인 시안의 자주 묻는 질문과 지금 사이트의 안내(과배란 유도 약 10~14일, 배아 배양 3~5일, 이식 약 2주 뒤 혈액 검사)를 따랐고, 사람마다 다릅니다.

05 / WORDS숫자와 문장

숫자는
기준과 함께

난임 병원의 홈페이지에는 숫자가 많습니다. 평가 등급, 경력 연수, 지원 비율, 시술 횟수입니다. 같은 숫자도 어떻게 쓰느냐에 따라 사실이 되기도 하고 약속처럼 읽히기도 합니다.

의료광고는 치료 효과를 보장하거나 다른 병원과 비교하는 표현을 쓸 수 없습니다. 그래서 흔히 보이는 표현을 옆에 두고, 같은 내용을 기준이 보이는 문장으로 다시 썼습니다.

  1. 01

    흔히 보이는 표현임신 성공률 1등급 병원

    메인 시안의 문장보건복지부 난임시술 의료기관 평가(2019, 2022, 2025)에서 인공수정과 체외수정 평가지표 모두 1등급을 받았습니다. 이 평가는 임신 성공률 순위가 아닙니다.

    평가가 무엇을 재는지 함께 적었습니다. 평가는 시설과 장비, 전문인력, 질 관리 현황을 살핍니다.

  2. 02

    흔히 보이는 표현최신 장비로 확실한 결과

    메인 시안의 문장6개의 독립 챔버가 배아마다 따로 배양 환경을 만들고, 내장 카메라가 발달 과정을 연속으로 기록합니다.

    장비가 결과를 보장한다고 쓰지 않고, 장비가 하는 일을 적었습니다.

  3. 03

    흔히 보이는 표현정부 지원으로 부담 없이

    메인 시안의 문장건강보험 본인부담률은 30%이고, 보건소 지원 대상이면 전액본인부담금의 90%를 지원받습니다. 지원 기준은 해마다 공고에 따라 바뀔 수 있습니다.

    숫자에는 조건과 바뀔 수 있다는 사실을 붙였습니다.

  4. 04

    흔히 보이는 표현누구나 다시 시작할 수 있습니다

    메인 시안의 문장원인을 먼저 찾고, 그에 맞는 치료를 고릅니다. 검사 결과를 바탕으로 치료 방법을 함께 정합니다.

    약속 대신 진료의 순서를 문장으로 옮겼습니다.

문장을 고른 다섯 가지 기준

  1. 01성공률과 순위는 쓰지 않습니다

    평가 등급은 평가가 살피는 항목과 함께 씁니다.

  2. 02숫자에는 기준을 붙입니다

    「3회 연속」 옆에는 2019 · 2022 · 2025를, 「30%」 옆에는 무엇의 30%인지를 적습니다.

  3. 03장비는 하는 일로 설명합니다

    최신이라는 표현보다 챔버 여섯 개, 연속 기록처럼 눈에 보이는 사실을 씁니다.

  4. 04경험담 대신 과정을 보여 줍니다

    치료 경험담을 메인에 싣지 않고, 첫 상담부터 임신 확인까지의 과정을 그림으로 보여 줍니다.

  5. 05바뀔 수 있는 것은 바뀔 수 있다고 씁니다

    지원 제도와 횟수는 공고에 따라 달라질 수 있다는 문장을 같은 화면에 둡니다.

「흔히 보이는 표현」은 이 병원의 문장이 아니라, 업계에서 자주 쓰이는 표현을 예로 든 것입니다.

06 / COLOR · TYPE색 · 글꼴

현미경 아래에서
찾은 색

로고의 연두와 노랑은 밝고 선명하지만, 흰 배경 위에서는 글자색으로 쓰기 어렵습니다. 그래서 로고의 두 색은 그대로 두고, 나머지 색을 현미경 아래에서 찾았습니다.

배아 필름의 1400px 프레임에서 날마다 세포질의 색을 재 보니, 엿새 동안 호박색이 조금씩 옅어지다가 부화하는 날 다시 짙어졌습니다. 첫 화면의 배경은 배양실처럼 어둡게, 필름이 끝난 뒤의 장면은 아침의 종이처럼 밝게 정했습니다.

DAY 0수정#8C7450
DAY 1전핵기#8A734F
DAY 24세포기#887250
DAY 38세포기#927B56
DAY 4상실배#9C865F
DAY 5배반포#B8A985
DAY 6부화#685D45
  • Incubator Night#0B0E0B

    배양실처럼 어두운 첫 화면의 배경색

  • Zona Pearl#BCC0BC

    필름 속 투명대의 빛, 얇은 선과 고리

  • Cytoplasm Amber#8C7450

    Day 0 세포질의 호박색, 사진의 따뜻한 톤

  • Leaf Lime#C2D236

    로고의 열매와 잎, 누를 곳에만 쓰는 신호

  • Seed Yellow#FCD70C

    로고의 노란 태아, 그림 속 한 점

  • Morning Paper#F3F5EE

    필름이 끝난 뒤 밝아지는 장면의 배경색

  • Ink Green#13201A

    밝은 배경 위의 글자색, 초록이 섞인 먹색

  • Lime Deep#55700C

    밝은 배경에서 연두 대신 쓰는 글자색

연두는 화면의 1.3%

메인 시안 PC 화면 서른 장에서 화소마다 가장 가까운 색을 세었습니다. 로고의 연두는 전화 예약 버튼과 진행 막대처럼 누르거나 지켜볼 곳에만 썼습니다.

  • 밝은 배경62.0%
  • 필름 · 사진25.8%
  • 어두운 배경9.6%
  • 연두1.3%
  • 글자1.3%

글자색과 배경색의 대비

짝대비판정
크림 / 밤첫 화면의 제목과 본문17.29:1작은 글자까지
연두 / 밤밤 장면의 버튼과 진행 막대11.61:1작은 글자까지
먹색 / 연두연두 버튼 위의 글자10.05:1작은 글자까지
연두 / 종이밝은 배경에서는 글자색으로 쓰지 않음1.52:1글자 불가
Lime Deep / 종이밝은 장면의 작은 강조 글자5.15:1본문 가능
노랑 / 종이그림 속 한 점으로만1.28:1글자 불가
먹색 / 종이밝은 장면의 본문15.29:1작은 글자까지

Pretendard

소망을 현실로, 기다림을 기쁨으로.

제목과 본문. 굵기 650의 제목은 자간을 -0.035em으로 좁혀 부드럽게 둥근 글자를 단정하게 묶습니다.

Geist Mono

DAY 3 · 064h

필름의 시간 표시와 장 번호. 숫자 폭이 같아 0h에서 150h까지 세는 동안 글자가 흔들리지 않습니다.

07 / DIRECTIONS세 갈래

세 갈래로 그리고,
하나로 엮었습니다

처음에는 세 방향을 같은 무게로 그렸습니다. 배양실의 엿새를 보여 주는 어두운 필름, 오전 8시에 문을 여는 병원의 아침, 로고의 열매와 씨앗으로 만든 밝은 그래픽입니다.

셋을 나란히 놓고 고른 기준은 하나였습니다. 이 병원만 보여 줄 수 있는 장면인가. 아침 햇살과 씨앗은 다른 병원도 쓸 수 있지만, 원내 연구소에서 배아를 지켜보는 엿새는 이 병원의 이야기였습니다.

A · EMBRYO FILM

엿새의 필름

배양실의 어둠에서 배아가 자라는 엿새를 스크롤로 넘깁니다.

병원이 가장 잘하는 일을 그대로 보여 주는 방향입니다. 원내 난임의학연구소에서 배아를 지켜보는 시간을 첫 화면으로 옮겼습니다.

이렇게 이어졌습니다메인 시안의 뼈대가 되었습니다. 첫 화면 필름, 시간 표시, 현미경 장면이 이 방향에서 나왔습니다.

A · 엿새의 필름 방향의 PC 화면
A · 엿새의 필름 방향의 모바일 첫 화면
정자가 다가오는 Day 0
정자가 다가오는 Day 0
연구소의 타임랩스 인큐베이터
연구소의 타임랩스 인큐베이터
배반포가 되는 Day 5
배반포가 되는 Day 5

B · AM 8:00

아침 여덟 시

평일과 토요일 모두 오전 8시에 문을 여는 병원의 아침을 그립니다.

호르몬 검사처럼 아침에 받아야 하는 진료가 많고, 출근 전에 들르는 부부가 많습니다. 따뜻한 아침빛과 해 시계로 진료 시간을 먼저 보여 주는 방향입니다.

메인 시안에 남은 것새벽빛 영상 위의 인사말, 부부의 사진, 「지금 진료 중」 안내가 메인 시안의 뒷부분으로 들어갔습니다.

B · 아침 여덟 시 방향의 PC 화면
B · 아침 여덟 시 방향의 모바일 첫 화면
오전 7시 50분의 대기실
오전 7시 50분의 대기실
창가의 보리차
창가의 보리차
아침 길을 걷는 부부
아침 길을 걷는 부부

C · SEED

씨앗 한 톨

로고의 열매 · 잎 · 씨앗을 그대로 그래픽 체계로 씁니다.

밝고 단단한 방향입니다. 다만 난임이라는 무거운 주제에 비해 화면이 가볍게 읽힐 수 있었고, 어느 병원이나 쓸 수 있는 그림이 되기 쉬웠습니다.

메인 시안에 남은 것연두 버튼과 둥근 진행 표시, 진료마다 원 안에 담은 현미경 장면에 남았습니다.

C · 씨앗 한 톨 방향의 PC 화면
C · 씨앗 한 톨 방향의 모바일 첫 화면
씨앗에서 돋는 잎
씨앗에서 돋는 잎
열매 속의 씨앗
열매 속의 씨앗
위쪽이 열린 원
위쪽이 열린 원

B · C 방향의 첫 화면과 무드보드 사진은 방향을 비교하기 위해 연출한 장면입니다. 화면의 전화번호는 다른 번호로 바꿨습니다.

08 / THE FILM배아 필름

엿새를
렌더링하다

실제 배아 영상은 환자의 의료 정보이고, 구할 수 있는 영상은 장면마다 다른 배아라 하나로 이어지지 않습니다. 그래서 배아 하나가 수정부터 부화까지 자라는 장면을 처음부터 만들었습니다.

브라우저의 WebGL2로 세포를 반투명한 부피로 그리는 볼륨 렌더링 장면을 짜고, 브라우저의 GPU로 1400px 프레임 240장을 뽑았습니다. 메인 시안의 첫 화면은 이 프레임을 스크롤에 맞춰 넘깁니다.

  1. 001
  2. 011
  3. 021
  4. 031
  5. 041
  6. 051
  7. 061
  8. 071
  9. 081
  10. 091
  11. 101
  12. 111
  13. 121
  14. 131
  15. 141
  16. 151
  17. 161
  18. 171
  19. 181
  20. 191
  21. 201
  22. 211
  23. 221
  24. 231
배아 필름의 한 장면: 여덟 개로 나뉜 세포
손잡이나 화면을 끌면 120장의 프레임을 직접 넘겨 볼 수 있습니다.
  1. 01어둠 속의 가장자리

    정면을 향한 세포막은 거의 보이지 않고 가장자리만 빛나도록 시선 각도에 따라 빛을 나눴습니다. 암시야 현미경으로 본 배아처럼 보입니다.

  2. 02안에서 번지는 빛

    세포막 안쪽으로 번지는 산란광을 더해, 세포가 속에서 은은하게 빛나 보이게 했습니다.

  3. 03줄무늬 없는 질감

    세포질의 질감을 만드는 노이즈를 회전한 좌표에서 읽어, 화면 축과 겹친 줄무늬가 생기지 않게 했습니다.

  4. 04열리는 투명대

    Day 6에는 투명대의 한쪽에 틈을 열고, 배반포가 그 틈으로 빠져나오게 했습니다.

09 / PLATES현미경 장면

진료마다
한 장의 현미경

진료 카드에는 사람 사진 대신 같은 배율의 현미경 장면을 넣었습니다. 첫 화면 필름과 같은 장면 파일에서 밝은 배경의 명시야로 정지 장면 여덟 장을 따로 렌더링했습니다.

여덟 가지 치료가 같은 원 안에 담기니 한 가족처럼 보이고, 카드를 넘기는 동안 첫 화면의 엿새를 다시 떠올리게 됩니다.

  • 난임 검사 카드의 현미경 장면 Infertility Work-up 난임 검사

    난임 원인의 약 40%는 남성 쪽에 있습니다. 부부가 함께 검사를 받으면 원인을 더 빨리 찾을 수 있습니다.

  • 인공수정 카드의 현미경 장면 IUI 인공수정

    배란일에 맞춰 운동성이 좋은 정자를 골라 자궁 안에 넣어 줍니다.

  • 시험관아기 카드의 현미경 장면 IVF 시험관아기

    채취한 난자를 배양실에서 수정시키고, 잘 자란 배아를 자궁에 이식합니다.

  • 미세정자주입술 카드의 현미경 장면 ICSI 미세정자주입술

    정자 하나를 골라 난자 세포질에 직접 넣어 수정을 돕습니다.

  • 미성숙난자 체외수정 카드의 현미경 장면 IVM 미성숙난자 체외수정

    미성숙 난자를 채취해 몸 밖에서 성숙시킨 뒤 수정합니다.

  • 가임력 보존 카드의 현미경 장면 Fertility Preservation 가임력 보존

    난자와 정자, 배아를 영하 196℃에서 얼려 두었다가 필요할 때 씁니다.

  • 한국정자은행 카드의 현미경 장면 Korea Sperm Bank 한국정자은행

    자가 정자 보관과 기증 정자 상담을 함께 진행합니다.

  • 반복 착상 실패 카드의 현미경 장면 RIF / RPL 반복 착상 실패

    반복되는 원인을 면역학적 · 유전학적으로 살피고 보조부화술을 함께 검토합니다.

10 / STRUCTURE구조

스무 개의 문과
열한 장면

지금 홈페이지의 공개 메뉴는 메인을 포함해 스무 개입니다. 병원과 진료 일곱 페이지, 운영 안내 다섯 페이지, 게시판 다섯 종, 영어와 일본어 안내가 한 페이지씩 있습니다. 메뉴의 수는 그대로 두고, 메인 페이지에서 무엇을 먼저 보여 줄지를 다시 정했습니다.

자주 묻는 질문을 주제별로 세어 보니 시험관아기와 병원 안내에 관한 질문이 절반이 넘었습니다. 그래서 메인 페이지의 앞쪽에 진료 과정을, 뒤쪽에 진료 시간과 오시는 길을 두었습니다.

공개 메뉴 20

  • 메인1메인 페이지
  • 병원과 진료7병원소개난임클리닉시험관아기인공수정가임력보존난임연구소정자은행
  • 운영 안내5난임부부 지원사업자주 묻는 질문비급여 안내서류 발급 안내개인정보처리방침
  • 게시판5공지사항난임상담실난임 칼럼언론보도축하합니다
  • 외국어2English日本語

자주 묻는 질문 77

  1. 시험관아기23
  2. 병원안내20
  3. 난임 질환 · 검사9
  4. 비용 · 정부지원8
  5. 인공수정7
  6. 난자동결 · 정자은행6
  7. 병원 선택 · 전원3
  8. 치료 중 생활1

지금 사이트의 자주 묻는 질문, 2026년 11월 기준

메인 시안의 열한 장면 1440 × 900 화면에서 잰 높이 22,954px

  1. 배아 필름6,840
  2. 새벽 · 인사말 · 지정 현황1,594
  3. 진료 · 현미경 카드3,198
  4. 난임의학연구소3,288
  5. 진료 과정1,898
  6. 대표원장881
  7. 시술비 지원1,078
  8. 진료 안내 · 오시는 길1,120
  9. 자주 묻는 질문807
  10. 아기 손 · 마무리2,250

「새벽 · 인사말 · 지정 현황」은 새벽 장면과 숫자 카드를 한 막대에 묶었습니다.

  1. SEO진료마다 다른 제목

    시험관아기 · 인공수정 · 가임력보존처럼 진료 페이지마다 고유한 제목과 설명, 본문 제목을 두어 검색 결과에서 구분되게 했습니다.

  2. AEO질문과 답을 나눈 구조

    자주 묻는 질문은 질문과 답을 구분하고 주제별 제목과 관련 진료 링크를 붙여, 검색과 답변 서비스가 읽기 쉬운 본문으로 정리했습니다.

  3. GEO병원 정보를 한 곳에서

    병원 · 진료 시간 · 위치 · 연구소 정보를 구조화 데이터(MedicalClinic)로 정리하고, 화면에 보이는 본문과 같은 내용이 되게 했습니다.

11 / MAIN DRAFT메인 시안
메인 시안 · 엿새의 필름

EMBRYO TIME-LAPSE FILM배아 필름으로 열고, 아기 손으로 닫는 열한 장면

배양실처럼 어두운 첫 화면에서 배아가 엿새 동안 자라고, 화면이 하얗게 밝아지면서 새벽의 인사말과 진료 안내로 이어집니다.

  • 스크롤로 넘기는 배아 필름 240프레임과 시간 표시
  • 여덟 가지 진료를 담은 현미경 장면 카드
  • 서울 시각에 맞춘 「지금 진료 중」 안내
  • 모바일은 세로 프레임 240장과 한 손으로 누르는 빠른 연락 막대
Night · Pearl · Lime · Paper
  1. 첫 화면 필름

    스크롤하는 만큼 배아가 자라고, 아래 막대가 Day 0부터 Day 6까지 차오릅니다. 시간 표시는 0h에서 150h까지 셉니다.

  2. 새벽의 인사말

    필름이 하얗게 밝아지면 창가의 새벽빛 영상 위로 대표원장의 인사말이 이어집니다.

  3. 지정 현황과 숫자

    30년 · 3회 연속 1등급 · 국내 1호 · 협력병원 6곳을 카드로 두고, 평가가 성공률 순위가 아니라는 문장을 함께 둡니다.

  4. 현미경 카드

    여덟 가지 진료를 가로로 넘기는 카드마다 같은 배율의 현미경 장면을 넣었습니다.

  5. 난임의학연구소

    타임랩스 인큐베이터부터 냉동보관실까지 다섯 장비를 스크롤에 따라 바꿔 보여 줍니다.

  6. 진료 과정

    첫 상담부터 임신 확인까지 다섯 단계를 곡선의 길로 잇고, 첫 진료 때 챙길 것을 옆에 둡니다.

  7. 시술비 지원

    30% · 25회 · 90% 세 숫자로 지원 제도를 요약하고, 기준이 바뀔 수 있다는 문장을 붙입니다.

  8. 진료 안내

    지금 진료 중인지, 언제 다시 여는지를 서울 시각에 맞춰 알려 줍니다.

  9. 아기 손

    아기 손이 어른의 손가락을 쥐는 장면을 스크롤로 넘기며 마무리합니다.

모바일 첫 화면
모바일 배아 필름
모바일 현미경 카드
모바일 난임의학연구소
모바일 진료 과정
모바일 시술비 지원
모바일 진료 안내
모바일 아기 손

녹화 화면의 대표원장 사진과 배아연구원 사진은 같은 크기의 다른 사진으로 바꿨고, 대표원장 이름 · 전화번호 · 주소 · 사업자 정보는 다른 글자로 바꾸거나 가렸습니다.

12 / DETAIL디테일

기다리는 사람을 위한
작은 장치

메인 시안에는 눈에 잘 띄지 않는 장치가 몇 가지 있습니다. 지금 전화해도 되는지 알려 주는 진료 시간 문장, 첫 진료 때 챙길 것의 목록, 지원 제도를 세 숫자로 줄인 카드입니다. 아래에서 직접 움직여 볼 수 있습니다.

01 · NOW OPEN

지금 진료 중인가요?

평일 오전 8:00 ~ 오후 4:30(점심 낮 12:00 ~ 오후 1:30), 토요일 오전 8:00 ~ 오후 1:00(점심시간 없음), 일요일 · 공휴일 휴진. 메인 시안은 서울 시각으로 계산합니다.

02 · FIRST VISIT

첫 진료 때 챙겨 오세요

0 / 3

생리 시작 2~3일째에 오시면 기본 호르몬 검사를 바로 받을 수 있다는 안내를 목록 바로 위에 둡니다.

03 · SUPPORT

지원 제도를 세 숫자로

  • 30%

    건강보험 본인부담률나이와 관계없이 같은 비율이 적용됩니다.
  • 25회

    출산 한 번마다 받을 수 있는 시술 횟수체외수정 20회와 인공수정 5회를 합쳤습니다.
  • 90%

    전액본인부담금 지원보건소 지원 대상일 때 받는 비율입니다.

지원 기준은 해마다 공고에 따라 바뀔 수 있다는 문장을 같은 화면에 둡니다(메인 시안 기준, 2026년 10월).

13 / RETROSPECT돌아보며

볼 수 없는 시간을
보여 주는 일

세 갈래의 방향에서 출발해 한 편의 메인 시안을 만들었고, 서브 페이지와 검색 설정까지 리뉴얼의 범위를 함께 정리했습니다. 이 제안들은 최종 선택으로 이어지지 않았습니다.

그래도 배양실의 엿새를 첫 화면에 두자는 판단은 지금 다시 해도 같을 것입니다. 병원이 가장 잘하는 일과 환자가 가장 오래 기다리는 시간이 같은 장면 안에 있었기 때문입니다.

  1. Round 1세 갈래

    배양실의 엿새, 아침 여덟 시, 씨앗 한 톨을 같은 무게로 그려 나란히 놓았습니다.

  2. Round 2엿새의 필름

    배아 필름을 직접 렌더링하고, 아침과 씨앗에서 고른 것을 필름 뒤의 장면으로 이었습니다.

  3. Round 3메인 시안

    열한 장면의 메인 시안을 공유하고, 서브 페이지와 검색 설정까지 전체 리뉴얼의 범위를 함께 정리했습니다.

  1. 01보이지 않는 것을 보여 주기

    환자는 배양실 안을 볼 수 없습니다. 볼 수 없는 시간을 대신 보여 주는 장면이 병원의 전문성을 가장 쉽게 설명했습니다.

  2. 02이미 있던 모양 찾기

    로고를 새로 만들지 않고도, 로고 안에 이미 있던 열린 원과 잎으로 필름과 브랜드를 이을 수 있었습니다.

  3. 03숫자는 기준과 함께

    평가 등급과 지원 비율 같은 숫자는 무엇을 재는 숫자인지 함께 적을 때 믿을 수 있게 읽힙니다.

14 / CREDITS제작 정보
PROJECT CARD2026

YONSEI FERTILITY CLINIC · MAIN PAGE RENEWAL

원이 열리는 엿새

배양실의 엿새를 스크롤로 넘기는 메인 페이지 리뉴얼 제안

Client연세아이소망여성의원 · 안산의 난임 전문 의원
Scope메인 페이지 리뉴얼 제안 · 로고 읽기 · 문장 기준
Period2026년 10월 ~ 11월
Directions엿새의 필름 · 아침 여덟 시 · 씨앗 한 톨
Film배아 필름 240프레임(WebGL2 볼륨 렌더링) · 현미경 장면 8종
Identity지금의 로고 · Night #0B0E0B · Lime #C2D236 · Seed #FCD70C · Paper #F3F5EE
ToolsGSAP · ScrollTrigger · Lenis · WebGL2 · Canvas
TypefacePretendard · Geist Mono
Studio블루캔버스
NEXT오래 기다려 온 사람이 여는 첫 화면을 함께 설계하겠습니다.
SIX DAYS, ONE OPEN CIRCLE

오래 기다려 온 사람이 여는 첫 화면을
함께 설계하겠습니다

로고 안의 작은 모양과 배양실의 엿새에서 출발해,
믿고 전화할 수 있는 병원 홈페이지를 만들겠습니다.

다른 프로젝트

    Contact

    막연한 아이디어도 괜찮습니다.
    프로젝트를 함께 정리해 보세요

    현재 상황과 목표를 남겨 주시면 가능한 작업 범위와 진행 방식, 예상 견적을 정리해 안내드립니다.

    질문 4개 · 약 2분

    작업 범위

    어떤 작업을 함께 하면 좋을까요?

    여러 개 선택할 수 있습니다. 아직 정하지 못했다면 ‘기타’를 눌러 주세요.

    예산

    생각하시는 예산 범위는 어느 정도인가요?

    범위만 알려주셔도 제안 구성에 큰 도움이 됩니다.

    프로젝트 설명

    어떤 상황인지 들려주세요.

    다듬어지지 않아도 괜찮습니다. 아래 항목을 누르면 작성 틀이 채워집니다.

    0

    RFP, 참고 문서 등을 최대 2개까지 업로드할 수 있습니다. 지원 형식: PDF, PPT, Word, Excel, JPG, PNG, ZIP

    연락처

    어디로 회신드릴까요?

    작업 범위 · 예산 · 프로젝트 설명 · 연락처를 채워 주세요.