데브허브 | DEVHUB | Animations that should not exist on the webAnimations that should not exist on the web
- 타이프라이터 효과는 사용자 경험을 저해하고 핵심 메시지 전달을 방해하므로 지양해야 합니다. 🚫
- 750ms를 초과하는 느린 애니메이션은 페이지 로딩 및 상호작용을 지연시켜 사용자를 짜증나게 합니다. 🐢
- 스크롤 방향에 따라 애니메이션 속도가 달라지는 등 일관성 없는 움직임은 어색하고 아마추어적으로 보입니다. ⚖️
- 여러 요소가 동시에 움직여 사용자의 주의를 분산시키는 과도한 애니메이션(안티-포커스)은 피해야 합니다. 😵💫
- 사용자의 자연스러운 스크롤 동작을 방해하는 스크롤 재킹은 페이지 탐색을 어렵고 답답하게 만듭니다. 🚧
- 사용자가 제어할 수 없이 계속 움직이는 자동 재생 슬라이드(정지 불가)는 정보 습득을 방해합니다. 🛑
- 콘텐츠 접근을 지연시키는 불필요한 로딩 화면은 사용자 경험을 저하시킵니다. ⏳
- 애니메이션은 미묘하고 간결하게 사용하여 전문적인 느낌을 유지해야 합니다. ✨
- 초보자는 커스텀 애니메이션 대신 Tailwind CSS 애니메이션 플러그인이나 Magic UI 같은 사전 정의된 솔루션을 사용하는 것이 좋습니다. 🛠️
- React 환경에서는 Framer Motion이 GSAP보다 더 나은 통합과 유연성을 제공하는 추천 라이브러리입니다. 🚀