user avatar
Janum Trivedi
@jmtrivedi
Designer, prototyper, and engineer. @OpenAI × LoveFrom Before: @airbnb, @browsercompany, @netflix, SpringBoard at 
North Beach, SF
Joined October 2009
Posts
  • Pinned
    user avatar
    I'm open-sourcing Wave, a spring-based animation engine for iOS! Wave makes it easy to build fluid, interruptible animations out-of-the-box. And if you've been following my recent UI demos, you've already seen it in action: they're all built with Wave!
  • user avatar
    So excited to share one of my white-whale projects: a fully physics-based, holographic foil shader. Each pixel simulates a ray of light diffracting into a rainbow of waves, which add and subtract to create these incredible patterns. Not a single gradient was used here!
    00:00
  • user avatar
    This last year, I’ve been leading a UI refresh to make Netflix feel more fluid, delightful, and polished. Today, all that work shipped! Huge thanks to @nebson and @b3ll for helping bring this to life ❤️ Details below, but try it out yourself!
    00:00
  • user avatar
    What if the macOS dock and its icons were more dynamic and fluid? Made a little demo that shows message previews, live music, download progress, and more. Pretty happy with how this turned out!
    00:00
  • user avatar
    I made this pinch gesture to “explode” the layers of this holographic card :)
    00:00
  • user avatar
    I collaborated with @wabi and @joonasvirtanen to bring this incredible intro sequence to life, and I’d love to share it with you! We wanted way more flexibility than Liquid Glass, so I made a custom glass shader that refracts + disperses light. More technical details soon :)
    00:00
  • user avatar
    Made a super playful, interactive toolbar! The expansion animations are fully interruptible, and haptics play as you scrub through items. Other little things: * the items scale up/down as they become show/hide * scrolling past the top "stretches" the item spacing out
    00:00
  • user avatar
    I built the Apple Pay Cash gradient animation over the weekend, just with UIKit and CA! The key idea is that you take the distance from each dot to some focal point, and "map" it to a hue in the HSL color space. If people are interested, I can post the code & a quick writeup.
    00:00
  • user avatar
    I built a chonkier, Apple TV-inspired action menu that feels responsive and substantial! Notes: – The highlighted row gets magnified and moves slightly with touch – Spring-loads on long-press, or immediately if you drag – Stretches and rubberbands if you pull past the bottom
    00:00
  • user avatar
    Netflix is really big on metrics and AB testing, and this was a really significant win across the board. Don’t let anyone try telling you craft and quality doesn’t matter to the business.
    This last year, I’ve been leading a UI refresh to make Netflix feel more fluid, delightful, and polished. Today, all that work shipped! Huge thanks to @nebson and @b3ll for helping bring this to life ❤️ Details below, but try it out yourself!
    00:00
  • user avatar
    Experimenting with some fun ripple transitions in Metal/SwiftUI :)
    00:00
  • user avatar
    Made this jello-like “fabric” that stretches out and snaps back! - The values for each dot (translation, scale, spring response, etc.), are all keyed off of the touch’s distance - UIKit/Wave here, but made another in Metal for more “correct” deformation
    00:00
  • user avatar
    🌊I've been playing around with actual fluid effects (i.e. water) and built a re-ordering demo that "ripples out" once you drop an item. It takes a good amount of tuning to feel just right, but you can approximate it using the sombrero function! en.wikipedia.org/wiki/Sombrero_…
    00:00
  • user avatar
    Pretty happy with how this lil waveform scrubber turned out! Bonus: because haptics are also sounds, haptics “play” the waveform as you scrub through.
    00:00