SP.AGCY
Available for new projects
 
02 / 09Selected project

MINGGINYU

Client
밍기뉴
Services
Web Design, Front-end, Back-end
Year
2026
Visit site
MINGGINYU 프로젝트 이미지 1
MINGGINYU 프로젝트 이미지 2
MINGGINYU 프로젝트 이미지 3
MINGGINYU 프로젝트 이미지 4
MINGGINYU 프로젝트 이미지 5
MINGGINYU 프로젝트 이미지 6
02 / 09 · Selected project

MINGGINYU

싱어송라이터 밍기뉴 디지털 아카이브

Client
밍기뉴
Year
2026
Services
Web Design, Front-end, Back-end
Stack
Next.js, React, TypeScript, Tailwind CSS, Drizzle ORM, MySQL, Docker, GitHub Actions
MINGGINYU 프로젝트 커버

Overview

밍기뉴 아카이브 · 나의 모든 이들에게,

싱어송라이터 밍기뉴(Mingginyu)의 노래·공연·영상·방송·굿즈를 연도별로 모은 디지털 아카이브입니다. 예정 공연과 유튜브 영상, 음원 링크, 팬들이 남긴 한마디까지 한곳에서 볼 수 있으며, 기획부터 디자인·개발·배포까지 모두 맡았습니다.

01

아티스트에 맞는 톤 찾기

문제 Problem가사를 곳곳에 인용한 첫 안은 과하게 감상적이라는 피드백을 받았고, 종이 질감과 밤하늘을 거친 안들도 아티스트의 분위기와 맞지 않았습니다.

해결 Solution석탄색 한 톤에 눈물색 강조 하나로 정리하고, 소개 문구는 사실과 아티스트 본인의 말만 남겼습니다. MINGGINYU 워드마크는 넓은 화면에서 왼쪽 가장자리에 세로로 세우고, 좁은 화면에서는 글자가 하나씩 떠오르는 가로 한 줄로 두었습니다. 엉엉토끼 캐릭터를 벡터로 다시 그려 메뉴·푸터·파비콘·공유 이미지에 같은 얼굴을 썼습니다.

결과 Result여러 번의 개편 끝에 아티스트의 표정이 드러나는 사이트가 되었습니다.

MINGGINYU 프로젝트 화면 1

02

연도별 선반과 서랍

과제 Task발매작과 수록곡, 공연, 영상이 많아도 지루하지 않게

아이디어 Insight노래는 해마다 한 칸씩 커버가 선반처럼 늘어서고, 누르면 서랍이 열려 수록곡과 미리듣기, 음원 링크가 펼쳐집니다. 공연은 다음 공연 카드와 목록으로, 영상은 격자로, 굿즈와 인스타그램은 벽처럼 배치해 구역마다 읽는 방식을 다르게 했습니다. 배경음악은 누를 때만 켜집니다.

결과 Result한 페이지 안에서 스크롤만으로 아티스트의 한 해를 훑을 수 있습니다.

MINGGINYU 프로젝트 화면 2

03

팬의 자리

내용 Description'밍기뉴에게,' 방명록에 팬이 한마디를 남기면 관리자가 승인한 뒤 공개되고, 글이 많아지면 화면 크기에 맞춰 나눠 불러옵니다. 최근 활동 구역이 새 글과 새 영상을 모아 보여 주고, 푸터에는 사이트 오류를 알릴 수 있는 메일 연락처를 두었습니다.

MINGGINYU 프로젝트 화면 3

04

쌓이는 운영

해결 Solution커버·굿즈·인스타그램 사진은 파일로 두고 DB에는 경로만 저장합니다. 수집기가 인스타그램과 유튜브의 새 소식을 발행 대기에 넣고 메일로 알리며, 관리자는 발매작·공연·영상·굿즈·문구·방명록을 한 곳에서 관리합니다. 운영 중 생기는 파일은 백업 스크립트가 DB와 함께 보관하고, 세 환경은 GitHub Actions로 배포됩니다.

MINGGINYU 프로젝트 화면 4
MINGGINYU 프로젝트 화면 5

Process

음원 사이트·유튜브·인스타그램을 조사해 발매작과 영상을 모으고, 디자인 초안을 캡처로 확인하며 피드백을 받아 고치는 과정을 반복했습니다. 커밋된 내용으로만 운영 빌드를 검증하는 규칙을 두어 배포 사고를 막았습니다.

Outcome아티스트의 활동이 늘어날수록 함께 쌓이는, 팬이 매일 들를 수 있는 아카이브입니다.

Next project