Project ideas from Hacker News discussions.

Jelly UI: Soft-body physics for native HTML form controls

📝 Discussion Summary (Click to expand)

Top Themes in the Discussion

Theme Summary
1. Love for the “jelly” look & desire for richer physics Users are excited by the soft‑body / jelly animation and want even more immersive effects (e.g., 3‑D rendering).
2. Accessibility & user‑control concerns Several commenters stress the need to respect prefers-reduced-motion and give users a way to override it or disable effects.
3. Performance and usability pitfalls The demo’s scroll‑snap implementation and jank on some devices are called out as problematic for a broad audience.

Key quotations

  • “This would be awesome if someone could add 3D rendering to make it actually look like I’m pressing a little jelly ball.” — an0malous
  • “Cute … but … it would probably be a good idea to allow the user to override that without having to change their system settings, or at least alert them that they won’t see the animations.” — TurkTurkleton
  • “Scroll‑snap is a really risky feature, and very niche in its reasonable applications.” — chrismorgan

These three themes capture the dominant enthusiasm, accessibility focus, and performance‑related criticism expressed in the thread.


🚀 Project Ideas

Generating project ideas…

JellyMotion Toggle Switch

Summary

  • A lightweight UI widget that lets users enable, disable, or dial down site‑specific animations without changing global OS accessibility settings.
  • Provides developers a simple “animation sensitivity” prop that respects prefers-reduced-motion and can be overridden per component.

Details

Key Value
Target Audience Web developers, accessibility‑focused users
Core Feature Per‑site animation override toggle with visual intensity slider
Tech Stack React, TypeScript, @media (prefers-reduced-motion: reduce) detection
Difficulty Low
Monetization Hobby

Notes

  • HN commenters lamented needing to dig into system settings to stop jarring animations; they’d love an in‑page control that does it instantly.
  • Practical utility for apps with heavy motion (e.g., data dashboards, gaming sites) and for users with vestibular sensitivities.

JellyPhysics UI Components

Summary

  • A library that adds true soft‑body physics (elastic deformation, target‑zone expansion) to interactive UI elements like buttons and sliders.
  • Delivers realistic “jelly” feedback that feels tactile and visually satisfying.

Details

Key Value
Target Audience UI/UX designers, game‑like web app developers
Core Feature Physics‑driven button press ripple with dynamic hit‑area scaling
Tech Stack React, @react-three/fiber, three.js, @use-cannon/react-three-spring
Difficulty Medium
Monetization Revenue-ready: Subscription $5/mo for premium components

Notes

  • Commenters asked for visible physics; they’d love a component that actually simulates jelly‑like elasticity instead of just CSS animations.
  • Ideal for gaming portals, onboarding flows, and any product that seeks to blend accessibility with playful interaction.

JellyKey OTP Widget

Summary

  • An accessible OTP input that enforces a single field, supports paste, and renders placeholder boxes using monospace styling.
  • Includes built‑in reduced‑motion handling and optional target‑enlargement for motor‑impaired users.

Details

Key Value
Target Audience FinTech, security, and SaaS product developers
Core Feature Auto‑sized input with visual box count, paste detection, and ARIA‑compliant keyboard navigation
Tech Stack Vue 3 + TailwindCSS, or React + Radix UI primitives
Difficulty Medium
Monetization Revenue-ready: One‑time license $15

Notes

  • HN users ranted about broken OTP designs; they’d appreciate a correctly‑behaving component that solves all edge cases.
  • Addresses a real usability pain point and aligns with accessibility best practices, likely to be shared widely in dev communities.

Read Later