Bună seara Smashing Friends,
Complex interfaces come in different forms and shapes. Often we explore design patterns for structured data — with data tables, filters and search — among many others. However, sometimes things get even more complicated.
How do we design better dashboards? What about detailed maps with multiple overlays? Or perhaps AR or voice assistants? In this newsletter, we’ll explore them in all the fine detail. And if you'd like to dive even deeper, our growing UX library is always here to help!
SmashingConfs 2024: our schedule for 2024, and we’d be absolutely delighted to welcome you. With friendly bundles for friendly teams.
We also have a few community events coming up soon:
- Smashing Hour on Design Systems with Ben Callahan (Tue, Nov 28, 8AM PT / 5PM CET),
- Smashing Meets Go Green (Thu, Dec 7), free online community meet-up on digital sustainability,
- Smashing Hour on Typography with Oliver Schondörfer (Mon, Dec 11, 8AM PT / 5PM CET),
- Smashing Online Workshops on UX, design and front-end,
- SmashingConfs 2024: Freiburg, New York, Antwerp.
We can’t wait to see you online and in-person this and next year. And we keep sending you a lot of positive energy, hope, optimism and positive thinking for the week ahead!
— Vitaly
1. Why You Might Not Need A Dashboard
We live in a time of data where dashboards and data visualizations are everywhere. They show us everything from our phone’s weekly usage to monthly spendings and performance at work. And while they are usually considered intuitive, research shows that dashboards and data visualizations are often ineffective in conveying clear, actionable insight.
Irina Wagner came to the conclusion that many dashboards aren’t usable to most people. For certain user profiles (e.g., data scientists, researchers, or medical professionals), a dashboard might be the way to go. However, for the general audience, it might be a better investment to explore automation and AI to provide actionable contextual insights.
If you look for insights on dashboards, explore dashboard design patterns by Benjamin Bach, rules for better dashboard design by Taras Bakusevych and a guide to designing effective dashboards by Kamila Giedrojc. Happy reading! (cm)
2. Usability Of Augmented Reality
Augmented reality (AR) adds an additional layer of information to the real world. It can show you what the couch you plan to buy will look like in your living room and even bring history to life. The potential is huge, but AR features in mobile apps still have a lot of usability issues, as the Nielsen Norman Group found out in a recent study.
Poor discoverability, low-visibility instructions, and vague icons and signifiers are some challenges that study participants struggled with when interacting with AR. In their article “The Usability of Augmented Reality,” Sana Behnam and Raluca Budiu outline the findings from the study and share design recommendations for addressing the issues. A great reminder to not implement AR for the sake of AR but rather make sure that it adds value to the overall user experience. (cm)
From our sponsor
Seamlessly Integrate Video Meetings Into Your Platform With Whereby
Elevate your platform’s communication capabilities with Whereby. You can choose between using Whereby’s pre-built UI, or creating a completely custom experience using React hooks—no WebRTC skills needed. Ready to transform your platform’s communication experience? Get started now!
3. Designing An In-Car Voice Assistant
Voice assistants in cars are often more an unused gimmick than an essential part of the in-car experience. However, a well-designed voice assistant even has the potential to make driving safer, as Casper Kessels found out. He spent months researching the role of voice assistants in reducing driver distraction and turned his findings into a set of guidelines for designing great in-car voice assistants.
The guidelines include 18 practical tips and do’s and don’ts for designing a voice assistant that keeps drivers focused on driving, builds trust and satisfaction, and prevents errors. While there are a couple of things to consider when designing voice assistants for driving that are different from typical voice assistants, Casper’s tips for making communication personal and preventing error loops are universal and can also be applied outside the in-car setting. (cm)
4. Upcoming Online Workshops
That’s right! We run online workshops on front-end 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:
5. Natural Language Inputs
What if every input was a text input that accepts natural language? For example, you could just type “12pm” when you need to enter a time instead of choosing “12” from a dropdown, then “00” from a dropdown, and “pm” from another dropdown. That’s exactly the question that Jim Nielsen asked himself.
In his blog post “Natural Language Inputs,” he further explores the idea of allowing users to just type to enter their information. An interesting design pattern that completely rethinks how users input information and how designers and developers design for input. (cm)
From our sponsor
Webinar: Angular v17 Secrets And Surprises!
The Angular Renaissance is here! New brand, new logo and a brand-new website! Join our webinar to dive deeper into Angular v17! Reserve your seat.
6. System Status UX
Whether it’s communicating to a user that a file is uploading, saving is completed, or data is being fetched, a well-designed and well-written system status helps build trust and confidence. Meganne Ohata wrote a great deep-dive into system status UX and how we can make the dialogue between human and computer more productive, helpful, and, generally, a positive experience.
As a rule of thumb, Meganne suggests to think of system status as a way to tell the user what the results of their actions will be and to set expectations for what’s happening at the moment. In her breakdown, she shares examples of beneficial and failed communication, explores how distinct and eye-catching a system status should be, and looks at different UX patterns to communicate system status. The tips are easy to implement but make a huge difference for users. (cm)
7. Better Maps UX
How to systemize interactive map labels that can hold content for one destination address just like thousands of scooters? Linzi Berry shares insights into how the Lyft team designed a flexible map component that caters to all needs and use cases.
It can be combined with exact locations, objects, or stand on its own, it adjusts when zoomed, and it is big enough to meet tap target requirements and small enough to not block map interaction.
If you want to dive deeper into the UX of maps, also be sure to check out Michael Gaigg’s “Design Patterns For Effective Maps UX”. The repository highlights practical design patterns for planning, designing, and building better map experiences, as well as common mistakes and how to avoid them.
With layout considerations, filters, markers, pop-ups, focal points, interaction design, route directions, and much more, the collection is a goldmine of patterns that help you build maps users will love to use. (cm)
From our sponsor
Supernova: Your Design System Partner
Elevate your design system with Supernova — now supporting Figma Variables and an all-new developer experience. Import your Figma libraries, and Supernova will automatically identify and sync any changes made in Figma. Connect your designs to your codebase using exporters to push changes directly and automatically to your production code. Simplify your design pipeline today!
8. Smashing Book Library 📚
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?
… and we’re currently working on a new book: Success At Scale, shipping in February. Pre-order your copy or browse the complete library.
9. 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