Rauno's Field Notes #2

A developer shares insights into UI/UX design improvements for Vercel project cards, focusing on space optimization and context menu implementation. The piece explores the balance between information density and user discoverability.
Why it matters
Design decisions in developer tools significantly impact workflow efficiency and the usability of complex dashboards.
Vercel Project Cards I started by tweaking the padding and co-located information to reduce the vertical space occupied by each card. Some data was also omitted, for example we realised that we don't need to show the project branch on the card which is generally always "main".
It's important to understand that these cards occupy a lot of space on the screen on this view. It's easier to digest cards when there are less rows on the card and information is tight and terse.
Here's a before & after of the changes. We even gained an extra row in the grid.
Another change we made was to the project card shortcut menu. We're still testing this change behind a feature flag. At first it seemed like it would simply clean up the card since the ··· button repeats a lot.
Get smarter about the news
Sign up free for a feed built around what you actually care about, Dive Deeper research on any story, and the full text of every article.
Create free accountAlready have an account? Sign in