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
"The blueprint is really within all of us — all the things that have brought us to this moment should come to our teams."
Jennifer KanyamibwaCreating the Blueprint: Growing and Building Design Teams
November 8, 2018
"Most organizations are using a stack of tools like Google Drive, SharePoint, or Airtable, not mature repositories."
Brigette Metzler Dana ChrisfieldResearch Repositories: A global project by the ResearchOps Community (Videoconference)
August 27, 2020
"We converted process boxes directly into user stories to create a common language for the team."
Carl TurnerYou Can Do This: Understand and Solve Organizational Problems to Jumpstart a Dead Project
March 28, 2023
"Sometimes you have to make something wrong on purpose to learn and improve it with others’ help."
John Mortimer Milan Guenther Lucy Ellis Patrick QuattlebaumPanel Discussion
December 3, 2024
"Recruiters are often optimized for technical hiring and design is only one percent of the company’s population."
Dante GuintuHow to Crush the Talent Crunch
September 8, 2022
"Marketing and strategy are part of design."
Richard BuchananCreativity and Principles in the Flourishing Enterprise
June 15, 2018
"Normally the theme leader would be talking about sleep deprivation because we’re overstimulated and excited by the talks."
Dan WillisTheme 3: Intro
January 8, 2024
"We study failure without blame; this is the path to progress."
Dan WardFailure Friday #1 with Dan Ward
February 7, 2025
"We need to step out from informing decisions and into becoming changemakers."
Chris GeisonTheme Two Intro
March 28, 2023