Smashing Newsletter: Issue #224

Editorial

We spend quite a bit of time refining our precious pixels and aligning content blocks inside containers, but some of the things we are designing are almost invisible — and way more complicated to get right. One of these things is when we’re designing with privacy in mind.

Over the last month, as a part of my upcoming book on Responsive Design Patterns, I was researching interfaces and interviewing people about the privacy UX issues they’ve experienced on the web. It’s been quite eye-opening to see common techniques that we take for granted raise such serious privacy concerns, from importing personal contacts to exposing personal preferences to third parties.

The main issue is always the same: customers don’t feel that they have any control about data harvested about them. They worry about convoluted privacy policy changes, an app posting on their behalf, unwanted notifications, hidden ads, and manipulative UIs pretty much scattered everywhere. That’s why subscriptions are tough to sell, and why users sign up for free services with temporary email addresses.

There is a general expectation that personal data will “certainly” be used and collected, yet leaving services doing that is “often impossible”. To protect user’s privacy, we can use Privacy by Design framework and there are design strategies that we all can apply to our work.

We need to explain why we need users’ data and ask exactly what we need — never more than that. When asking for sensitive details, prepare customers ahead of time. Allow customers to granularly adjust privacy settings and cookie preferences. Let users choose specific time ranges and days when notifications can be sent, and reduce their frequency by grouping them and allowing users to snooze or pause them. Also, never display a permission prompt on load.

That’s just scratching the surface. Users are very well aware when they are being manipulated or tricked into something they don’t really want. So involve conversations about privacy early on to avoid privacy disasters down the road. And publish case studies of how it helped you succeed and improve retention rates. The protection of personal data deserves more attention these days.

Privacy matters.
— Vitaly (@smashingmag)

Human-Centered Design Methods
Browse Your Git History With Ease
SmashingConf Toronto 2019
The Weight Of Third-Party Scripts
Making Future Interfaces
How To Grow At Work
Create Your Slides With HTML And CSS
Tech Terms Explained The Easy Way
Keep An Eye On Time
Upcoming In Smashing Membership
Our Next Smashing Workshops
Bruce’s Joke of The Week

1. Human-Centered Design Methods

Human-centered design helps you see things from a new perspective and find innovative solutions to difficult problems. But how do you approach human-centered design? The folks at IDEO.org put together a handy step-by-step guide to human-centered design. Practical methods and innovative approaches that put the people you serve at the center of your design process. (cm)

2. Browse Your Git History With Ease

Do you know those moments when you need to browse your Git history, but it takes a while to find what you are looking for? Git History helps you get the job done more efficiently. Once installed, you can replace github.com in your file URL with github.githistory.xyz to browse a repository’s changes chronologically. Useful! (cm)

3. SmashingConf Toronto 2019 (June 25-26)

The web is diverse and fascinating because it’s designed and built by people who are diverse and fascinating. Every year, we’re happy to bring some of these wonderful people together at SmashingConf — to share what they learned in a friendly, diverse and inclusive space. The next one is SmashingConf San Francisco in April (only a handful of tickets left—be quick!), followed by SmashingConf Toronto in June.

SmashingConf Toronto is a friendly, inclusive event focused on real-world problems and real-world solutions. Convince Your Boss PDF (249 KB).

For our second SmashingConf Toronto, we’ll explore the bright and dark sides of front-end and UX — Service Workers, Design Across Cultures, Design Systems, Calm Design, Performance, Vue.js, Animation, Designing for Touch and much more to come! Plus a bunch of hands-on workshops on design, front-end and UX.

In Toronto, we’re happy to welcome new and old friends — Amber Case, Brad Frost, Jenny Shen, Scott Jehl, Sarah Drasner and so many other groovy speakers. Of course, tickets are available, and we’d love to welcome you there, too!(bl)

4. The Weight Of Third-Party Scripts

It’s no secret that third-party scripts are responsible for excessive JavaScript execution on the web today, so making informed choices is key to prevent performance bottlenecks. To give you an overview over which third-party services weigh in heaviest, Patrick Hulce broke them down by category and ranked them by the impact of their scripts. One for the bookmarks. (cm)

5. Making Future Interfaces

Have you watched one of Heydon Pickering’s “Making Future Interfaces” videos already? If not, the less than 10-minute long explanations are time well spent. Heydon already covered algorithmic layouts,custom properties, inline SVG, and unusual shapes — in a very clear and entertaining way. (cm)

6. How To Grow At Work

Progressing at work is too hard for designers and engineers, claims Jonny Burch. That’s why he came up with the idea for progression.fyi, a collection of public and open-source progression frameworks that are bound to help you and your team understand how to grow at work. The frameworks come from renowned tech companies and attempt to answer common progression questions like how to know if you’re good at a job, what the company expects of you, or how long it’ll take to get a promotion or pay rise. (cm)

7. Create Your Slides With HTML And CSS

Whenever you give a presentation — be it at an office meeting, meetup or conference — you probably create your slides with softwares such as Keynote or Google Slides. Hui Jing Chen now shares a great way to create slides that feels much more natural to web developers: HTML slides that get by without any frameworks and work only with CSS. Hui Jing shows how it works. (cm)

8. Tech Terms Explained The Easy Way

Explaining tech can be tricky. Or how would you explain to your grandma what an algorithm does or what a botnet is? The Sideways Dictionary, a project by The Washington Post and Jigsaw, uses real-life analogies instead of definitions to make complex tech terms easy to understand. The idea behind it: If everyone understands technology better, we can make technology work better for everyone. (cm)

9. Keep An Eye On Time

Sticking to the program can be tricky when you’re giving a talk or workshop. To make sure you end the session in time, Koos Looijesteijn built Big Timer. With its sleek look, the timer counts down the remaining minutes right in your browser tab. Keyboard shortcuts let you adjust the duration of the timer as well as give you the ability to stop and pause it. Sometimes it’s the small things that turn out to be invaluable — we’re sure you’ll agree! (cm)

10. Upcoming In Smashing Membership

We’ve been increasing the amout of webinars (without increasing the price of membership — it still starts at just $5 a month!) and have also improved video quality since we moved to using the Zoom platform. We hear a rumor that one of our recent webinars isnominated for Best Supporting Appearance by a Belarusian when Vitaly took over so Bruce could have an afternoon to hunt for more talented members of our industry to help you learn from Smashing TV. Who knows what awards await our next webinars?

Coming up next:

📺 Smashing TV with Chen Hui Jing, “Using Firefox DevTools To Understand Modern Layout Techniques”
Feb 19, 08:00 AM Eastern
DevTools are great for debugging, but the newer releases of Firefox include tools that are great for helping you learn new CSS layout techniques by allowing you to visualise them. This webinar will explain a variety of modern CSS layout techniques through live demonstrations using Firefox DevTools, and provide real-world use cases of how such techniques allow designs to better adapt across a broad range of viewports.
📺 Smashing TV with Maxim Salnikov, “Progressive Web Applications For Production In 1-2-3 (Part 1)”
Mar 5, 11:00 AM Eastern
In part one of this three-part hands-on coding series, we’ll look at why the idea of Progressive Web Apps has become so popular, which APIs are in the game, and where (browsers/platforms) PWAs work. Feel free to either just watch, or code along too!

We are most grateful for your support which allows us to bring you great content, pay all our contributors fairly, and reduce advertising on the site. (You could become a Member, too and join us in Smashingland where everyone is beautiful and you never get merge conflicts. 😉)

11. Our Next Smashing Workshops

In our workshops, we are looking into the current state of front-end and interface design, covering advanced challenges and actual real-life solutions to front-end problems. Coming up next:

🇮🇱 Tel Aviv, Israel, UX Salon, March 11

🇦🇹 Innsbruck, Austria, ScriptConf, March 29

🇺🇸 San Francisco, USA, SmashingConf, April 15 & 18

🇨🇦 Toronto, Canada, SmashingConf, June 24 & 27

Or, if you’d like to run an in-house workshop at your office, please get in touch with Vitaly at vitaly@smashingconf.com and briefly describe what problems you’re facing and would like to solve. Get in touch — it’s that easy!

12. Bruce’s Joke of The Week

My pet snail, Simon, has been getting very self-conscious lately about the slimy trail he leaves behind him. And, if I’m being honest, I can see where he’s coming from.

February 19, 2019 Smashing Newsletter: Issue #224

Previous Issues