Connect: behind the front-end experience
Category: Link
Some fantastic behind-the-scenes stuff about Stripe’s design work by Benjamin De Cock. Absolutely everything is clever and using very modern techniques.
- Using CSS grid for their iconic background stripes
- Using 3D cubes for aesthetic flair
- Using reduced motion media queries to accommodate that preference
- Using the Web Animation API for event-triggered keyframe-like animations in JavaScript
Plus one I’d never seen before:
Connect’s landing page uses the new Intersection Observer API which provides a much more robust and performant way to detect the visibility of an element … The
observeScrollhelper simplifies our detection behavior (i.e. when an element is fully visible, the callback is triggered once) without executing anything on the main thread.
Direct Link to Article — Permalink
Connect: behind the front-end experience is a post from CSS-Tricks
LEAVE A REPLY
You must be logged in to post a comment.