Summary
Wireframes are a fantastic place to start learning UI Design. They are simple, yet powerful. Harnessing proper UI design principles within your wireframes will allow you to transform your simple sketches into artifacts you can use for user research or kickkstart development. In this session Billy will demonstrate a few simple tips to take your wireframes or designs to the next level.
Key Insights
-
•
Visual hierarchy is the foundational UI principle for guiding user focus through contrast, size, spacing, and placement.
-
•
The squint or blur test helps designers quickly identify what pops in their layouts, revealing hierarchy effectiveness.
-
•
Proper alignment using grids improves scan-ability by grouping related content like text with text and images with images.
-
•
Spacing and white space around elements enhance visual hierarchy and ease of navigation.
-
•
Poor hierarchy and alignment create cognitive overload, making it hard for users to decide where to look or act.
-
•
Clarity involves structure (pattern consistency), content (concise text), and action (clear, prioritized buttons).
-
•
Dark patterns manipulate clarity by obscuring primary actions, increasing user hesitation and confusion.
-
•
Designers should avoid unnecessary input fields (e.g., birthday in sign-up), focusing on frictionless user journeys.
-
•
Alignment remains a challenging principle to communicate and implement for engineers working with responsive layouts.
-
•
Web3 interfaces should still follow core design principles like hierarchy, alignment, and clarity despite new tech capabilities.
Notable Quotes
"Hierarchy is almost designing for our subconscious and how it actually looks at these things."
"If you want to look for hierarchy, do a squint test or blur the image and see what is popping on the page."
"Separating text with text and images with images makes it easy for me to scan all the different content pieces on the page."
"Misalignment throws off users and adds to cognitive load, making it harder to parse information."
"Clarity means the interface behaves in a way that I’m going to expect so it allows me to feel comfortable even when I’m using something new."
"Removing extra text is important — we just need to be very clear and concise to avoid confusing users."
"You can use a lack of clarity intentionally to control the experience if that’s what you want to do."
"If you want to get someone into their account quickly, don’t ask for info like birthday upfront — ask for it later."
"Grids are not just for marketing websites — applications use them too, like Spotify’s album page."
"Web3 design doesn’t fundamentally change the interfaces — good design principles still apply."
Or choose a question:
More Videos
"Doctors hate using EHRs because it turns them into clerks, interacting more with machines than patients."
Standardizing Product Merits for Leaders, Designers, and Everyone
June 15, 2018
"Very few people in business are familiar with situational awareness unless they served in the military."
Simon WardleyMaps and Topographical Intelligence (Videoconference)
January 31, 2019
"Designing for the dominant default ignores people whose identities are marginalized or excluded."
Sandra CamachoCreating More Bias-Proof Designs
January 22, 2025
"It takes at least one team member to choose to set healthy standards for collaboration."
Darian DavisLessons from a Toxic Work Relationship
January 8, 2024
"Timely engagement helps stakeholders make faster, more informed decisions that lead to better business and product outcomes."
Fisayo Osilaja[Demo] The AI edge: From researcher to strategist
June 4, 2024
"Creating tangible artifacts forces reaction and debate, helping break enterprise paralysis and drive decisions."
Uday GajendarThe Wicked Craft of Enterprise UX
May 13, 2015
"What’s so difficult about designing a login? On the surface, it’s simple, but the real challenge was cultural alignment across business units."
Davis Neable Guy SegalHow to Drive a Design Project When you Don’t Have a Design Team
June 10, 2021
"You won’t know what success looks like until you put something out there and see how it works in practice."
Eniola OluwoleLessons From the DesignOps Journey of the World's Largest Travel Site
October 24, 2019
"Our two-way Jira integration allows you to link design activities directly with epics, user stories, and tasks."
Aurobinda Pradhan Shashank DeshpandeIntroduction to Collaborative DesignOps using Cubyts
September 9, 2022
