Smashing Newsletter: Issue #391

Editorial

The web is not a particularly friendly place. We all have seen plenty of annoying pop-ups, distracting notifications and mysteriously confusing cookie consent prompts. But while some of these things are just annoying, others are invasive — gathering our data, tracking our behavior and even reselling our data to the highest bidder.

In this newsletter, we look at privacy, security, authentication, legal tracking flowcharts and general deceptive patterns and privacy patterns. You can find plenty more insights in Heather’s wonderful Smashing Book on Understanding Privacy (Print + eBook), and also in a series of video chapters in our video course on UX and design patterns.

In the Smashing news, we also have new free online events coming up soon:

Smashing Hour: Typography with Elliot Jay Stocks on Tuesday Feb 21,
Smashing Meets on Everything Figma (a free meet-up), on Tuesday Feb 28,
Smashing Workshops (incl. free workshop on Going Headless),
SmashingConf Front-End @ SF 2023
SmashingConf Freiburg 2023
Something brand new and shiny to be announced soon ;-)

We’d absolutely love to see you there — and please do share with the world if you’ll attend, of course! In the meantime, let’s see how we can boost privacy and security in our products!

— Vitaly (@vitalyf)

1. Fighting Deceptive Patterns

Deceptive patterns can be hard to spot, but they are all around us: Social media apps forcing us to connect our phone numbers, “free trials” that automatically turn into paid services without a reminder, or prompts where the “no” option is well-hidden. The list could go on. Luckily, there are some great initiatives out there that take a stand against Deceptive patterns.

One of them is the Dark Patterns Tip Line. To raise awareness of the harm that manipulative design can cause, it crowdsources stories of digital manipulation. The goal is to help policymakers and enforcers hold companies accountable for their practices. So whenever you come across a dark pattern, don’t hesitate to report it to the tip line.

The hall of shame by Deceptive Design also collects stories from users who had to deal with deceptive patterns. The same goes for the Dark Pattern Detection Project. Their goal is to develop an open-source, AI-based text analysis tool that detects deceptive patterns automatically and redesigns them in a personalized manner for the respective customers. (cm)

2. Legal Compliance

You want to use cookies? Or send an email out? Swiss law firm Vischer published a set of flowcharts to help you make the right call whenever you’re unsure if there are any legal implications that you need to consider.

The Website and App Tracking Legal Checklist takes the ePrivacy Directive and GDPR into account to help you find out if your plans are compliant with the law, if you need to check local law aspects, or if you need to make further adjustments. The Marketing Communications Legal Checklist works similarly and comes in handy whenever you plan to send an email to your customers. Two for the bookmarks. (cm)

3. Better Authentication UX

Authentication is a tricky subject; if done wrong, it can break a user experience. There are password rules that make it hard to remember the password we chose and well-meant security questions that might even lock us out of our accounts instead of providing an extra layer of security. And nobody likes to identify crosswalks and fire hydrants either. So how can we fix the authentication UX for good?

That’s exactly the question that Jared Spool explores in his presentation “Fixing The Failures of the Authentication UX.” He explains how to make authentication design a priority in your experience architecture and where the real risks are so that you can best protect your users — without frustrating them.

If you’re looking for practical patterns to create frustration-free authentication experiences, Vitaly’s post “Rethinking Authentication UX” has got you covered. It dives deeper into why disabling copy-paste for passwords isn’t a good idea, why you should drop strict password requirements, options for access recovery, and more things to consider to improve the authentication status quo. (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:

Universal Principles of Typography Masterclass UX
with Elliot Jay Stocks. Mar 2–16
Go Headless with Your Favorite Framework FREE
with Josefine, Facundo and Manuel. Mar 2–3
Interface Design Patterns UX Training UX
with Vitaly Friedman. Mar 10 – Apr 7
The Power of Storytelling UX
with Chiara Aliotta. Mar 14–28
Figma Auto Layout Masterclass UX
with Christine Vallaure. Mar 27
UX/UI Design & Figma Introduction UX
with Christine Vallaure. Apr 20–28
New Front-End Adventures, 2023 Edition Dev
with Vitaly Friedman. Apr 25 – May 9
Architecting Design Systems Workflow
with Nathan Curtis. May 11–19
Data Visualization Masterclass Dev
with Amelia Wattenberger. May 4–18
Deep Dive On Accessibility Testing Dev
with Manuel Matuzović. June 12–26
Jump to all workshops →

5. Designing For Security

Maybe you’ve come across the assumption that security can get in the way of usability. Krisztina Szerovay argues that designing for security should not be an afterthought, and it doesn’t have to result in compromise either. To illustrate how usability and security connect, she created the “Designing for Security” UX Knowledge Base Sketch.

The key takeaway from the sketch: Usability and security go hand in hand. If something is usable and less confusing, it’s likely to be more secure. If something is secure, it’s more reliable, increasing usability. The sketch also pinpoints security patterns and things you can do to make security-related design decisions. (cm)

6. Behavioral Science Resources

Behavioral science helps us better understand human behavior and, ultimately, the design problems we try to solve. After all, everything we design, whether it’s interfaces, interactions, or experiences, is designed for human behavior. Elina Halonen started an open-source repository of case studies and learning resources that gets us familiar with behavioral science and the opportunities it offers for organizations.

The repository features examples of how behavioral science can be applied in different domains, tips for demonstrating the value of behavioral science to stakeholders and clients, and ideas for career options and what skills might be useful. The repository lives on a Miro board. If you are unsure of how to use it, Elina wrote a blog post with everything you need to know. Plenty of insights on anything from privacy to sustainability. (cm)

7. Privacy UX

Some web interfaces have become quite a character, haven’t they? Self-indulgent, impolite, and obsessed with users’ data. In his article series on Privacy UX, Vitaly looks into privacy UX patterns that help us do better, without leaving conversion considerations behind.

In part 1, Vitaly looks into common concerns and privacy in web forms, part 2 investigates the cookie consent experience, part 3 is dedicated to notification UX and permission requests, and, last but not least, part 4 brings it all together, exploring how the approaches fit into an overall design strategy. Practical tips that help you develop a pragmatic approach for designing and building ethical and respectful interfaces. (cm)

8. Privacy Design Patterns

How can we convert the lawyer speak around privacy to engineering speak? How can privacy problems be anticipated early in the development process to provide safer experiences for our users? These are the questions that the folks behind Privacy Patterns asked themselves. The result is a collection of patterns and design solutions to common privacy problems.

From protecting your users against tracking to preventing suspicious access to user data, each pattern examines the context, problem, solution, consequences, and examples. The goal is to grow the pattern library into a living document where everyone can contribute — engineers and designers, just like lawyers and regulators. A great effort to standardize and simplify the discussion around privacy. (cm)

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).

February 7, 2023 Smashing Newsletter: Issue #391

Previous Issues