Smashing Magazine - #433: Dashboards, Maps & UX

Designing better dashboards, AR, in-car voice assistant, maps UX and natural language input — along with SmashingConfs 2024 and community events. Issue #433 Nov 28, 2023 View in the browser

Smashing Newsletter

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!

SmashingConf 2024
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:

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.

Are data dashboards vanity projects?

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.

The Usability of Augmented Reality

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

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.

Guidelines for Designing an In-Car Voice Assistant

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.

Smashing Online Events
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.

Natural Language Inputs

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!

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.

Visibility of System Status

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.

Tap to Navigate

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

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?

Success At Scale
… 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

unsubscribe update preferences view in your browser

Older messages

#432: Design Systems

Tuesday, November 21, 2023

How do you organize a design system with 900 components and 25 designers? How do you design a UI component from scratch? How do you choose the right parts, products and people for your design system?

#431: Lovely Little Websites

Tuesday, November 14, 2023

Helpful and inspiring websites, UX guides, vintage posters and a smart recipe website. Issue #431 • Nov 14, 2023 • View in the browser Smashing Newsletter Boa noite Smashing Friends, The web is a

#430: UX Guides, Templates and Career Ladders

Tuesday, November 7, 2023

30-60-90 day plan for designers, UX guidelines, user journey templates and UX research glossary. Issue #430 • November 7, 2023 • View in the browser Smashing Newsletter Bonne soirée Smashing Friends,

#429: Front-End Accessibility

Tuesday, October 31, 2023

With WCAG 2.2 explainers, how to make a strong case for accessibility, accessibility testing and accessible data visualizations. Issue #429 • October 31, 2023 • View in the browser Smashing Newsletter

#428: Useful Front-End Tools

Tuesday, October 24, 2023

With online workshops, modern CSS, calculators, useful front-end tools and resources. Issue #428 • October 24, 2023 • View in the browser Smashing Newsletter Hello Smashing Friends, What are some of

You Might Also Like

Accessibility Weekly #428: Putting AI to the (Accessibility) Test

Monday, December 23, 2024

December 23, 2024 • Issue #428 View this issue online or browse the full issue archive. Hey accessibility friends! It's the time of year where news and information slows down as many people take

2024 magic moments

Sunday, December 22, 2024

Issue 225: The year from my personal lens ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏

Planning mode

Friday, December 20, 2024

Lessons from our first-ever annual planning sprint ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏

We Co-Sign This AD100-Approved Trend

Thursday, December 19, 2024

View in your browser | Update your preferences ADPro Emboldening the Bath Marble, marble, everywhere, and every drop is chic. According to AD100 designer Jake Arnold, “material drenching”—that is,

177 / Keep calm by listening to these ambient sounds

Thursday, December 19, 2024

Product Disrupt Logo Product Disrupt Half-Monthly Dec 2024 • Part 1 View in browser Welcome to Issue 177 Lately, I've been driving a lot of inspiration from the things I see in real life. The range

The Year in Color: Hella Jongerius, Mocha Mousse, and More

Thursday, December 19, 2024

View in your browser | Update your preferences ADPro Color Our World Since the summer, AD PRO has kept its finger on the pulse of color predictions. Overall, the vibe right now is down to earth,

🐺Get Media Features in 2025

Thursday, December 19, 2024

A BIG Wolf Craft announcement!! ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏

Small teams

Thursday, December 19, 2024

Issue 224: Why the mentality of lean and small always wins ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏

Accessibility Weekly #427: The Myth of Accessible Components

Thursday, December 19, 2024

December 16, 2024 • Issue #427 View this issue online or browse the full issue archive. Featured: The myth of 'accessible components and done' "Think you've solved all your

Here's what you missed...

Thursday, December 19, 2024

Get press for your business in 2025...here's how. ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏