- Designing for Delight
- Posts
- Deconstructing the new Diagram.com
Deconstructing the new Diagram.com
PLUS: AI probably won't kill us all, and a podcast for ambitious people
Designing for Delight
A @tinystride publication
Welcome! In today’s email:
How can you ship work as polished as the new Diagram website?
A counterpoint to AI doomsayers, and 7 examples of Photoshop’s new Generative Fill feature
A podcast for ambitious people who want to reach their full potential
What’s the magic behind the new Diagram site?
Diagram released a redesign of their website designed by Marco Cornacchiay. It still has the design community buzzing days later.
If you’ve spent any time on the site, you know it’s special. But what exactly is so special about it?
The page's overall structure is not especially complex if you squint your eyes. It’s a few big sections with titles and cards.
All the magic is in the visual design, inline animations, and app-like interactive playgrounds inside the cards.
I much prefer all this micro-complexity to macro-complexity. You know the type: we’ve all seen “award-winning” sites with chaotic grid layouts, scroll jacking, and non-standard navigation patterns.
The Diagram site has a foundation of familiar patterns that earn high marks in usability and accessibility. But inside that framework, the team absolutely cut loose with tiny mental obstacle courses and fun little games.
Too many designers get this backward, and end up with something that looks showy but feels unusable.
The site also has an insanely high level of visual polish. I think this is the formula for visually polished interfaces or digital experiences like Diagram (and other highly polished sites like Linear):
Skilled designer + founders who value polish + time
The factor missing on many teams is time. Time to iterate. To do and redo. To give attention to stuff that "doesn't matter".
There aren't really any shortcuts.
Good design takes time.
Worth a click
Image: Midjourney + Photoshop Generative Fill, @0xframer on Twitter
Dynamic Interfaces — From David Hoang, what I think will end up being a seminal piece. I don’t think it’s overstating to say that David is pointing to the next massive shift in UI design for the next decade after the responsive design movement.
Reset Podcast — A podcast by executive coach Liz Tran focused on helping ambitious people reach their potential. These episodes helped me tremendously: “Do You Know What Motivates You?” and “Deconstructing Imposter Syndrome”. I’m telling everyone I can about this podcast.
No, AI probably won’t kill us all — I’m fascinated by AI ethics conversations, and I’m doing my best to read all sides of the debate. This article offers a counterpoint to AI doomsayers, focused mostly on the limits of chatbots like ChatGPT.
We gave up Sketch and rebuilt our design system in Figma — A detailed post from Karen Liu at Brave walking through their transition from Sketch to Figma. Balanced and thorough.
7 demos using the new Photoshop generative fill feature — Photoshop’s new AI fill feature is apparently as good as advertised. I’m most excited about AI when creative people with good taste use it as an assistant, rather than using it to replace or outsource their work.
Tweet of the week
Again, tools (AI included) aren't what makes you a skilled designer.
🧠 your way of thinking
🔍 your attention to detail
👀 your capacity to see the bigger picture
✨ your ability to translate people's ideas into designs
are what makes you good at this job.
That’s it for today. Thanks for reading!