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.
-
ChatGPT Chat·Work·Codex 선택 가이드: 모델과 effort를 업무에 맞추는 법 ChatGPT에서 무엇을 쓸지 고민할 때는 원하는 결과부터 정하는 편이 좋습니다. 대화로 생각을 정리할지, 검토할 파일을 만들지, 저장소를 수정할지에 따라 Chat·Work·Codex를 고르고, 작업의 복잡도와 검증 방법에 맞춰 모델과 effort를 조절하는 실용적인 기준을 살펴봅니다. -
Aside Browser 실전 자동화: 요금제 조사부터 청구서 수집과 미팅 준비까지 탭을 옮겨 다니며 요금제를 비교하고, 청구서를 내려받고, 미팅 자료를 정리하는 일은 많은 시간을 씁니다. Aside Browser는 이런 웹 작업을 자연어로 맡기는 AI 브라우저입니다. 중요한 것은 긴 요청 한 번보다 입력과 결과물을 정하고, 검증한 작업을 반복 실행하는 방식입니다. -
Hermes Agent 자동화 실전: 브리핑·문서 정리·상태 점검을 맡기는 방법 매일 같은 자료를 찾아 요약하고, 회의 내용을 위키에 옮기고, 서버 상태를 확인한다면 자동화할 여지가 있다. Hermes Agent의 실제 활용 사례를 살펴보고, 브리핑·문서 수정안·상태 점검을 직접 구성하는 방법과 운영할 때 확인할 기준을 정리한다. -
OpenCode 실전 입문: 터미널·편집기·팀 개발에서 AI 에이전트 활용하기 OpenCode는 터미널과 편집기에서 코드를 읽고 수정하며 검증 작업을 이어 가는 오픈 소스 AI 코딩 에이전트입니다. 모델을 연결하는 법부터 프로젝트 규칙과 권한 설정, 실제 개발 환경에 맞는 작업 흐름까지 알아두면 작은 수정에서 팀 단위 협업으로 활용 범위를 넓힐 수 있습니다. -
Linear 입문: 프로젝트 관리부터 팀 위키와 업무 협업까지 Linear는 할 일, 프로젝트 일정, 기획 문서와 팀 운영 지식을 연결하는 협업 도구입니다. 이슈·프로젝트·사이클의 차이부터 팀 위키 구성, 개발·메신저 연동, 2주 도입 예시와 요금제 선택 시 확인할 조건까지 살펴봅니다.