Vibe coding still needs
UX development.
The faster ideas become code, the more it matters that people can understand and enjoy what you build. Learn the principles and practice of UX development through courses, tutorials, and articles.
UX Development Courses
D3 Data Visualization
From bar charts to interactive 3D globes — 6 essential D3.js v7 patterns
개발 환경 입문
터미널부터 Vercel 배포까지 — 코딩 경험 없이 시작하는 개발 환경 세팅
GSAP Animation
Scroll effects, 3D transforms, SVG drawing, smooth scroll — 17 essential GSAP patterns
Three.js for Interactive Content
Build scroll-driven 3D scenes, product viewers, particle systems, and shader effects — patterns you can ship on real projects
Vibe Coding for UX Engineering
Build production-ready UI with Claude Code — prompting, iteration, CSS, GSAP animations, JS interactions, and real project delivery
Hands-on Tutorials
Start with the finished result, then compare it with the source to quickly understand the implementation and core patterns. Apply what you need directly to your work.
Blog
Insights on UX, interaction, and front-end implementation in the age of vibe coding.
-
Dia 브라우저란? 웹페이지와 대화하는 AI 브라우저 사용법 Dia는 웹페이지를 읽는 데서 그치지 않고, 보고 있는 내용에 질문하고 필요한 정보를 정리하도록 돕는 AI 브라우저입니다. Arc와의 관계부터 페이지 채팅, Reports, 설치 조건과 요금제, 개인정보 설정까지 처음 사용하는 사람의 관점에서 살펴봅니다. -
빅데이터분석기사란? 2026년 필기·실기 취득방법과 SQLD·ADsP 비교 데이터 분석이나 AI 분야에 관심이 있다면 한 번쯤 접하게 되는 자격증이 빅데이터분석기사입니다. SQLD·ADsP와 무엇이 다른지, 응시자격부터 필기·실기와 최종 취득 절차까지 살펴보고 자신의 학습 목적에 맞는 준비 순서를 정리합니다. -
젤다는 왜 여행으로 기억될까: 야숨·왕눈과 스카이림의 UX 야숨과 왕눈에서 오래 남는 것은 퀘스트의 결말만이 아니다. 비 때문에 돌아간 절벽과 직접 찾아간 장소도 기억이 된다. 풍경을 읽고 경로를 선택하는 UX가 여행감을 만드는 과정을 스카이림과 비교하며, 그래픽과 기억에 대한 단정도 다시 살펴본다. -
Hermes Agent vs OpenClaw: 2026년 현재 더 앞선 AI 에이전트는? 대화만 나누는 AI를 넘어, 파일을 읽고 터미널과 브라우저를 조작하며 예약 작업까지 수행하는 개인용 AI 에이전트 런타임이 빠르게 성장하고 있습니다. 오픈소스 진영에서는 Hermes Agent와 OpenClaw가 대표적인 비교 대상입니다. -
Aside vs Claude Desktop vs Playwright: 브라우저 제어 방식은 어떻게 다를까? 브라우저 자체가 에이전트인 Aside, 브라우저를 도구로 쓰는 Claude Desktop, 코드 중심 자동화 프레임워크 Playwright를 구조·로그인·판단·반복 안정성 관점에서 비교합니다.