ALL PROJECTS
출시2026 – 진행 중

Aiden Portfolio

개인 프로젝트와 커리어를 담은 미니멀 포트폴리오 웹

프로젝트, 여정, 실적을 제품 중심으로 정리한 개인 포트폴리오 사이트

여러 프로젝트와 커리어 타임라인을 미니멀한 다크 UI로 정리한 개인 포트폴리오 웹. Hero, Hello, Journey, Selected Projects, Elsewhere, Footer로 이어지는 구조 위에서, 단순한 작업 나열이 아니라 '문제 정의에서 제품화로'라는 일관된 서사를 중심으로 구성한 사이트. 프로젝트 정보를 JSON 데이터로 분리해 관리하고 상세 페이지로 확장할 수 있게 만들어, 포트폴리오 자체를 하나의 제품처럼 다루는 것을 목표로 한 제품.

브랜딩 방향, 섹션 구조, 프로젝트 데이터 구조, 프론트엔드 구현을 담당

FrontendBrandingContent Structure

Problem

다양한 프로젝트와 수상·활동이 흩어져 있으면, 각각은 인상적이어도 '이 사람이 무엇을 하는 사람인가'라는 하나의 포지셔닝으로 전달되지 않는 문제. 정보가 많을수록 오히려 핵심 서사가 흐려지는 한계.

Solution

제품 중심 스토리텔링과 절제된 미니멀 UI로 핵심 프로젝트와 성장 흐름만을 선별해 보여 주는 구성. 연도별 여정과 대표 프로젝트를 연결해, 흩어진 결과물을 하나의 커리어 서사로 정리하는 흐름.

Key features

Journey Timeline

연도별 성장 흐름과 핵심 전환점을 정리해, 결과물이 아니라 '어떻게 발전해 왔는가'의 맥락을 보여 주는 타임라인.

Project System

프로젝트를 JSON 데이터 기반으로 관리하고 상세 페이지로 확장할 수 있게 설계해, 콘텐츠가 늘어나도 일관된 구조로 유지되는 설계.

Minimal Dark UI

검정 배경과 제한된 포인트 컬러, 절제된 모션으로 '조용한 자신감'의 인상을 만들어 콘텐츠에 집중시키는 UI.

Tech stack

프론트엔드
Next.jsReactTypeScript
인프라
VercelCloudflare DNS
도구
Framer Motion

Architecture

Next.js·React·TypeScript 기반의 정적/동적 섹션 구조에 Framer Motion으로 절제된 인터랙션을 더하고, Vercel로 배포하며 Cloudflare DNS로 도메인을 관리하는 구성. 프로젝트 데이터를 JSON으로 분리해 만든 데이터 주도 렌더링 구조.

Learnings

포트폴리오는 정보를 많이 나열하는 페이지가 아니라, 프로젝트 사이의 흐름과 포지셔닝을 명확히 보여 주는 하나의 제품이라는 점. 무엇을 빼느냐가 무엇을 넣느냐만큼 중요하다는 것을 직접 설계하며 깨달은 교훈.