UI/UX Designers, this might be one of the best free resources for exploring world-class design systems.
Design Systems Surf is a massive curated collection of design systems featuring visual styles, UI components, patterns, and references from some of the best product teams in the industry.
Can’t believe this resource is free. Bookmark it for later 💜
Since Opus 4.8 is out and more and more designers are getting into Design Engineering, I thought I’d share some of the interaction patterns I use most often:
Use proximity, not just hover. When the cursor gets close, nearby elements can subtly scale and darken based on distance.
It makes interfaces feel more responsive, less binary, and way more alive
onpointermove = e =>
document.querySelectorAll(".dock>*").forEach(el => {
const r = el.getBoundingClientRect();
const t = Math.max(0, 1 - Math.abs(e.clientX - r.x - r.width/2) / 120);
el. style.scale = 1 + t * .5;
});
It's time for interfaces to break out of flat land.
Lately, I have been experimenting with spatial experiences supported by foundational gestures.
Truly feels magical.
People talk, listen, watch, think, and collaborate at the same time, in real time. We've designed an AI that works with people the same way.
We share our approach, early results, and a quick look at our model in action.
https://t.co/AFJZ5kH7Ku
Storyboard of this video created with GPT image 2
Prompt:
Create a wide 16-panel cinematic storyboard infographic showing the daily routine of a young Japanese woman running her own cozy coffee café. Use a realistic photography style with warm cinematic colors, soft café lighting, shallow depth of field, detailed interiors, and premium coffee-shop atmosphere. Each panel should feature the same realistic Japanese woman with a ponytail, white shirt, dark apron, and natural expressions. Arrange the storyboard in a clean 4x4 grid layout with numbered panels, bold titles, short bullet points, and smooth visual storytelling similar to a professional film-production storyboard. Scenes include: opening the café, grinding coffee beans, brewing espresso, steaming milk, creating latte art, serving customers, taking orders, baking desserts, cleaning the coffee counter, washing cups, restocking ingredients, managing the cash register, decorating the café, evening cleanup, closing the café, and relaxing with coffee at the end of the day. Add realistic steam, reflections, warm sunlight, café décor, cinematic camera angles, and cozy ambience throughout all scenes. Ultra-detailed, realistic human appearance, luxury café commercial aesthetic, visually organized storyboard composition, 4K quality.
GPT Image 2 + Seedance 2.0 = Latte Art 🎶
Using a few techniques I’ve shared recently, you can create musical animations like this one.
For this video, I used a Character Sheet + Storyboard + IPA.
Even though it skips a beat or two in places, that’s totally normal. I think it blended the musical tone with the artistic style instead of following every beat literally.
You can find the details below.