Aluu Smashing Friends,
We’ve just added 3 new video chapters to Smart Interface Design Patterns 🍣 — a practical video library for designers and UX folks. With sorting UX, cancel buttons, hidden and disabled states — along with UX decision trees to follow along. Price will go up this week! Jump to table of contents.
Confirm vs. Undo Decision Tree: UX guidelines on how to choose or, or the other. A part of Smart Interface Design Patterns. Check large view.
If you already have the course, you can start watching now right away — and you’ll find them in the video library. And if you don’t, you can still get access before the price goes up later this week. Jump to table of contents.
Launching this Wednesday: Open Up with Brad Frost. Share your struggle and join for free.
In Smashing news, we are excited to launch our brand new show: “Open Up” wih Brad Frost to help you navigate challenges in your profession and private lives — with the first episode going live this Wednesdany, March 12, at 8AM Pacific time (4PM CET). We hope to see you there! Join for free.
— Vitaly
1. In Defense Of Text Labels
When you use icons in an interface, do you usually add text labels? If not, you might want to reconsider your approach. As Christopher Butler points out in his post “In Defense of Text Labels,” even the simplest icons can create ambiguity, requiring additional cognitive effort and slowing down users’ orientation within an interface.
To aid orientation and make scanning easier, Christopher recommends adding text labels to icons. As he points out, combining text labels and icons creates clearer affordances than either element could on its own. And not relying solely on icons to communicate function also brings along another advantage: greater creative freedom for designers as they can focus more on the unity of their interface’s design language. A great reminder that making things feel simple is often the more elegant solution than making things look simple. (cm)
2. Stop Using Placeholders In Forms
We’ve all come across forms where the hint or even the form label was placed directly inside the form field. And while the design decision saves space and has a nice minimal aesthetic, it can hurt usability more than aid it.
In his post “Why you should stop using placeholders in text boxes,” Daniel Berryhill explains the problems it can cause and what we can do instead to make crucial or helpful information always visible. As it turns out, as so often, the approach that checks all the boxes — both accessibility- and visibility-wise — is also the simplest: using a <label>. (cm)
3. Tools For Better Thinking
Am I solving the right problem? Which option is the best one? What are the long-term consequences of my decision? Thinking tools can help designers find answers to the questions they ask themselves on a day-to-day basis. A wonderful overview of such tools comes from Adam Amran.
Untools is a collection of thinking tools and frameworks to help you solve problems, make decisions, and understand systems. From the Eisenhower Matrix to the Iceberg Model, the tools cover systems thinking, decision-making, problem-solving, and communication. A guide helps you choose the right tool for your needs. One for the bookmarks. (cm)
From our sponsor
Build Forms Your Way! SurveyJS v2.0 Custom Form Builder Update
SurveyJS just got a major upgrade! With SurveyJS v2.0, you’ll enjoy a more intuitive survey-building experience and expanded UI customization options. Easily create your own form management system with SurveyJS extensible form-building UI libraries, which integrate seamlessly with any backend and support React, Angular, Vue 3, and more. Explore new theming options, input masking, PDF export, and real-time analytics. Free demo — no sign-up required.
4. Elements of Product Design
As we explore design patterns, one UX model that is useful to always keep close to is Elements of Product Design (pictured below), put together by Jamie Mill on top of Jesse James Garrett’s work. It’s an interesting look at product design through the lens of reality, problem space and solution space — by viewing it as a stack of decisions built on top of a stack of knowledge.
Our digital products must match the complexities of life. Too often, we push pixels left and right, just to meticulously design a solution to the problem that doesn't really exist. And sadly that initial discovery and UX research are highly undervalued and underappreciated these days.
If you find yourself seeking a challenge, explore the messy layers of product strategy and conceptual model. Very often, only a few designers live there; very often, an improvement there is exactly what a company desperately needs.
5. Good Design Practices
Structure and organization might not sound like the most exciting things, but investing time in properly arranging and naming your files can prevent slow-downs and unmanageable situations in the long run. To help you organize your design documents, Javier Cuello created Design Good Practices.
Design Good Practices features guidelines and practical examples for keeping your design files in order, covering everything from naming conventions to organizing pages and documenting design specifications. Apart from helping you turn a creative mess into a logical, predictable, and scalable way of working, the guide also shares useful tips and Figma tutorials for designing accessible and user-friendly components. (cm)
6. Upcoming Workshops and Conferences
That’s right! We run online workshops on frontend and design, be it accessibility, performance, or design patterns. In fact, we have a couple of workshops coming up soon, and we thought that, you know, you might want to join in as well.
With online workshops, we aim to give you the same experience and access to experts as in an in-person workshop from wherever you are.
As always, here’s a quick overview:
7. Books For UX And Interface Designers
It’s fantastic to see how many wonderful UX and interface design books have been published lately. To give you an overview of which ones you might want to add to your personal reading list, Vitaly compiled his recommendations in a post.
From validating product ideas to visualizing data, from pricing design to trauma-informed content, from accessibility operations to cross-cultural research, the books and eBooks cover strategy, design patterns, UX, and much more. Many of the book authors also produce useful content for free, so be sure to take a closer look at their work and support them if you can. Happy reading! (cm)
From our sponsor
Seamlessly Integrate Your Tools And Services On HubSpot
CopyHubSpot’s developer platform helps teams connect new and existing software, unifying their tech stack. You can build apps with HubSpot APIs and extensibility. From listing your app in the HubSpot Marketplace to building custom solutions, there’s something for everyone to grow better.
8. Guide To Information Architecture
Information architecture creates structure and meaning, making it easy for users to find the answers to their questions. If you’re completely new to information architecture or want to feel more confident about your process and decisions, be sure to check out Donna Spencer’s A Practical Guide to Information Architecture. The PDF version of the book is available for free download for a limited time.
Donna’s guide dives deep into information architecture and navigation design for internal and public projects and redesigns. You’ll learn to better understand your user’s motivations, to implement and test a draft of your work, and finally, to iterate to a more complete solution. Practical advice that you can apply to your work right away. (cm)
9. Recently Published Books 📚
Promoting best practices and providing you with practical tips to master your daily coding and design challenges has always been at the core of everything we do at Smashing.
In the past few years, we were very lucky to have worked together with some talented, caring people from the web community to publish their wealth of experience as printed books. Have you checked them out already?
Meet our newest book: Success At Scale by Addy Osmani. Get the book or browse the complete library.
10. Recent Smashing Articles
That’s All, Folks!
Thank you so much for reading and for your support in helping us keep the web dev and design community strong with our newsletter. See you next time!
This newsletter issue was written and edited by Cosima Mielke (cm), Vitaly Friedman (vf), and Iris Lješnjanin (il).
Sent to truly smashing readers via Mailchimp.
We sincerely appreciate your kind support. You rock.
Follow us on Twitter • Join us on Facebook
