나는 내 불안감을 Google AI로 예술로 바꾸었다 (그리고 이것을 만들었다)

Source: Dev.to

Introduction

이 제출물은 Google AI가 주관한 새해, 새로운 당신 포트폴리오 챌린지를 위해 제작되었습니다. 저는 항상 세상을 다르게 인식한다는 느낌을 받았고, 웹은 종종 정적이고 “생기가 없다”는 느낌이 들었습니다. 그래서 사용자 인터페이스에 인간적인 감각을 불어넣어 진정한 생명을 불어넣고 싶었습니다.

Project Overview

포트폴리오는 경험을 위해 만들어졌습니다—모든 상호작용이 중요합니다. 예를 들어, 배너 모서리에 마우스를 올리면 파도가 움직이고 테마를 수동으로 전환할 수 있습니다.

Note: 아래 임베드된 내용은 화면 크기 때문에 일부 기능이 제한될 수 있습니다. 전체적인 몰입형 경험을 원하시면 직접 방문해 주세요: byadhd-dev

이 프로젝트는 단순한 포트폴리오를 넘어 Artode—Art + Code의 결합을 실현한 것입니다. 풀타임 직장을 병행하면서 15일간의 “바이브 코딩” 스프린트를 통해 복잡한 씬, 맞춤 아이콘 패키지, 전체 포트폴리오를 구축해 그 비전을 구현했습니다.

Tools & Workflow

• Google AI Studio – 배너의 복잡한 테마와 살아있는 씬을 디자인하고 “감각”이 완벽해질 때까지 반복했습니다. 스튜디오에서 직접 GitHub에 코드를 푸시해 아이디어에서 로컬 환경으로의 전환을 매끄럽게 만들었습니다.
• Antigravity – Next.js 애플리케이션의 엔진 역할을 했습니다.
• Gemini 3 Pro & Flash models – 개발 작업의 약 95 %를 담당했습니다(요청 제한에 걸릴 때만 중단). 파티클 효과 구상, 복잡한 로직 구현, 단순 문법을 넘어선 바이브 이해 등을 도와주었습니다.

이 워크플로우 덕분에 제 비전을 혼란스러운 생각의 소음에 휘말리지 않고 명확히 표현할 수 있었습니다.

Features

Interactive Banner & Theme Switcher

태양과 파도 시스템이 생동감 있는 씬이자 기능적인 테마 스위처로 작동해 자연스러운 빛 주기를 모방합니다.

Artode‑Icons Package

표준 아이콘이 제가 전달하고 싶은 이야기에 너무 딱딱하게 느껴져 만든 맞춤 아이콘 세트입니다.

“No Guilt” Contribution Graph

활동 연속성보다 미적 요소를 우선시하는 GitHub 기여 그래프이며, 압박감보다 기여의 예술성을 강조합니다.

Gamified Endorsements

두 개의 인터랙티브 구가 커서를 따라 움직이며 충돌 시 내용이 바뀌어, 적은 추천 수라는 약점을 재미있고 매력적인 순간으로 전환합니다.

Life in Posters

생활을 촉각 포스터로 기록하는 취미를 반영해, 특히 모바일 기기에서 독특한 상호작용 감각을 제공합니다.

Story‑Based Scroll

텍스트가 포커스로 스냅되는 내러티브 스크롤 경험으로, 제가 직접 감정을 큐레이션된 개인적인 방식으로 전달할 수 있게 합니다.

Particle Engagement

“메모 남기기” 섹션에서 텍스트가 파티클로 흩어지거나 프로젝트 캔버스가 호버 시 변형되는 등, 모든 요소가 사용자가 놀고 탐험하며 참여하도록 유도합니다.

Philosophy & Reflection

아름다운 두뇌와 적절한 표현력이 결합되면 모든 것이 제자리를 찾는다는 것을 깨달았습니다. 평범함을 거부함으로써 정적인 요소들을 살아있는 경험으로 바꾸어 제 감정을 반영하고 불안을 극복했습니다. 개발 과정은 코딩이라기보다 논리로 그리는 그림과 같았으며, 마침내 제 언어를 말해주는 툴스택 덕분에 가능했습니다.

Acknowledgements

DEV Community와 Google Team에게 이 멋진 챌린지를 마련해 주신 것에 감사드리며, 강력한 AI 도구를 저와 같은 제작자들이 저렴하고 접근하기 쉬운 형태로 제공해 주신 Google에도 큰 감사를 전합니다.