Designers often struggle to explain small UI tweaks to developers using only words or screenshots. Requests like “make the button pop” or “this feels off” are subjective and can be interpreted in multiple ways. Without clear direction, developers are forced to guess, leading to delays, frustration, and wasted effort on both sides.
Sharing short recordings of live browser edits using DevTools significantly reduces design–development iteration time by making changes explicit and easy to understand.
Instead of describing a change, it can be shown. Browser DevTools in Chrome or Edge allow live edits to the UI. Padding, margins, font sizes, colours, and layout can be changed directly in the browser. Recording the screen and voice while doing this shows exactly what was changed and why.
This gives developers clear context and removes confusion.
Tip: Emails work best for small content changes. Learn more on Do you ask for small content changes using from X to Y?
Adjust the navigation and header layout by modifying margin and padding settings to improve alignment and spacing.
❌ Figure: Bad example – Vague request with no specific guidance. The developer is left guessing what the designer means
✅ Video: Good example - The designer demonstrates and explains the change, giving the dev everything they need to implement it
This technique is best for small, visual changes like:
For larger changes (e.g. new components or complex interactions), this approach may not be enough.
In those cases, it is better to: