젤리 UI(Jelly UI)가 웹 개발자들을 위한 새로운 컴포넌트 라이브러리 v1.1을 선보였습니다. 이 라이브러리는 기존 HTML 폼 컨트롤에 '소프트 바디(soft body)' 물리 효과를 결합하여, 마치 젤리처럼 눌리고 늘어나며 튕기는 듯한 촉각적 애니메이션을 제공합니다. 의존성 없이 단 하나의 모듈 스크립트만으로 설치 가능하며, 40개 이상의 커스텀 엘리먼트를 통해 다채로운 인터랙티브 웹 UI를 구현할 수 있습니다.
젤리 UI는 버튼, 체크박스, 슬라이더, 입력창 등 기본적인 폼 요소부터 토스트, 탭, 다이얼로그 같은 복합적인 컴포넌트까지 폭넓게 지원합니다. 특히 주목할 점은 네이티브 HTML 요소의 의미 구조(semantic structure)를 유지한다는 것입니다. 예를 들어, 버튼은 실제 `<button>` 태그를, 슬라이더는 숨겨진 `<input type="range">`를 활용하여 키보드 조작이나 스크린 리더(screen reader)와 같은 접근성 기능을 온전히 지원합니다. WCAG AA 색상 토큰과 ARIA 패턴을 내장하여 시각적 효과와 함께 접근성 높은 제품 인터페이스를 구축할 수 있도록 돕습니다. 또한, 다크 모드, 운영체제 테마 자동 추적, 강조색 변경, 오른쪽에서 왼쪽으로 쓰는 RTL(Right-to-Left) 배치 등 다양한 테마 및 레이아웃 옵션을 제공하여 개발 편의성을 높였습니다.
이러한 젤리 UI의 등장은 웹 인터페이스 디자인에 새로운 활력을 불어넣을 것으로 기대됩니다. 단순한 미적 요소를 넘어, 사용자의 행동에 대한 즉각적이고 직관적인 시각적 피드백을 제공함으로써 사용자 경험(UX)을 향상시킬 수 있습니다. 특히, 기존 네이티브 요소의 접근성을 해치지 않으면서도 독특한 인터랙션을 추가할 수 있다는 점에서 큰 장점을 가집니다. 다만, 일부 사용자들은 과도한 애니메이션이 오히려 방해가 될 수 있다는 의견이나, 성능 저하 가능성에 대한 우려를 제기하기도 했습니다. 이에 대해 개발팀은 애니메이션 루프를 최적화하고, `prefers-reduced-motion` 설정을 존중하는 등 지속적인 개선 노력을 기울이고 있습니다. 궁극적으로 젤리 UI는 웹사이트나 웹 애플리케이션에 재미와 몰입감을 더하고 싶은 개발자들에게 매력적인 선택지가 될 것입니다.