프로젝트 상담 신청 위메이드 - UX/UI 리뷰 | The Blue Canvas
UX/UI Review

위메이드 Website Design Review

2026-03-09·브랜드/웹 리뷰

MADE FOR THE FUTURE. 어두운 숲과 금빛 입자 위로 떠오르는 한 줄 카피부터 WEMIX 3.0 생태계까지, 위메이드가 게임·기술 기업의 정체성을 웹에서 어떻게 연출하는지 살펴봤다.

협업 문의 및 자세히 보기

개요

위메이드(Wemade)는 미르 IP로 이름을 알린 뒤 블록체인 플랫폼 WEMIX까지 영토를 넓힌 게임·기술 기업이다. wemade.com/kr의 첫 화면은 회사 소개서라기보다 한 편의 티저 영상처럼 열린다. 어두운 고목과 금빛 입자가 흐르는 배경 위로 MADE FOR THE FUTURE라는 흰색 대문자 카피가 떠오르고, 하단의 SCROLL DOWN 큐가 다음 장면을 재촉한다. 정보를 나열하는 대신 분위기로 먼저 말을 거는, 게임 회사다운 첫인상이다. 이번 리뷰는 이 시네마틱 히어로가 스크롤을 따라 WHO WE ARE(정체성) → 게임 포트폴리오 → WEMIX 3.0 생태계 → 파트너·채용으로 이어지는 서사 설계와 그 UX/UI 완성도를 하나씩 뜯어본다. 브랜드 무드는 강렬한데, 웹사이트 제작 관점에서 검색·성능·접근성의 기초 체력은 어디까지 챙겼는지가 관전 포인트다.

위메이드 웹사이트 메인 스크린샷

브랜드 & 메시지

브랜드 언어가 명확하다. 페이지는 WHO WE ARE, A PLATFORM FULL OF POSSIBILITIES, OUR PARTNERS WHO MADE IT POSSIBLE, JOIN THE FUTURE처럼 무겁고 굵은 영문 대문자 타이틀로 장(章)을 나누고, 그 아래 한국어 서브카피가 의미를 채운다. WHO WE ARE 섹션의 “위메이드는 게임과 기술을 통해 세상의 변화를 만들어가는 기업입니다”라는 한 문장이 회사의 가치 제안을 정직하게 요약한다. 시각적 중심에는 크롬빛으로 렌더링된 WM 엠블럼 — 음파 형태의 로고를 새긴 은청색 코인 — 이 놓여, WEMIX 코인 3종과 함께 반복되며 브랜드 자산으로 각인된다. 컬러는 검정을 무대로 삼고 크롬 실버가 광택을 얹으며, JOIN THE FUTURE 구간에서만 보라 그라디언트로 리듬을 전환한다. CTA는 과장 없이 절제돼 있다. 플랫폼 섹션의 ‘더 알아보기’, 그리고 하단의 Become Our Partner / Join Our Team 두 카드가 화살표(→) 어포던스로 다음 행동을 안내한다. 다만 글로벌 내비게이션이 상단에 상시 노출되지 않고 콘텐츠 흐름과 푸터(Home·About Us·Games·Blockchain·News·Work with Us)에 의존하는 구조라, 목적이 뚜렷한 방문자에게는 이동 경로가 한 박자 길어진다.

키워드: 시네마틱 히어로, 크롬 WM 엠블럼, 영문 챕터 타이틀, 절제된 이원화 CTA

UX/UI 관점

웹디자인 완성도는 게임 회사의 눈높이답게 높다. 화면에서 확인된 강점을 정리하면 이렇다. 첫째, 스크롤 기반 챕터 서사다. 각 섹션이 대문자 영문 타이틀로 명확히 구분돼, 방문자가 지금 어느 장을 읽는지 직관적으로 인지한다. 둘째, 크롬 3D 오브젝트의 일관된 반복이다. WM 엠블럼과 WEMIX 코인들이 여러 섹션에 걸쳐 등장하며 브랜드 기억점을 만든다. 셋째, 게임 포트폴리오의 선택적 강조다. Legend of Ymir를 진하게 띄우고 Night Crows·MIR 4·The Midnight Walkers·MIR 5·Anipang은 흐리게 리스트업해, 배경 게임 스크린샷과 함께 하나씩 전환되도록 설계했다. 넷째, 컬러 대비의 리듬이다. 어두운 무대 위 흰 타이포가 몰입을 만들고, JOIN 섹션의 보라 전환이 지루함을 끊는다. 다섯째, 목적 분리형 CTA다. 파트너십(B2B)과 인재 채용을 별개의 문으로 갈라 사용자 의도를 흩뜨리지 않는다. 여섯째, 파트너 로고 그리드다. NVIDIA·Microsoft·DRX·Chainlink·TWOHANDS·CIRCLE 등을 정갈한 격자에 담아 신뢰 신호를 쌓는다. 아쉬운 지점도 있다. 흐리게 처리한 게임 목록과 회색 서브카피는 어두운 배경과의 명도 대비가 낮아 가독성이 떨어지고, SCROLL DOWN에 의존하는 진행은 스크롤 위치 감각이 약한 사용자에게 현재 위치를 알려주는 인디케이터가 있으면 더 친절하다.

IA·SEO 전략

이 사이트는 단일 흐름의 시네마틱 브랜드 페이지라, SEO 관점의 과제도 그 형식에서 나온다. 우선 화면을 지배하는 영문 대문자 타이틀이 이미지가 아닌 실제 텍스트 요소인지 점검이 필요하다. 디자인상 로고처럼 보이더라도 크롤러가 읽을 수 있는 마크업이어야 검색 문맥이 살아난다. 다음으로 /kr 로케일이다. 위메이드는 상하이·도쿄·어바인·싱가포르 거점을 가진 글로벌 기업인 만큼 kr과 글로벌·영문 페이지 간 hreflang 정합성을 맞춰 중복·언어 오배치를 막아야 한다. 푸터가 About Us·Games·Blockchain·News, 그리고 Investors·ESG 같은 IR 페이지로 뻗는데, 이들 하위 페이지마다 고유하고 구체적인 <title>과 meta description을 부여하는 것이 실질적 유입을 만든다. 특히 News/IR은 검색 표면이 넓은 콘텐츠 자산이므로 정기 갱신과 내부 링크 강화가 유효하다. 구조화 데이터는 Organization 스키마로 회사 정보를 명시하고, 개별 게임은 CreativeWork/VideoGame 유형으로 마크업하면 리치 결과 가능성을 높일 수 있다.

성능·접근성

성능의 승부처는 첫 화면이다. 금빛 입자가 흐르는 어두운 히어로가 동영상이나 대용량 이미지라면 LCP를 직접 끌어올리는 요인이 된다. 포스터 프레임을 프리로드하고, 본편은 압축·지연 재생으로 분리해 초기 페인트를 앞당기는 접근이 필요하다. 크롬 WM 엠블럼과 WEMIX 코인이 3D·캔버스 렌더링이라면 뷰포트 진입 시점에만 초기화해 메인 스레드 점유를 낮추고, 늦게 뜨는 엠블럼이 레이아웃을 밀어 CLS를 유발하지 않도록 자리를 미리 확보해야 한다. 굵은 영문 디스플레이 폰트와 한글 웹폰트가 함께 쓰이므로 서브셋·display=swap·프리로드 조합으로 폰트 지연을 줄이는 것이 체감 속도에 크게 작용한다. 접근성 측면에서는 앞서 짚은 흐린 게임 목록과 회색 서브카피의 명도 대비를 WCAG 기준까지 끌어올리는 것이 우선이다. 파티클과 스크롤 연동 모션은 prefers-reduced-motion을 존중해 멀미 위험을 줄이고, 장식용 크롬 엠블럼은 의미 없는 대체 텍스트 대신 스크린리더에서 숨김 처리하되 정보성 이미지에는 서술적 alt를 부여해야 한다. 화살표(→)로만 표현된 CTA에도 텍스트 라벨과 포커스 링을 붙이면 키보드 사용자까지 아우른다.

디지털 파트너 더블루캔버스

위메이드처럼 강한 세계관과 IP를 가진 브랜드에게 웹사이트는 단순한 소개 창구가 아니라 팬과 파트너, 투자자를 동시에 설득하는 무대다. 시네마틱한 무드는 살리되 검색 유입과 성능, 접근성이라는 기초 체력까지 갖춘 홈페이지 제작이 관건인 이유다. The Blue Canvas(더블루캔버스)는 바로 이 지점을 메운다. 브랜드 서사를 해치지 않는 웹디자인 위에 크롤러가 읽는 마크업, Core Web Vitals를 고려한 성능 설계, 그리고 유입을 전환으로 잇는 퍼포먼스 마케팅을 하나의 로드맵으로 엮는다. 게임·엔터·플랫폼처럼 감성과 데이터가 함께 필요한 업종의 홈페이지 제작과 SEO, 광고 운영을 고민하고 있다면, 기획부터 디자인·개발·실험까지 이어지는 통합 실행이 답이 된다.

The Blue Canvas 바로가기

마무리와 다음 스텝

위메이드 웹사이트는 브랜드를 ‘보여주는’ 데는 확실히 성공한다. MADE FOR THE FUTURE로 시작해 WEMIX 3.0 생태계로 닫히는 서사와 크롬빛 비주얼은 게임·기술 기업의 자신감을 그대로 전한다. 남은 과제는 이 강한 무드를 검색·성능·접근성이 받쳐주도록 다듬는 일이다. 실행 제안은 셋이다. 첫째, 흐린 게임 목록과 서브카피의 명도 대비를 높이고 현재 위치를 알려주는 스크롤 인디케이터를 더해 가독성과 탐색성을 함께 끌어올린다. 둘째, 히어로 미디어와 3D 엠블럼의 로딩 전략을 재배치해 LCP·CLS를 잡고, hreflang과 하위 페이지 메타를 정비해 글로벌 검색 표면을 넓힌다. 셋째, 두 갈래 CTA(파트너·채용) 이후의 여정을 측정 가능한 지표로 연결해, 무드에서 행동으로 이어지는 UX/UI를 데이터로 재검증한다. 인상은 이미 충분하다. 다음은 그 인상이 성과로 남도록 만드는 단계다.