Hatt 홈페이지를 공개했습니다

Hatt의 창작 활동을 모은 개인 사이트 “Hatt 홈페이지”를 공개했습니다.

이 사이트는 그림, 소설, VRChat용 3D 아바타와 기믹 제작을 하나의 입구로 정리한 홈페이지입니다. Acecore의 실적 페이지에도 웹 제작 및 CMS 구축 사례로 게재했습니다.

제작 배경

Hatt는 그림과 소설, VRChat용 3D 아바타와 기믹 제작 등 여러 창작 활동을 하고 있습니다.

하지만 활동의 입구는 블로그, 외부 투고 사이트, BOOTH, YouTube, X 등으로 나뉘어 있었습니다. 작품과 발신 채널은 이미 있었지만, 처음 방문한 사람이 “Hatt가 무엇을 만들고 있는지”, “어디서부터 보면 좋은지”를 짧은 시간 안에 파악하기 어려운 상태였습니다.

그래서 이번에는 모든 작품을 한 페이지에 넣는 것이 아니라, 활동 전체를 보여주는 허브로 사이트를 설계했습니다.

세 가지 활동을 첫 화면에서 보여주기

첫 화면에서는 Hatt의 활동을 다음 세 가지로 정리했습니다.

• 그림: 캐릭터와 세계관 메모를 글과 작품으로 남겨 가는 공간
• 소설: 외부 투고 사이트에 공개한 이야기로 가는 입구와 창작 관련 기록
• 모델링: VRChat용 아바타, 기믹, 액세서리 제작 소개

먼저 “무엇을 하는 사람인지”를 전달한 뒤 블로그, 모델링 작품, 프로필, 외부 링크로 이어지는 구성입니다. 개인 사이트에서는 시각적인 첫인상뿐 아니라 활동 분류와 동선 설계가 중요합니다.

계속 업데이트할 수 있는 정적 사이트

구축에는 Astro, TypeScript, UnoCSS, Sveltia CMS, Pagefind를 사용했습니다.

Astro로 정적 사이트를 배포해 표시 속도와 유지보수성을 확보했습니다. 블로그와 작품 정보는 CMS에서 편집할 수 있어, 코드를 작성하지 않아도 계속 발신하기 쉬운 구조입니다.

사이트 내 검색에는 Pagefind를 넣었습니다. 글과 작품이 늘어나도 방문자가 키워드로 원하는 정보에 도달할 수 있도록 하기 위해서입니다.

Astro 사이트에서 SEO와 OGP를 정리하는 방식은 Astro 사이트에 구조화 데이터와 OGP를 구현하는 SEO 개선 가이드에서도 소개하고 있습니다.

외부 활동 공간도 끊지 않기

Hatt의 활동은 사이트 안에서만 끝나지 않습니다. 소설 투고 사이트, BOOTH, YouTube, X 등 작품에 따라 적합한 공개 장소가 있습니다.

따라서 홈페이지는 외부 서비스를 대체하지 않고, 입구로 연결하는 방향으로 만들었습니다. 예를 들어 모델링 페이지에서는 BOOTH에 공개한 아바타와 기믹으로 이동하기 쉽게 하고, YouTube와 X 링크도 정리했습니다.

개인 사이트나 포트폴리오 사이트에서는 이미 존재하는 외부 계정을 억지로 통합하기보다, 방문자가 헤매지 않고 이동할 수 있는 동선을 만드는 것이 더 효과적인 경우가 있습니다.

실적으로도 게재했습니다

Acecore의 실적 및 포트폴리오에는 “Hatt 홈페이지 제작”으로 사례를 추가했습니다.

이번 제작은 단순히 페이지를 공개하는 것에 그치지 않고, 창작 활동의 정리, CMS 업데이트, 검색, OGP, 사이트맵, 외부 링크 설계까지 포함한 웹 제작입니다. 작은 개인 사이트라도 공개 후에 키워 갈 수 있는 구조를 갖추면 작품과 글이 늘어났을 때 가치가 커집니다.

웹사이트 제작 상담은 웹사이트 제작 및 운영 서비스 또는 문의하기에서 가능합니다.

정리

Hatt 홈페이지는 그림, 소설, VRChat용 3D 아바타와 기믹 제작을 모은 창작 활동의 입구로 공개했습니다.

Acecore는 개인 사이트, 포트폴리오 사이트, 비즈니스 사이트 등 목적에 맞춘 웹사이트를 제작합니다. 활동 내용 정리부터 CMS, 검색, SEO, 공개 후 운영까지 함께 상담하고 싶다면 웹사이트 제작 및 운영 서비스 또는 문의하기에서 연락해 주세요.