UX/UI Links of the Month
Each month we pick our five favorite UX and UI links and post them to our company news. Here you'll find all the archives in one place.
If the comparison table content is not informative and thoughtfully laid out, it can disrupt the lawn mower pattern and make users’ comparison tasks more difficult.
I'm not typically big on eyetracking research, but The Lawn Mower Eyetracking Pattern for Scanning Comparison Tables reveals something new and just makes sense.
Need to display some numbers on a dashboard? Try making them big and bold, with a smaller, lighter uppercase label. An easy, clear, and stylish treatment!
A great list of digestible design guidance to improve any UI. Check out this Twitter thread of 50+ Practical UI/UX Design Tips.
One of the greatest strengths of this methodology is that you get to see things you wouldn’t anticipate and uncover low-level details that have become habitual and invisible.
I've always been a fan of contextual inquiry and Contextual Inquiry: Inspire Design by Observing and Interviewing Users in Their Context is a great entry point. It's nice to see qualitative research getting some well-deserved attention.
Collaborative visualization quickly extracts different assumptions out of your and your colleagues’ heads.
A picture is worth 1000 words. That's the idea behind 3 Ways Visualization Drives Collaboration, Agility and Inclusion. It's as true today as it's always been.
There are times where it’s fun to try new stuff and tell people about it, and there’s times to reach for the technology you know so you can get stuff done.
Let's end this year, with a simple, but timeless message. Old Is Solid; New Gets Talked About is a reminder that what you read about online isn't reflective of reality. Don't let what's new distract you from what's good.
I will imagine that a front-end developer must wear a pair of glasses that let him/her see the high-level layout items only.
I love idea of seeing things with "front-end developer glasses" on proposed in Thinking Like a Front-end Developer. It can be really hard to look beyond the visuals, but that's a key part of good UX design.
Nothing ever exists in isolation, and you can’t do a proper job if you don’t consider the forces surrounding the project.
Thinking Contextually is a quick read that sums up a very important skill. Design is not good or bad on its own, it's the context that determines that.
If designers want to work agilely and still design great, user-centered products, we need to stop designing faster and learn how to start designing less.
Agile sounds great in theory, but can be very hard in practice, precisely because it's not natural to design that way. Designing the Smallest Possible Thing shows you the right way to do it.
It’s never a good idea to omit relevant content from a mobile product page for fear of overwhelming users.
Designing responsively is not all there is to mobile design. Mobile UX: Avoid Using Subpages within the Product Details Page (26% Don’t) shows one mistake many sites make and what to do instead.
Users are more motivated to begin their tasks than spend time consuming tutorials, documentation, or other types of help or setup content.
Splashy redesign concepts rarely cover large industry-specific software applications, because designing them is really hard! 8 Design Guidelines for Complex Applications is a refreshing look at the design of real world software.
Remember, your goal with an on–off control is to make sure that users quickly understand both the current state, and what will happen if they press that control.
So-called state-switch controls are one of the most vexing UI elements. State-Switch Controls: The Infamous Case of the "Mute" Button helps untangle the mess.
Working code is the ultimate source of truth for everyone, including the users.
I love how zoomed-out this article is, yet it offers very concrete advice for UI design. Start with these 8 First Principles of Software Design and you won't go wrong.
Challenging the brief and pushing for a solid product/market discovery phase is sometimes needed and will help the project in the long run.
One of my recent revelations is that good UX is not just the right design, but the right design at the right time. Over-designing early in the process is a common mistake. Where in the Design Process Are We? is a great read.
Think of your feature like a stack of pancakes, where each pancake represents a layer of your system. Eat a piece of all pancakes at the same time.
It takes a bit of work to wrap your mind around this, but it's worth it, in my mind. Try following the advice in Break Apart Your Features Into Full-Stack Slices on your next project.
The very first step in the process needs to be to understand the requirements.
This is still where most projects go wrong. It can't be said enough: start with the requirements. Dig & Document: Before You Start Designing explains why, in story form.
Designers need a way to determine how a product’s content will behave across multiple screens without being dragged into making interaction and visual decisions too early.
I had never heard of this idea, but it makes so much sense. In Praise of Breadboarding: An Essential UX Tool encourages designers to think about the flow and connections separately from the UI.
The software people get amazing tools that let them build amazing apps, and the climate people get lots of Fortran. This is one of the weirdest puzzles of this industry.
Designers often get caught up in discussions around the edges of user experience while forgetting about the average user's experience. The Power and Paradox of Bad Software reveals truths that are rarely talked about.
It’s important not to confuse goals with tasks. For instance, a user’s goal isn’t to fill in a form.
Nearly 30 years old, Task Analysis is still a valid and useful UX technique. Task Analysis: Support Users in Achieving Their Goals shows you how to do it.
The priorities should guide the pixels and not the other way around.
Try to create different types of cards for different types of information. This sets information apart visually, and helps users learn the visual language.
What we want to focus on are the components that make Google’s products so easy to use time and time again.
Despite having grown way beyond a simple search engine, Google still does a great job with simplicity and clarity. 4 Lessons Web App Designers Can Learn From Google shows how you can apply their techniques to your products.
As a noticeable and indispensable part of the page, sometimes an interactive top bar relieves the burden of interaction for the rest of the page.
What You Need to Know About an App Top Bar looks at the anatomy and behavior of over 100 mobile apps to teach you how to optimize their design.
One of the best ways to ensure a design is well-reasoned is to be “forced” to describe it verbally or by flowing out the logic.
Taking the time to document use cases and workflows of your app before you start designing may feel a bit tedious. But, as Documenting Is Designing: How Documentation Drives Better Design Outcomes shows, it helps you get the right design and the design right.
When users completely miss a link, button, or piece of information even though it’s right in front of them, proximity (or rather, the lack of it) is often to blame.
Simple, yet powerful, using proximity wisely is a key design strategy that anyone can use to improve their work. Proximity Principle in Visual Design has some great lessons and examples.
The message needs to go beyond just stating that there has been an error. It needs to describe the problem that occurred.
Melissa has done a great service to the UX community by writing articles about all 10 of Nielsen's usability heuristics. Like the others, Jakob Nielsen's Ninth Usability Heuristic for User Interface Design has some great, modern examples.
Despite looking like a simple feature, the Best First pattern can be a defining element of user experience.
Designing for search is a lot harder than it seems. Learn about the 3 F's of search design and a lot more in UX for Search 101.
Nondesigners have the power and the responsibility to formulate amazing problems to solve and define appropriate requirements that can potentially result in a successful product.
The thesis of How Nondesigners Contribute to Designing the Right Things is that solving the right problem isn't something that designers can do on their own. Make sure to involve them before you start designing.
When a client asks you to design a landing page to “educate users” or to “make them sign up to
” you absolutely need to start asking questions.
How much a user is motivated to complete a task has a huge impact on the success of your product. Designing for How Much Users Care shows that UI design is just one part of the experience equation.
Subscribing to agile methodologies is not an excuse for not taking the time to get solutions to actually known problems right.
A good design doc should include everything that the development team needs to know before starting code, which varies widely based on the project. Design Docs at Google shows what to include and what to leave out.
UX designers can leverage many of the techniques that the literary world uses to create great reader experiences in creating great user experiences.
People are naturally drawn to stories. Building Narrative into Your User Interface, Part 1 lists 5 clever ways you can include story-telling elements in your design to guide users through your product.
Humans evolved to jump to the simplest, lowest-energy idea and just get on with it. But the meaty, complex problems we tend to tangle with at work often need us to pull out our digging tools and not just stop at solutionising.
A "solutioniser" is someone who immediately jumps to a solution without discussing the problem. The Thorny Case of the Solutionising Colleague provides practical advice on how to identify and redirect them.
Even for fairly complex mobile apps, it’s often more effective to train users by showing them tips in context instead of presenting them with a tutorial that explains the app’s UI.
The main take-away from Mobile-App Onboarding: An Analysis of Components and Techniques is that onboarding screens are often used to prop up a bad user experience. So, if you find yourself designing them, try to see if you can design your app so that it doesn't need one.
Using the right collaboration processes, you can thoughtfully thread the needle between product wants and technical constraints.
A good designer-developer relationship is a great way to make an impact. How to Get Closer With Your Developer walks through a specific process for getting developers involved in the design process early on.
When you design a layout with cards, the key idea is to allow users to quickly digest large portions of content and dive deep into their interests.
I find myself turning to cards more and more because of their flexibility and ability to convey information in a compact, but clear way. Simple Design Tips for Crafting Better UI Cards provides some great advice for getting them right.
Whilst looking to solve the individual needs of a target audience, we ignore the wider societal implications that brands play a role in creating.
Rather than focusing on one specific inclusivity challenge, Society-Centered Data for Society-Centered Design makes the point that designers have a far-reaching impact and must start considering the consequences of our work in the design process itself.
We are not our users. We are even less our expert users.
What makes a user experience good is entirely dependent on who uses it. Over-Complicated? Over-Simplified? The UX Efficient Frontier describes how to design for expert users, when simple often isn't better.
Bottom navigation bars are closer to the edges and provide comfortable access to key actions.
Designing for mobile is a very different paradigm, in large part because we use our fingers instead of a mouse. Modern Touch-Friendly Design is a succinct summary of how to design for the constraints of our hands.
Don't be afraid to "think outside the database" — your UI doesn't need to map one-to-one with your data's fields and values.
🔥 Design Tips is a Twitter moment of all of the best UI design tips from Refactoring UI, a great new resource for designers. Packed with practical advice.
We need to make conscious decisions about what information needs to be visible and what can be a click or a scroll away.
Progressive disclosure has long been a technique used by UX designers to reduce information overload. But desktop paradigms don't easily translate to mobile. Designing for Progressive Disclosure tells you what works and what doesn't on mobile screens.
Be careful about striving to create something shiny and completely unconventional for the sake of “innovating”.
3 Questions I Learned to Ask in the Design Process is a great guide for questioning your assumptions when designing and making sure that you don't waste effort or go down the wrong path.
A design isn’t the product or website itself — it’s a way to communicate a user experience to those who will build it.
I love pragmatic design. The Pragmatic Design Manifesto makes it actionable by providing 5 principles to abide by to prioritize delivery and user experience.
They both have to understand business, technology and user experience.
What I love most about Product Manager + Product Designer: An Impactful Yet Hard to Define Tandem is that it shows the specific areas of overlap and non-overlap between design and PM roles. In a healthy organization, both should have one foot in the others' world, without stepping on their toes.
The fundamental problem hidden behind a design by committee situation is cultural.
It's hard to find a middle ground between designing alone and including everybody. How to Overcome Design by Committee defines a clear path to it by focusing on evidence and design culture.
While friction can be seen as a road-block in some journeys, for others it provides a change of pace that is needed.
Reducing friction in UX design can have a powerful impact on usability, but sometimes it can go too far. Why Friction Is Not the Enemy of Good UX shows where friction points are actually a good thing.
Usually a scenario like, oh you know…a global pandemic might be considered an edge case.
Designing for a Crisis is a unique story from a designer who worked on tools for outbreak treatment and also suffered the effects of COVID-19. It contains pragmatic advice on how to design for worst-case scenarios.
Users should be able to transfer their knowledge about the system from one tool to others.
It's so easy to become siloed in a software organization. One effect is an inconsistent user experience. Designing for Interusability is a great case study on why it happens and how to change it.
What if we gave the same care and attention to how developers will consume our designs as we do into how users will?
5 Principles for Better Designer-Developer Collaboration really resonated with me. It's an under-appreciated skill that has a huge impact on the the final product.
User Journey Maps are a great tool to identify pain points and unmet user needs.
An Introduction to User Journey Map + PDF Templates uses a great, real-life example to show how useful they can be. Awesome free template too!
Using this framework will reliably point you in the right direction and help you make better decisions about how and when to use modals.
Knowing when to use a modal dialog is challenging for designers of all levels. Modal vs Page: A Decision Making Framework makes it easy by giving you a simple flow chart to follow. Brilliant!
Seek feedback throughout the product cycle — from initial ideation all the way to the “final” shipped design and beyond.
Impostor syndrome makes us afraid to show incomplete work to others, yet getting feedback on in-progress designs is the best way to improve. Design for Progress Over Perfection does a great job of hammering that point home.
We asked 10 designers to share a few words of advice for current (and future) designers of color. Here’s what they had to say
Not everyone has the same access to opportunities to design professionally. Black History Month Spotlight: Advice From 10 Accomplished Black Designers contains useful tips from people who have made their own opportunities.
Like food scent guides animals to their meals, information scent guides people to those webpages that are likely to contain the content they’re looking for.
"Information Foraging" is a great UX term to learn because it acknowledges how much our primitive brains influence our behavior with technology. Information Scent: How Users Decide Where to Go Next explains how we can make links better by making their destination clear.
Everything works differently on mobile, so designers need to make sure any elements of their websites are always optimized for mobile use.
Jeremiah Lam was on fire in February, publishing five great articles on UI design. My favorite was 8 Mobile Form Design Guidelines because I see so many bad mobile forms out there and he provides great suggestions for how to them better.
When I first started as a user researcher, I believed there were two types of user research: usability testing and discovery research. They are not the only methodologies a user researcher can use to answer questions.
My favorite thing about Which UX Research Methodology Should You Use? is that it's based on a mistake. Post-mortems can reveal not only how you could have done things better, but why they went wrong, which is often more instructive.
5. UX Debt 101 (article deleted)
Like technical debt, UX debt will eventually come due.
UX debt is very hard to tackle. UX issues never seem to rise to the level of technical bugs or requested features during roadmap planning. But UX Debt 101 does an excellent job of justifying why paying it down pays off.
We need to do everything we can to get the form out of the way as quickly as possible ... To do that we have to make the form easy to use.
Forms are pivotal elements of the user experience; it’s the start of a conversation with your users. In Form Design Patterns, Adam Silver explains what makes and breaks these elements through the analysis and redesign of a real-world checkout journey.
Before you build that software as a service idea you have, first test the market and check there is a demand.
Software as a Service (SaaS): How to Be Sure of Success contains excellent advice you can use before diving into the development of your SaaS dream.
Being intentional about our designs means knowing that our job is to solve user needs, not to keep developers busy.
Doing more rarely feels like a bad idea, but it can be. Rendering Intentionality is an invitation to pause and reflect on your product’s original value proposition and question if it’s still focused and solving the problems your users hired it for.
Unlock ideas that you may have never realized or been able to explore within normal project constraints.
“Imagination is more important than knowledge,” Einstein said. Designing Your Digital Product Like a Concept Car is proof that letting your imagination take you outside of the limits of what’s currently sensible is a powerful exercise to foster innovation.
The public awareness of our digital wellbeing is a signal that people are hitting their digital capacity.
The success of digital products is directly proportional to how much they can stand out in an increasingly crowded landscape. 3 Practical Tips for Product Builders When Designing in an Era of Digital Exhaustion shares interesting ways of approaching the limited attention of our audience to improve our chances of success.
Accelerators enhance user interfaces by providing an alternate method for accomplishing a specific action.
Keyboard shortcuts (one type of accelerator) are one of my favorite UX techniques. Accelerators Allow Experts to Increase Efficiency explains why and how you should use them.
To get you started, I’ve put together a set of seven of my favorite mental models that I use daily as a designer.
Mental Models for Designers is a great article to read before starting a design project. It'll put you in the right mind set to come up with the best solution.
Designing settings can be tricky as it does not get the needed attention and is often overlooked.
Designing a Better 'Settings' Screen for Your App uses illustrated, easy to follow examples to help you create this important part of your interface.
Apart from clinical applications and psychotherapy, psychology comes with a wide range of tools to help people in their everyday life.
7 Psychological Principles for Better UX is a good primer on some important concepts you should know to clean up your user experience.
A Task Analysis is a tool that makes it easy to trace a design decision to the research that was done to get there.
Task Analysis has been around for a very long time. Why Most UX Projects Could Use Task Analysis reintroduces it at a good time.
Annotations can save time by proactively answering potential questions about your design
I love the thoughtfulness in Design Annotations That Will Make Your Developers Happy. It mentions specific reasons and use cases for annotations, which are underused, IMO.
While not a sexy web design topic, the styling and content of a footer can actually go a long way in helping the user access pertinent information.
When reading about UX, it's easy to get caught up in the latest design trends and tools, but hard to find timeless, practical articles like Footer Links Should be Divided into Distinct Semantic Sections (13% of Sites Don’t). Unsexy, FTW.
Though the data and systems that make up these workflows are domain-specific, many of the interaction patterns are fairly common in other products.
As someone who started out designing for a complex and technical domain, I found this article spot-on. Designing in a Complex and Technical Domain? Try This. makes this daunting task seem much more approachable.
Facilitating collaboration between Development and UX Design is one of the best things companies can do to get optimal results.
How to Bridge the Gap Between Your UX Design and Development Teams is a great reminder that the work of a UX designer is meaningless without developer participation. Some good tips here.
Anyone with even a passing interest in web design stands to benefit from knowing how news design works, and why it works.
What Newspapers Can Teach Us About Web Design is a nice intro to basic web and UI design. It shows why everything old is new again.
Dropdowns are like the Swiss Army Knife of input fields. But with its versatility also comes usability problems.
I'm very reluctant to encourage new interaction design techniques over established ones, but The Problem With Dropdown Fields (And What You Should Use Instead) had me convinced this time. It's clear that there are better options for specific situations.
To find the obvious, get close to the problem.
In UX, obvious is better (obviously). But obvious isn't easy. The Obvious UI is Often the Best UI provides some great suggestions for tackling this elusive challenge.
Why not follow mother nature and apply its approach to the creation process?
An Evolutionary Approach to Designing succeeds because it takes a very simple concept - iteration and refinement - and hammers home why you should always design this way.
The main idea is to increase the perceived value of the exit-intent popup and ensure that users get a benefit from the interaction that keeps them on the site.
Anything that improves the experience of website popups is worth sharing, in my opinion. 10 Ways to Use Exit-Intent Popups to Improve UX actually makes a decent case for using them sometimes.
Get things out of the realm of two people disagreeing with each other.
This article is worth it for the Design Idea Worksheet alone. Pushing Back by Teaming Up provides a great framework for objectively evaluating the merits of a feature or design solution.
To avoid losing users’ work, systems need to determine the user’s intent — cancel or close — and provide clear options.
Sometimes they mean the same thing, but when they don't it really matters. Read Cancel vs Close: Design to Distinguish the Difference to make sure you get it right.
Thinking about what the buttons do makes it easier to decide where to put them.
Where to Put Buttons on Forms is an easy guide that covers just about every use case. Save this link, you'll refer to it often.
The Web Share API offers a simple way to bring up a share sheet — the native bit of UI that’s used for sharing.
UX Considerations for Web Sharing contains technical details on the Web Share API, but don't overlook the point about unneeded and unused sharing icons that litter most websites.
Digital transformation is a means to add to the history, not scrape off the layer for a fresh coat of paint each year.
Take a step back from your roadmap and look at your product's relationship with your customers. Building Products That Grow on People will have you re-thinking and maybe even updating your OKRs.
Design-led is focused on the team and discipline that’s leading or facilitating the effort while experience-led is focused on the outcome desired for customers.
A simple idea that is often absent in silo'ed organizations: Design is not an end in itself, it's there for the customer. Design-Led vs Experience-Led and Why It Matters reconsiders the role of Design in an organization.
One non-obvious lesson of UX design is that dropdowns are pretty much the worst control.
A wealth of information, 4 Rules for Intuitive UX is like four great articles in one. Follow these rules and I guarantee your users' experience will improve.
By leveraging existing mental models, we can create superior user experiences in which the user can focus on their task rather than learning new models.
One of the most common design mistakes is trying to be different for the sake of being different. UUsing the Power of Familiarity in Design is a reminder that obvious always wins.
Just like the IA reflects the information structure of a website, the mini-IA, which is made up of all the page headings and subheadings, reflects the information structure of a page.
Most people don't read articles from top to bottom anymore; there's just too much out there. The Layer-Cake Pattern of Scanning Content on the Web will help you optimize for the way people actually approach your content.
A good product designer needs to start every task by first understanding why it’s important for the business.
You can't succeed as a designer if you think that design and business goals are at odds. User Experience vs. Business Goals: Finding the Balance shows how they can work together.
Too often, we treat our understanding like a block of carved marble. But we should always be free to iterate, adapt, and refine our understanding.
Maybe you don't think that you know everything, but you still probably aren't as open to input as you think. That's the clever thesis of What to Do When You Know Everything. A good, quick read.
There are diverse benefits from visualizing a concept, idea, or process, both individually or amongst a team.
We recently wrote about how to start a wireframe, which recommends using notes and flow charts before moving on to UI design. Cognitive Maps, Mind Maps, and Concept Maps: Definitions covers even more useful methods for sorting out your ideas and understanding before you design.
Many single toggle buttons fail at either showing the current state or making the unselected option visible.
I love the deep dives into specific controls that UX Movement does. This month he focuses on toggle buttons, with two articles on them. Both are great, but The Challenges with Single Toggle Buttons is a real standout.
Are we making a conscious effort to make our users understand the complexity rather than just hiding it in a ‘more’ menu?
Complex User Experiences sorts out many of the apparent paradoxes in UX design, such as how do you make something simple without making it basic. A good read if you want clarity on the difference between complex vs. complicated.
Rule 1 — Ask for only the basic information you need to create the account.
10 Rules for User Sign-Up Journeys is exactly what it says it is. It's a great checklist for the next time you're building a sign-up page.
I generally advocate for avoiding using input fields without labels at all costs.
UI Cheat Sheet: Text Fields is a very comprehensive guide to a surprisingly tricky UI control. Read it and take your forms to the next level.
The long-term survival of your own contributions is irrelevant. The important thing is that the product is evolving into the best version your team can create together.
Nobody Really Owns Product Work tells the personal story of one of Basecamp's designers, who learned to value the end result over the role he played in creating it.
The usability gap is that you have the feature; but people can't use it.
In this short video from the co-founder of NN/g, Shifting an Engineering Driven Company to Be User Centered does a great job of giving an elevator pitch for why executives should invest in UX.
Remind users what they’re getting out of filling out all these input fields. Tell them why it’s worth it.
Full of good examples and easy to put into practice, UX Best Practices: Registration, provides 6 Do’s and 3 Don’ts for account creation forms.
If users don’t know what your product does, why would they buy it? The page needs to explain what it does clearly.
Designing Landing Pages That Counter User Objections is a short article that introduces an obvious-in-retrospect idea that puts you into the mindset of your customer as they land on your site.
Designing the experience should not only take place at the interaction level.
User Experience vs. Customer Experience: What's the Difference? goes beyond the buzzwords. It's the best article I've read explaining the difference between the two and why Customer Experience matters too.
The longer designers and developers work together, the better designers will understand what is easier and what is more difficult for the developers to build.
The role of trust and understanding between designers and developers is an under-appreciated element of good UX. How Frontend Developers Can Help To Bridge The Gap Between Designers And Developers provides some insightful strategies to build rapport.
A common trap for designers is to only focus on creating designs that represent the perfect state of a user interface.
Developers love edge cases, but many designers suffer from the opposite problem. Designing for Different States in the UI is a great reminder that the "ideal" state is only one of many touchpoints in the experience.
You don’t always need precise categories of user characteristics, but you do need some idea of who will be using the design, and what they’ll try to do with it.
UX teaches that you can't design for everyone, but some products really are used by incredibly broad groups. ‘Our Users Are Everyone’: Designing Mass-Market Products for Large User Audiences acknowledges this and provides solid guidance.
The biggest misconception of new projects is thinking that they start with the kickoff meeting.
How does a software project come to be? Get the answer to this question and more in A Comprehensive UX Guide to Project Kickoffs.
Increasing headcount is not the only way to advance your organization’s design prowess.
Design maturity is the degree to which design is infused in an organization. Are You Really Ready to Grow Your Design Team? shows you how to mature and get the best return on your design investment.
Tabs not only provide a satisfying means of hopping to, from, and between different sections but also help establish order within the user interface.
Comprehensive, yet easy to read, Embrace the Mental Models of Users by Implementing Tabs covers most everything you need to know about tabs, including what problem they solve, when to use them, best practices, and their potential pitfalls. A great resource.
My issue with the request is it expects good UX to be effortless, as if it can be added on top of development rather than serve as the driving force behind development.
My biggest complaint about most UX articles is that they assume an ideal design environment, where everyone has fully embraced UX. What's great about Why "Make It Work Like Turbotax" Is My Least Favorite Request is that it specifically addresses situations where design is an afterthought and provides practical tips for moving it up in the process.
People should be able to quickly scan the navigation and understand which links are primary, secondary, and tertiary navigation items.
5 Navigation Tips to Improve the UX of Your Product/Service is a deep dive into the world of navigation. It covers breadcrumbs, menus, links, visual hierarchy, and mobile navigation design. It's a great primer for inexperienced designers.
Great design revolves around context and value.
A simple way to explain the success of some products over others is that they focus on benefits over features. But a more nuanced viewpoint, which The Two Most Important Words in UX Design takes, is that understanding context and providing value is what users really care about.
This isn’t about recreating the intended sitemap—no, this is about experiencing the site the way users experience it.
In this book excerpt, Everyday Information Architecture: Auditing for Structure describes how, in precise detail, to do a structural audit of your website. Similar to our article on Content-First Design, it explains why key parts of the design process should happen outside of graphical tools.
By placing the high priority action at the bottom, it’s in the path of least visual resistance.
5 Techniques to Make Mobile Call to Action Buttons Intuitive is one of the few mobile UI design articles that makes a strong case for separate rules from designing for large screens. Some great tips for small screens and short attention spans.
One of the most crucial tasks I have as a designer is to communicate my ideas.
The Design Decisions That You Know Are Right dissects UX "failures" that were really just failures in communication. It provides an empowering antidote to a common feeling of frustration by revealing techniques for being heard.
Items inside of contextual menus should directly relate to the tasks the user needs to complete.
Contextual menus fell out of favor for a while with the rise of early web and mobile apps, but now that those apps have become more powerful and feature-rich those classic on-demand menus are back. Contextual Menus: Delivering Relevant Tools for Tasks catches you up on what you need to know about designing them right.
Both too much friction and too little friction reduce value, but just the right amount of friction maximizes it.
A long-ish read that digresses before hitting its stride, The Value of Inconvenient Design describes why the right amount of friction is key to a good experience. Once you start to see things this way, it'll permanently change your view.
Maeda thinks that designers should focus on being good teammates rather than leaders.
Controversy aside, I think that Maeda's perspective on the team and product above the design alone is worth a read. John Maeda: “In reality, design is not that important” will make you think and maybe question your own views.
Create login forms that are simple, linkable, predictable, and play nicely with password managers.
A bit of a rant about login overload, Don't Get Clever With Login Forms makes some good points about keeping your login screen simple, especially given that many of us use password managers now.
Too often, both in professional and open-source codebases, there are cases where people attach a sense of self to the code that they write. This makes collaboration way more difficult.
I always enjoy perspectives on UX and UI from outside the world of design. This one is unique because it comes from the inside as well. Lessons from Design School for Software Engineers is both understanding and kind to developers, yet challenging to their way of thinking.
In order for error messages to be effective, people need to see them, understand them, and be able to act upon them easily.
Concise, yet comprehensive, How to Report Errors in Forms: 10 Design Guidelines tells you pretty much everything you need to know about form validation and error recovery.
Just as a well-designed building reveals new information to the inhabitant, your interface should provide sufficient detail and refinement to support the user who is up-close and personal, day after day.
A lot of food for thought here. Five Lessons from Architecture School that Will Improve Your UX Work provides advice on how to build your interfaces to stand the test of time, a way of thinking UI designers aren't accustomed to.
The width of the Input field should be wide enough to contain the typical search query.
Short and to-the-point with clear illustrations, Best UX Practices for Search Inputs provides some easy do's and don'ts for search box design.
Even early on, don’t forget to involve the people that’ll actually be building the thing you’re designing.
I'm a strong advocate for better communication and collaboration between designers and engineers. There are some great tips in How to work effectively with engineers that can help you bridge the gap in your company. (Also check out this article on the same theme.)
Without a clear indication of which of the two dates is currently being expected by the picker, the user can very easily enter a date in the wrong field without noticing.
I've been looking into flights lately and have used date pickers across a variety of sites and they're nearly all poorly-designed. I hope that the designers of the sites I've been using read Design guidelines for mobile date-pickers. It's full of sound and easy-to-follow advice.
We propose a radical change in design from experts designing for people to people designing for themselves.
Something of a manifesto, Community-Based, Human-Centered Design lays out a vision for communities to solve their own problems using design principles as a guide, instead of relying on outsiders who are missing critical context. A bold idea from a UX pioneer. (Also check out this related article.)
I’m not simply showing the screens, or interactions that the user might move through. I’m actually showing the people involved, and what they might be thinking, saying, and communicating to each other.
I was first introduced to the idea of using comics for UX storytelling over 10 years ago and am still a fan of the technique. In Using Comic strips and Storyboards to test your UX Concepts, we learn about the difference between storyboards and comics and see some great examples to learn from.
Vertical height restraints, copy length, imagery and number of options are all crucial factors.
Heads up! There's a great publication that just kicked off this month, all about nitty-gritty UI design details, called Tap to Dismiss by Linzi Berry. The third installment, Select to Proceed, is my favorite so far. It's about four kinds of selection controls and when to use them. Very useful!
What distinguishes the best mobile checkout experiences from standard ones is the extra attention to detail.
Nielsen Norman Group are known for their comprehensive guidelines. And this article on The Mobile Checkout Experience is no exception. If you sell anything via a mobile app, this is a must-read.
Making things easier for your users means not forcing them to learn new representations or toolsets for each task.
Consistency of often cited by designers as a rationale behind their work. This article on the Principle of Consistency and Standards in User Interface Design is useful because it explains why.
It is the designer’s responsibility to evaluate whether an action is self-contained or part of the app’s general exploration flow.
I think the claim that "there are only two types of screens" isn't the main point here. The real take-away from Modality Is the One UX Concept That Most Designers Don’t Fully Understand is understanding the decisions that go into user flows and how to get them right.
Forms are like conversations between people.
Why do we still link to articles about form design in 2019? Because forms are still hard to design well. In the case of How to Improve UX of Web Forms, I really like the examples and easy-to-follow tips.
When you design something well for the extremes it has a positive impact on the majority as well.
A smart alternative to creating perfunctory personas for every user group, Designing for extremes: the Nerd and the Newb explains how focusing on two truly important personas can be more valuable.
Drop-downs quickly become difficult for users when they are presented with an overwhelming number of options to choose from.
Enjoy this updated, classic "do's and don'ts" article about drop-down input controls. Especially useful is the "what to use instead" section.
Little-known truth of UI design: if your designs look sloppy/cluttered at all, you’re probably not aligning the elements enough.
I love the attention to detail in this smart article about alignment in design. It's an accurate reenactment of what goes on in a designer's head on a regular basis.
Each day through December, enjoy a delightful little treat from some of the world's leading UX specialists.
People like what’s familiar, but they also covet what’s uniquely useful.
How do you use established design pattern templates, yet find a way to stand out? This thoughtful article shows how you can improve upon basic templates to cater your design to your specific audience.
I’ve come to feel that a system that promised to increase my mastery over my work has, instead, increased my work’s mastery over me.
A fantastic longread by the author of "The Checklist Manifesto." It's a great story about the lives of people impacted by design decisions made far away.
If you need a reminder why UX matters and who it matters to, this is for you.
"We’re all here to make amazing, meaningful, lasting products. The explorations we make along the way are ephemeral, and it’s okay to treat them that way."
Why would we link to an article that tells you to skip wireframing? Because this thoughtful article about prioritizing the end product over intermediate deliverables is mostly in agreement with our philosophy that wireframes are not an end in themselves. It's not wireframes that are the problem, it's the way that they're so often (mis-)used.
"As UX practitioners, we should be constantly striving to challenge the status quo and push the boundaries of UX design, but we should do so in a way that feels logical, natural, and intuitive."
This article about balancing usability and innovation is a refreshing departure from two ubiquitous, yet seemingly contradictory, voices: one shouting "innovate or die!" while the other yells "people hate change!" Who could have guessed that the truth lies somewhere in the middle?
"A core concept at the heart of user experience is, 'You are not the user'. Intellectually, this is simple to understand but even the brightest UX designers seem to forget it as soon as they get in front of Sketch or any other prototyping tool."
Anyone trying to learn about UX will eventually come across David Travis. Very few people are able to explain the basic concepts as well as he does. There is so much wisdom about avoiding common UX traps in this rare interview. Highly recommended.
"By revealing features at just the right time, we enable our users to adapt to complex workflows and feature sets without feeling overwhelmed."
This smart article dovetails nicely with our latest video course called "The Psychology of UI Design". It covers the key principles governing human behavior that affect how people interact with digital products, like cognitive load and "chunking." An excellent reference with good examples.
"We need your help making user experience a priority. Acknowledge that details matter. Give us the time and space in the process to focus on details."
The relationship between product managers and designers has the potential to be symbiotic, but coming from two very different worlds produces an ongoing challenge. This thoughtful piece from a seasoned designer presents insights on how PMs can get the best out of their design companions.
"Structured information is easier to read and memorize, that is why lists are a part of HTML."
Lots of good, easy wins here for making lists, pricing tables, and other landing page elements look better.
"Throughout a website or mobile app project, you will have a lot of ideas and the best way to sort through those ideas is to brainstorm. Wireframes are a visual artifact of brainstorming, and the goal is to make them with minimal effort, as to encourage ideation."
One of the oldest and most reputable online learning platforms just released their first course exclusively focused on wireframing! Definitely worth checking out.
"UX is not meant to work against anyone. It’s a cross functional team that can make the business succeed by maintaining the focus on the user."
UX doesn't have to slow down an agile development process, but getting it right does require that both teams be open to change.
"Refactoring UI takes everything we know about design and bundles it into one comprehensive package, including a book, screencasts, a component gallery, custom designed assets, and more."
Their first book isn't out yet, but you can sign up to be notified and get a discount when it comes out. We have no affiliation with them, we're just fans. These Canucks really know their stuff.
"The core principle is to keep the concept moving forward, whatever it takes."
A quick read that you should reach for whenever you're stuck. Print it out and stick it to your wall, even if you don't call yourself a designer.
"Enable a clear path to completion by enabling smart defaults."
Forms constitute the quintessential way of gathering information and enable businesses around the web, and yet they remain the hardest elements to get right in our designs.
Fortunately, the web is full of great resources, and Simple Rules for Designing Web & Mobile Forms is a perfect example. Follow the link to uncover 22 maxims for better forms.
"It is better to focus on the usage context instead of their function."
Asking our users to choose between two possible states is a pretty straightforward task to design. But what if there's more than one option available? And, what happens when we have to ask our users to make two or more decisions at once?
Checkbox vs. Toggle Switch offers all the right answers by examining case by case what's the appropriate UI controls to use in every situation for optimal user experience.
To further your understanding of these exciting components make sure to checkout Toggle-switch Guidelines by the Nielsen Norman Group and Radio Buttons and Checkboxes, an article from our resources page.
"A hurried mobile user looking for specific content may never notice a carousel."
Carousels (also called slideshows, sliders, or galleries) were first introduced to solve a space problem. These are a typical method for sequentially displaying many pieces of content in the same place. The thing is, the ubiquitous solution to the space problem comes with important usability issues, especially on small screens.
In Carousels on Mobile Devices, you can learn about the main issues caused by carousels and how to alleviate them.
"If we don't understand the problem, what are the chances that we're going to get the solution right?"
All the fun of the product creation process seems to be in the solution space. There's where all our ideas and expertise come to play, so we skip ahead. But more often than not, jumping in too early without understanding the problem will lead us into a product/market fit dilemma.
In Mastering the Problem Space for Product/Market Fit, Dan will guide us on how to think of the problem space and how to use that knowledge to reach product/market fit with our solution.
"Acquiring a new customer is anywhere from five to twenty-five times more expensive than retaining an existing one."
Chances are we put more effort into converting as many leads as we can than in helping our existing customer base be more awesome. However, it's by making our customers happy that we'll bring the best results for our business.
Customer Recovery: Turn Bad Experiences into Unforgettable Good Moments describes a process to handle a pivotal moment in our relationship with our customers: the moment in which we drop the ball.
"The dashboard has a specific purpose that it’s undertaken to serve."
Designing dashboards is always a challenging task. To ease every stage of the process, the first step to take is to delineate its purpose. But you will still find some uncertainty ahead.
From how to tackle the content layout to how to use interactions, 10 Rules for Better Dashboard Design is a helpful resource to have on hand at all stages.
"Error messages are structural necessities."
We use apps every day, and yet do you notice the little details like the particular way an error or success message is phrased?
Error messages might not seem like critical elements of your design, but they can "help [the] overall user experience become more grown-up, more solid and more stable."
Content Design: How to Write Any Error Message describes the experience of the Deliveroo team creating a framework for error messages. It's a great lesson to take away to your team.
"The item that first grabs the eye’s attention is at the top of the hierarchy."
What is a visual hierarchy? What does it mean for your website or app?
Learn how to organize your content in an easy to read flow by following the tips outlined in Visual Hierarchy: Organizing Content to Follow Natural Eye Movement Patterns.
"Someone is a stakeholder when they care about the outcome of your project."
Interviewing stakeholders is crucial for any project. We tend to put our primary focus on users and technology, but let's not forget about the business side of our design solution.
The questions outlined in The Delicate Art of Interviewing Stakeholders are a great vehicle to start involving your stakeholders in the design equation.
"We were addressing the symptoms, not the core, fundamental issues."
We need to switch from a technology-centric view of the world to a people-centric one. That's our key takeaway from Why Bad Technology Dominates Our Lives, According to Don Norman.
The article is an enticing invitation to reflect on building technology to enhance people's lives. It's also an opportunity to think of reframing our priorities. Hopefully, from faster to better technology.
"If you don’t know what’s important on your website, you can only create a good design on accident."
Try looking at this page with both eyes partly closed. What do you see? A big block of text aligned to the center of the page. Bold subheadings. Some contrast between sentences. Different text styles. The list can go on.
That's a Squint Test. A simple way of evaluating specific principles on your work. These principles are Contrast, Hierarchy, Proximity, and Alignment.
In The Squint Test: Making Your Design Better Since Today, you'll uncover the full potential of its application.
"At its essence, it is about communication and transparency, which are critical to many aspects of life."
Mitigating usability problems in our designs is possible if we follow some principles. The most relevant set of principles for evaluating usability are Nielsen's ten heuristics. Knowing them well can enhance our design on every iteration.
The article Visibility of System Status pores over the first of Nielsen's heuristics. A great read to dive deep into the role of communication and feedback in your design work.
"Users integrating a feature into their lives isn’t something that just happens, it’s something you pursue, and something you fight for."
Onboarding is a key factor in customer retention. But, when is a user onboard? And, does it really end there?
From First Mile To Nth: Onboarding Beyond User Onboarding offers answers to these questions. Considerations to keep top-of-mind when thinking of feature adoption and customers success.
"Downplayed empty states are wasted opportunities."
Empty states are the in-between. The interactions that "can boost engagement, build consent, educate, delight, and entertain users." But we keep forgetting to design them.
Downplaying Empty States in Design is about taking advantages of these opportunities. A great starting point to learn how to go about using these states.
"You can’t simply block all EU IP addresses in order to avoid having to comply with the GDPR."
There's no way around the General Data Protection Regulation, GDPR. Although it seems like an intricate and prohibitive set of rules, it is not. Becoming compliant boils down to common sense and a few practical implementations.
Integrating Privacy by Design Into Your UI Design Strategy presents a viable way of reaching GDPR-compliance. It takes four main steps:
- Introduce clear privacy and data sharing notices.
- Provide information about how you manage users' personal information.
- Empower your users to manage their personal data.
- Reduce the amount of data you collect.
Creating a new product is exciting! Who doesn't love the rush of making something new, something not seen before?
There are so many ideas out there, or maybe in your head, how do you bring that idea to market? Developing a new product, or even just a new feature, is a team, and company-wide effort. Each person's job supports someone else or more than one person.
In An Overview of The Factors of Success for New Product Development by the Interaction Design Foundation (IDF), you can learn about how a team works together to bring something to the market.
Design Discovery is the term used for the first phase of a project following the standard design thinking process. It is incredible how many companies skip this phase and jump to solutions. How do you know what to build if you do not know who your users are and what problems they need to solve?
Where do your solutions come from if you are working off of assumptions? More Than Pixels: Selling Design Discovery has some great tips to get everyone on board with this investigation phase. Learn from Kyle Cassidy, Head Of User Experience Design & Insights at Dept, how to get your stakeholders on board with Design Discovery.
A standard interface problem is when to use which control for a specific interaction. In 7 Rules of Using Radio Buttons vs. Drop-Down Menus, Author Saadia Minhas takes two controls and breaks them down as to when to use them depending on the scenario you need to solve.
A quick tip: think of option visibility.
To take a deeper look at these two controls, check out our UI Controls Dictionary.
Believe it or not, geographic location falls under accessibility guidelines. For example, people who live in rural areas with limited bandwidth are required by federal law to use all of your website or app.
Website accessibility aims to address any limitations that may prevent the general public from being able to use a site that was explicitly built for public consumption. In 9 A11y Tips For Global Accessibility Awareness Day on Web Designer Depot, Suzanne Scacca shares a few simple ways to add accessibility to your projects.
We hear a lot about accessibility and the web, but what about other mediums? People do a lot more than using the internet every day, or so I hope! Gaming, a favorite past time for teenagers, and really, anyone these days, has entered the accessibility scene with Microsoft's new Xbox adaptive controller. Polygon lays out the thinking behind the creation of Microsoft’s new hardware.
Microsoft's Xbox Adaptive Controller is a device designed to pair with an array of existing peripherals to let more people with disabilities play games on Windows 10 and Xbox One. The design is not intended to address one specific disability, but instead to be a base on which any number of adaptive options can be added on. This is scalable accessibility.
I recently actually paid attention during an airline safety information video for the first time. It was a British Airways collaboration with Comic Relief, and it was genius. Safety information doesn't have to be boring. In fact, it shouldn't be.
Products that help us do unexciting tasks don't have to be humdrum.
Alice Kotlyarenko, Staff Writer at MacPaw explains How To Design Emotional Interfaces For Boring Apps. It's possible using five effective techniques:
Jon Moore is a Senior Design Partner at Innovatemap, co-founder of UX Power Tools, and also a generous writer.
In Here's everything I've learned from designing 10,000+ UI screens as a lead product designer Jon distilled ten maxims to design better products from his years of experience.
Our favorite: "Business and user value usurps EVERYTHING ... If you can deliver value to the user, you will create customers who will drive value to the business."
There are many facets of the user experience of a product. Seven, according to Peter Morville. We can balance them out in different proportions, but Useful and Valuable should be at the core to guarantee success.
How to Figure Out if Your Product Actually Solves Problems is a project reflection published by Katie Cerar, Product Manager at Shopify Plus. In it, Katie shares the process of a team trying to mitigate risk and ambiguity, to build value and usefulness into a product.
Change is neutral by nature. The circumstances in which change happens is what makes it a positive or negative experience.
In Users Don't Hate Change. They Hate Our Design Choices, Jared Spool, Founder of UIE and Co-founder of Center Centre reminds us that we can help users embrace change by following four principles:
- Reduce the change to the smallest units possible.
- Give users control over when the change affects them.
- Show users how the change benefits them.
- Respect the users’ existing investment in your design.
We all struggle with the number and type of participants we should include in our studies. But it doesn't have to be that way.
Usability Expert Jakob Nielsen concluded many years ago that "the best results come from testing no more than five users and running as many small tests as you can afford."
More recently, David Travis, UX Strategist and Researcher at Userfocus challenged this topic and identified four reasons why you don't need a representative sample in your user research. He also shares an antidote for mistakes: iterative design.
Ideally, people would understand the information they must fill in in a form with little effort. If not, we need to offer some assistance. Tooltips are an appropriate UI component for this task.
How to Display Tooltips on Mobile Forms by UXmovement, rounds up best practices and recommendations for "easy to spot, tap, and read" tooltips to raise the performance of your forms.
For an in-depth dive into Tooltips, check out our UI Controls Dictionary entry for them.
We spend all of our energy walking in our users' shoes and giving them an exceptional in-app experience, but what about the moment they want to leave? "Because the logout is such a staple action in our day to day digital processes, it is a prime place to inject some substance."
Digital products based on the capitalization and monetization of user data (a.k.a. Surveillance Capitalism) that deliberately take advantage of human behavior and make us addicts, in order to make money, should be considered unethical.
But not all data-driven design falls into this category. In Ethical Design: The Practical Getting-Started Guide, Trine Falbe, researcher and author of White Hat UX explains "how unethical design happens, and how to do ethical design through a set of best practices."
To know more about Trine's work on Ethical UX, listen to this podcast episode of UI Breakfast.
Designers' skills are "better understood as a line of wet paint drawn across a canvas." But for clarity (and sanity) at the time of hiring (or looking for a job,) we tend to emphasize the areas where the paint drips down intensely.
In The Spectrum of Design Roles in 2018, UX Engineer Jasper Stephenson does a fantastic job at explaining the breadth of design roles today, and what kind of designer your company needs (or what kind of designer you are).
*"I’ve launched my app and can’t get any users, what should I do?* - Delight the few users you have." That's the advice Stuart Hall, Co-founder & CEO at Appbot has for all entrepreneurs struggling with their business growth.
Feedback Driven Growth: A Process For Sustainable Growth is a great read for all of you searching for a strategy to advance on the road to bootstrapped success.
Don't get confused by the title; there's no cheating when applying the tips in this excellent article. The authors Adam Wathan and Steve Schoger from RefactoringUI.com do a superb job at explaining wise but straightforward "tricks you can use to level up your work that don’t require a background in graphic design."
7 Practical Tips for Cheating at Design is the kind of article you'd like to have on hand the next time you want to make the most out of your projects without regretting not going to design school.
"Businesses have embraced the idea that meaningful innovation requires understanding their customers as humans with complex lives." This new reality reflects outstanding progress, but we still have to revise "myths, misperceptions, and hedges" surrounding the process of acquiring such understanding.
Ericka Hall, Co-founder of Mule Design and author of Just Enough Research and Conversational Design, put together 9 Rules of Design Research, a concise list to help us correct our path towards better products.
As voice interaction find its way into our lives through our phones, cars, and even our refrigerators, it's easy to imagine a near future where we primarily talk to our devices but does this means that we can get rid of screens?
Like Neil Turner from UX for the Masses states "having a screen is pretty useful," and the key to knowing how much of an interface we need is in "allowing users to focus on their job to be done, rather than having to focus on using an interface."
The article Why the Best Interface Is Just Enough of an Interface is a fun read with valuable hints to design better UI.
Getting users to adopt a new technology is always a challenge, especially if the new solution has a steep learning curve and causes legitimate frustrations.
It's in situations like this when approaching design as "a way of defining and planning what we want a user to learn" and therefore, thinking of ourselves as teachers, can result in an effective tool.
In Design Like a Teacher, Aimee Gonzalez, UX Consultant and a member of the teaching team for Harvard’s UX Engineering course shares her experience of facilitating the adoption of a sophisticated Health Care System and how this new perspective transformed her UX practice and helped her achieve the project's goals.
(Not a design article but still a great read.)
If you're an entrepreneur in the software industry, going through the fundamentals of The business of SaaS with Patrick McKenzie from Stripe is a good investment of your time. This piece "will help you make better decisions for your product (and company), allow you to see business-threatening problems months or years in advance of them being obvious, and help you in communicating with investors."
If you're not an entrepreneur, it still is a fascinating look at the SaaS world and might even spark ideas for your next adventure.
Research is not a phase you can afford skipping in the process of creating or refining a product or service. Answering *"do I have a problem worth solving?"* is essential to every business success story, and Discovery on a Budget is a practical starting point to help you with the task.
Meg Dickey-Kurdziolek, a freelance UX Researcher, delineates "strategies for conducting discovery research with no budget, existing user data, or resources to speak of" so you can revise and enhance this crucial step of the process.
Understood as "an unintended solution to a problem," a workaround is also an opportunity for improvement. But "how can we identify workarounds and assess their value in order to come up with an even better solution?"
We build wireframes to communicate our ideas and get everyone on board before committing to code or elaborated visual designs. We build them to reduce time and effort. We make them "not just to have a skeleton for the UI design, but to be able to quickly iterate, modify and get feedback."
In Why You Shouldn’t Skip Your Wireframing, Nazli Kaya, freelance UX Designer, explores the usefulness and relevance of wireframes as a communication tool, and how we can take advantage of them throughout the design process.
The standard practice is to reduce friction to the minimum in the experiences we design, but there are "a few use cases" where friction can be just the right feature to add.
Zoltan Kollin, Head of UX at IBM Cloud Video, expands on these few use cases in Designing Friction For A Better User Experience. In the article, he analyzes a set of scenarios and examples showing how "the right amount of friction at the right time" is what makes designs efficient.
Every field has a definitive reading list that practitioners trust for learning and refreshing. But there are also some hidden gems that fall out of the cracks of these lists until some generous colleague brings them to our attention.
Here are 5 UX Books That’ll Change How You Think about Design according to Petr Augustin, Lead UX Designer at Kentico Cloud. Enjoy!