Birbla

Join the discussion

Write your take first — we'll ask for email only when you're ready to publish.

Sign in
  • Hacker News
  • I like this a lot and am going to experiment w/ incorporating in my early literacy app.

    Heads up: the "See it live in the showcase → " links in the API documentation do not go back to the showcase - they just reload the same current API section.

    Question: maybe I've missed it, but what exists here wrt distribution / packaging / bundling / source availability? I see MIT listed, but no repo. I see src="https://jelly-ui.com/package.js" as a sourcing import, but obviously I'm not going to bundle foreign assets into my app.

    by NiloCK
  • https://github.com/jelly-org/ui

    It's buried at the bottom. Had to click on the "sponsoring" link, and then select the package.

    Feels like they should make the repository more prominent.

    by marklubi
  • I dont get why people are so mad at this? Looks fun, will I ever use it? Probably not, but it looks fun
    by tiohijazi
  • i think on HN you tend to get overly critical non-useful signals

    very important to filter out and choose who you engage with

    by zuzululu
  • Agreed. This is the liquid glass interaction the world deserved
    by madebysnacks
  • We're porting our electron app to it as we speak
    by OsrsNeedsf2P
  • A single function button should not behave differently based on where on the button you click it.

    EDIT: It's also WILDLY inconsistent. Click and drag on a button and the shape doesn't change. Click and drag on an on/off and the deformation follows the mouse. Merely click an on/off and the deformation does not follow the the little circle thingy, or bear any relation to the action of the button.

    Some of the things are inoffensive, spinner dots, progress bars, accordion menus. But basically anything that deforms on click related to where you click are nonsense.

    EDIT 2: The buttons in the demo area apparently do have distortion that follows the mouse, but on the left side they don't? For me this is just a lot of bafflingly inconsistent gloss that makes me wonder what's going on or why one thing behaves differently than others, and what that means for actual functionality. Rather than just interacting with the UI.

    by snitty
  • I don't fully understand the "soft-body physics" part. What's that supposed to mean? Looks like a generic UI library, not a really good one.

    opacity: 0.5 for disabled elements is a crime.

    pointer-events: none on disabled elements and claiming WCAG AA compliance? Ew.

    by gloosx
  • Meta, but is there a good resource to find these types of HTML UI component frameworks? I have googled and searched but all I get a listicle-style pages that aren't very curated.
    by nielsbot
  • https://github.com/topics/design-system
    by robofanatic
  • Okay I know this is gonna sound rude but who in the world would want form controls that behave this way?
    by DonsDiscountGas
  • Most pages aren't meant to be 100% utilitarian. Most are meant to be little bits of art, that faces a user, that the user will enjoy interacting with.
    by nomel
  • candy store, ice-cream place, kid's website?
    by robofanatic
  • Me.
    by MarvinYork
  • I would say that this is a joke, someone made a wobbly UI, isn't that funny. But I get a bit worried when trying to gauge much work went into this that is not required for the joke. It looks like the author actually expect people to pick up this thing and use it, and that is kind of scary.
    by NohatCoder
  • Sometimes we built for the pure joy of making. Practicality is a bonus.
    by baldvinmar
  • I'm having trouble identifying any physics at all in this UI design system.
    by nerdsniper
  • The library does respect the client-side reduce motion setting (by disabling all animated effects).
    by hedgehog
  • It's cute. But the reaction time on some of the controls is so awful. If I click and drag the slider control back and forth, it lags behind the mouse cursor substantially. It should feel like it's stuck to the mouse cursor like glue.

    By contrast, most of the other controls do seem to stick to the cursor, such as jelly-resizable.

    Also, the "Placeholder" control seems to fail to actually make the placeholder disappear when clicked in.

    by JoshTriplett
  • This comment is for like three people on HN, but anybody remember when Paul Neave had a website/blog/showcase (c.2007-2010ish?) where the borders of the page had similar jelly effect? That was achieved with Flash back in the day.

    Neave was a personal hero of mine back then... hope you're well if you're reading this!

    by jszymborski
  • I used to "get high" as a kid on the spiral illusion thing he built :)
    by rglover
  • Haha, yep, first thing I thought of as well. I still have a offline copy of that exact site saved somewhere.
    by DrSiemer
  • I love this, but it does not seem to conform to standard UX best practices.

    If I click and hold then move the mouse away to release, I assume an element should not register that as a click. As-is, this is inconsistent: the button registers a click, the checkbox does not.

    by itishappy
  • Good catch. I've updated the button logic. The click will no longer trigger if the cursor is outside the button boundary.
    by baldvinmar
  • I always had this issue when working with Flash developers. A common mantra was "don't reimplement scrollbars unless you can implement all the features a scrollbar comes with." They always had to do more than five iterations and spent days on that scrollbar.
    by smilespray
  • If I were younger I would love this. nowadays I spend most of the time tweaking websites to remove this stuff using local stylesheets...or using dark + read mode... how times have changed.
    by orliesaurus
  • I have enabled "reduced motion", so this site doesnt work for me.
    by aitchnyu
  • I flip back and forth every year or so between wanting more fun in my software, and wanting it to get the hell out of my way.
    by ryanmcbride
  • I like the fact that it gives animated feedback to emphasize what is happening/being altered. Native components don't always do that very well. Animations are not just artsy fluff, they have real UX value (if done right, of course).
    by blauditore
  • Cute (and I mean that sincerely, not sarcastically), and I appreciate that it appears to gracefully degrade for `@media (prefers-reduced-motion: reduce)`, but for the demo site, 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.
    by TurkTurkleton