개요
한눈에 — 월드비전 글로벌 6K는 6km를 달리거나 걷는 참가비가 그대로 개발도상국 아동의 식수위생사업으로 흘러가는 기부형 캠페인이다. 첫 화면은 나무 그늘 아래 환하게 웃는 아이들의 실사 위에 ‘2026 글로벌 6K 마라톤 한국 대회’와 손글씨체 Coming Soon!을 얹어, 다음 대회를 기다리게 만드는 티저 형식을 취한다. ‘2026년에도 열심히 달릴 준비가 되셨나요?’라는 말투부터 공식 행사 안내라기보다 친구가 건네는 초대장에 가깝다. 사이트는 캠페인 소개·참가신청·마이페이지·커뮤니티 네 축으로 움직이고, 우측 상단의 오렌지색 ‘참가하기’ 버튼이 모든 스크롤 구간을 관통하며 단일 전환 목표를 붙든다. 이번 UX/UI 리뷰는 화면에 실제로 보이는 것만 근거로, 히어로의 메시지 전달력, 기부 임팩트를 풀어내는 정보 위계, 참가 신청까지 이어지는 흐름을 차례로 짚는다.
브랜드 & 메시지
브랜드 컬러는 월드비전 특유의 오렌지 하나로 수렴한다. 로고, 히어로 뒤편의 동심원 그래픽, 참가하기 버튼, 기부 임팩트 카드의 아이콘까지 같은 톤으로 묶여 있어 페이지 어디를 잘라 봐도 캠페인이라는 걸 알아챌 수 있다. 손글씨체 Coming Soon!과 물결표(~)로 끝나는 카피는 딱딱한 모금 사이트의 문법을 의도적으로 비껴간다. 따뜻하고 구어체다.
메시지의 심장은 중반부 풀와이드 밴드에 있다. 파란 물통을 머리에 인 소녀가 메마른 땅을 걷는 사진 위로 ‘GLOBAL 6K FOR WATER’와 함께 ‘6km는 개발도상국 아이들이 매일 물을 얻기 위해 걷는 평균 거리입니다’라는 한 줄이 놓인다. 참가자가 달리는 6km와 아이가 물을 길으러 걷는 6km를 겹쳐 놓는 이 장치가 캠페인 전체의 논리를 한 문장으로 완성한다. 상단 히어로의 웃는 아이들과 이 밴드의 물 긷는 소녀가 감정의 명암을 만들며 ‘왜 달려야 하는가’에 답한다.
네비게이션은 캠페인 소개·참가신청·마이페이지·커뮤니티 네 개로 절제돼 있고, 마이페이지의 존재는 참가자 등록 이후의 관리 동선을 전제한다. CTA는 ‘참가하기’를 정점으로 ‘물의 문제 자세히 보기’, ‘더 많은 사진 보기’ 같은 보조 행동으로 층을 나눴다. 최하단에는 주최 월드비전, 후원 서울특별시, 그리고 O’Biotic·BANILA CO·Pulmuone 등 스폰서 로고가 줄지어 신뢰의 근거를 보탠다.
UX/UI 관점
이 사이트의 디자인 강점은 감정을 자산으로 다루는 방식에 있다. 화면에서 확인되는 강점을 정리하면 다음과 같다.
첫째, 컬러 절제. 오렌지 단색을 브랜드와 CTA에 동시에 쓰면서도 산만하지 않다. 버튼만 채도가 높아 시선이 자연스럽게 ‘참가하기’로 흐른다. 둘째, 실사 중심 스토리텔링. 일러스트 대신 대회 현장과 수혜 아동의 사진을 전면에 세워 ‘진짜 있는 일’이라는 신뢰를 만든다. 셋째, 추상적 기부의 구체화. ‘깨끗한 물을 위한 기부’ 섹션은 식수접근성 향상·위생교육·위생환경 조성을 아이콘 카드 세 장으로 쪼개고 각 카드에 ‘구성’ 항목까지 달아, 내 돈이 어디에 쓰이는지를 눈으로 보여준다.
넷째, 사회적 증거. ‘마라톤으로 아이들에게 내일을 선물하는 사람’ 섹션의 후기·현장 카드와 신입 직원 브이로그가 참가자의 목소리를 대신 전한다. 다섯째, 실증 콘텐츠. Video Of Global 6K의 ‘6KM! 달려보면 알거야!’ 영상과 Pictures Of Global 6K의 모자이크 사진 그리드가 대회 분위기를 실감 나게 재현한다. 여섯째, 상시 전환 앵커. 헤더에 고정된 참가하기 버튼이 어느 지점에서든 신청으로의 진입로를 열어둔다. 이런 배치는 잘 설계된 캠페인 웹디자인의 교과서적 흐름에 가깝다.
IA·SEO 전략
연 1회 열리는 대회라는 성격이 정보 구조의 핵심 과제를 규정한다. 히어로가 ‘Coming Soon’ 상태일 때도 검색 유입은 계속 들어오므로, 대회 개최 여부와 무관하게 살아 있어야 할 상설 콘텐츠(‘글로벌 6K란’, ‘물의 문제’, 식수위생 임팩트)는 연도 표기 없는 고정 URL에 두고, 2024·2025·2026처럼 회차별로 갈리는 페이지만 별도로 관리하길 권한다. 지난 대회 페이지를 지우거나 방치하면 소프트 404가 쌓이므로, 종료 대회는 아카이브로 남기고 canonical로 정본을 지정하는 편이 검색 자산을 지킨다.
이 유형에는 Event 구조화 데이터가 특히 유효하다. 대회명·일정(startDate)·장소·참가비(offers)를 스키마로 노출하면 검색 결과에서 행사 정보가 리치하게 걸린다. 커뮤니티의 현장 후기와 브이로그는 Article/VideoObject로 마크업해 개별 유입 관문을 늘릴 수 있다. 참가신청 퍼널의 각 단계 페이지는 title과 meta description을 고유화해 ‘글로벌 6K 참가신청’ 같은 실사용 검색어를 흡수하도록 다듬는 것이 좋다. 홈페이지 제작 단계에서 이 URL·스키마 뼈대를 먼저 세워두면 매년 대회를 새로 올릴 때 드는 SEO 비용이 크게 줄어든다.
성능·접근성
사진이 주인공인 사이트인 만큼 이미지 전략이 체감 속도를 좌우한다. 히어로와 풀와이드 밴드, Pictures 모자이크까지 대형 실사가 연달아 등장하므로 WebP/AVIF 병행 제공과 반응형 srcset은 선택이 아니라 기본이다. 첫 화면 히어로는 프리로드로 앞당기되, 하단 사진 그리드는 지연 로딩으로 초기 페인트를 방어한다. 모자이크 그리드는 이미지마다 width/height를 명시해 레이아웃이 뒤늦게 밀리는 CLS를 막아야 한다.
Video Of Global 6K의 유튜브 임베드는 파사드(façade) 패턴 — 썸네일만 먼저 띄우고 클릭 시점에 플레이어를 불러오는 방식 — 으로 바꾸면 초기 스크립트 부담을 크게 덜 수 있다. 손글씨 타이틀에 웹폰트를 썼다면 서브셋과 display=swap으로 텍스트 지연을 없앤다. 접근성 측면에서는 오렌지 위 흰 글자, 실사 위 텍스트의 대비 확보가 관건이다. 배경이 밝은 사진 구간은 반투명 오버레이로 가독성을 고정하고, 모든 사진에 의미 있는 대체 텍스트를, 참가하기 버튼에는 또렷한 포커스 링을 부여해 키보드 사용자의 전환 경로까지 챙기는 것이 완성도를 가른다.
디지털 파트너 더블루캔버스
글로벌 6K처럼 ‘참여 → 기부 → 임팩트’로 이어지는 캠페인은 예쁜 화면 하나로 끝나지 않는다. 감정을 움직이는 카피와 실사, 참가신청 퍼널, 회차별 대회 페이지, 후기 커뮤니티가 한 몸처럼 굴러가야 하고 그 뒤에서 검색 유입과 전환이 데이터로 측정돼야 한다. The Blue Canvas는 바로 이 지점을 묶는다. 비영리·캠페인·브랜드 웹사이트 제작을 기획설계부터 크리에이티브, 홈페이지 제작, SEO 검색엔진최적화, 퍼포먼스 마케팅까지 한 흐름으로 설계하고, 배포 후에도 측정과 개선을 반복한다. 후원 모집 랜딩의 전환율을 끌어올리고 싶은 단체라면, 이 캠페인이 보여준 스토리텔링 문법 위에 데이터 기반 운영을 얹는 방식을 함께 그려볼 수 있다.
마무리와 다음 스텝
월드비전 글로벌 6K는 ‘내가 달리는 6km’와 ‘아이가 물을 긷는 6km’를 포개는 단 하나의 은유로 캠페인 전체를 설득한다. 오렌지 단색의 일관성, 실사 스토리텔링, 기부 임팩트의 카드화까지 브랜드 표현의 기본기가 탄탄하다. 여기에 몇 가지만 더하면 완성도가 한 단계 올라간다. 첫째, 상설 콘텐츠와 회차별 페이지의 URL·canonical을 분리해 매년 반복되는 대회의 SEO 자산을 지킨다. 둘째, 대형 실사에 차세대 포맷과 지연 로딩, 유튜브 파사드를 적용해 체감 속도를 끌어올린다. 셋째, 참가신청 퍼널의 각 단계를 고유 메타와 이벤트 스키마로 다듬어 검색에서 곧장 신청으로 이어지는 길을 넓힌다. 좋은 캠페인 웹디자인은 감동에서 멈추지 않고 행동까지 데려간다.