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.
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.
— Vitaly (@smashingmag)
Table of Contents
- 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
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)
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)
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.
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)
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)
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)
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)
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)
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)
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. 😉)
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 email@example.com and briefly describe what problems you’re facing and would like to solve. Get in touch — it’s that easy!
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.
Every second Tuesday, we send a newsletter with useful techniques on front-end and UX. Subscribe and get Smart Interface Design Checklists PDF in your inbox.
You can always unsubscribe with just one click.
- Custom Dropdowns, CSS, Performance and Building Tools
- Hybrid CSS Positioning, Free Fonts, Push Notifications
- Black Illustrations, CSS, Data Science and Licenses
- SmashingConf Live, Speed Profiler, CSS and SVG
- Custom CSS Cascades, Focus Blocks and CORS
- React, Accessible Components, Terminal, Video Player
- BEM, DOM Scripting, SVG Masks, Vintage Games, Posters
- Design Checklists, Passwords, Dropdowns and Tooltips
- Accessible Inputs, Console, Free Illustrations, SVG
Looking for older issues? Drop us an email and we’ll happily share them with you. Would be quite a hassle searching and clicking through them here anyway.