Smashing Magazine - #340: Productivity Helpers

With little helpers for getting work done faster in browsers, Figma and other tools that you use daily. Issue #340 February 15, 2022 View in the browser 💨

Smashing Newsletter

Bună dimineaţa Smashing Friends,

There are so many little things that slow us down in our daily routine. For a long time, I didn’t know that on iOS, when you need to edit a typo, you can hit the Space bar and move the cursor horizontally to find just the right character to fix. And you can tap Space twice to type a period (.).

By hitting Space and moving the cursor horizontally, you can jump straight to the character you need.
Image source: Adam Engst.

In my calendar, every first Friday has a little to-do task marked with “Learn a shortcut today”. On that day, I pick any tool of choice in which I want to get better, then I head into its settings or search for “advanced” video tutorials online.

I pick one keyboard shortcut or one little thing that I find annoying, find a shortcut and write it down on a sticky note. That sticky note then lands on the screen, and I try to memorize it that week. It might seem like a little thing, but once you’ve been doing this for a couple of years, the productivity boost turns out to be quite enormous.

This newsletter issue is dedicated to some of those minor shortcuts. Little helpers that hopefully will help you get faster at your work.

Learn a new shortcut daily

Of course, if you are looking for slightly more sophisticated helpers, we have our online workshops on front-end & UX waiting for you — on accessibility, design systems,HTML email, DevOps and Complex UIs. We’d love to see you there — and perhaps learn a few useful helpers live! ;-)

Vitaly (@smashingmag)

1. Automations To Supercharge Figma

Do you spend a lot of time in Figma? Then Automator for Figma could be worth taking a closer look. The plugin lets you create custom drag-and-drop automations that do time-sensitive Figma tasks for you in just one click — whether it’s including placeholders in a UI design, adding design specs, or generating a style guide from local styles.

Automator for Figma

To build the automations, there is no coding required. Instead, you can choose from over 100 actions that expose the power of the Figma Plugin API at your fingertips. Alternatively, you can also browse through the Automator Community to explore automations that others have built. If you want to give Automator a try, there’s a free trial version available. A real timesaver. (cm)

2. Quick Access To File Menus

How often do you find yourself lost between menus and features of your text editing applications? For VS Code and DevTools, we’ve learned to love Cmd/Ctrl + Shift + P, a keyboard shortcut that prompts a command palette with a smart autocomplete and search. If you are editing text in Google Docs or Dropbox Paper, and find yourself lost within all the features and settings, there is a shortcut to save you plenty of hassle as well.

Quick Access To File Menus

For Google Docs or Sheets, Option/Alt + / brings up search where you can start typing features, fonts or any other fine controls. And in Dropbox Paper, the shortcut / opens a search area to look for your documents. In general, take a look at all the keyboard shortcuts for your favorite tool of choice — chances are high that a handy keyboard shortcut is waiting for you there as well! Just a little helper that might speed up your daily routine quite a bit! (vf)

3. App Productivity Hacks

Did you know that you can create a new Google Doc by typing into your browser’s URL bar? Or that you can open the last closed tab in Chrome with Cmd + Shift + T? And have you ever heard of the little trick that you can swipe left in iPhone’s calculator to remove digits? If you’re up for some more productivity hacks like these, has got you covered.

Productivity tips

Curated by Lukas Klinser and Dennis Müller, the library collects productivity hacks that help you uncover the hidden 1% in your favorite tools. Each tip comes with a short explanation, sometimes even with a video, of how it works and which apps on which platforms support it. Productivity superpowers for every day. (cm)

4. Upcoming Front-End & UX Workshops

You might have heard it: we run online workshops around frontend and design, be it accessibility, performance, navigation, or landing pages. 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
Frontend and design can sometimes feel like you’re riding some pretty wild waves! We’ve got your back with personal and inclusive events.

As always, here’s an overview of our upcoming workshops:

5. Tab Focus Shortcut

Sometimes it’s the little tricks that turn out to be the most precious. Something that saves only a few seconds of your time but that makes you wonder how you could have gotten along without knowing about it.

Tab keyboard shortcut

Here’s one of these little productivity gold nuggets: When you browse the web, do you prefer to open links in a new tab? If so, you might already have heard of the keyboard shortcut Cmd/Ctrl + Click to open a new tab. However, you still need to navigate to the tab. That’s where the good old Shift key comes in: Just hit Cmd/Ctrl + Shift + Click, and the browser automatically puts focus on the new tab! Thanks to Stefan Judis for sharing! (cm)

6. MacOS’ Screen Capture Tips

If you’re on a Mac and are frequently taking screenshots, Corey Ginnivan has 14 useful tips for you that take your screen capturing workflow to the next level. After all, the MacOS screen capture feature is much more powerful than you might have thought.

MacOS screenshot tips and tricks

Corey posted 14 tweets, each with a shortcut, tip, or trick. He starts off with the classic of capturing the entire screen and moves on to some more advanced features. Did you know, for example, that Cmd + Ctrl + Shift + 4 captures a selection to your clipboard so that you can paste the image right where you need it, to a design tool, for example? Or that you can remove that annoying floating thumbnail that appears on your screen every time you’ve taken a screenshot? To do so, just hit Cmd + Shift + 5 and deselect “Show Floating Thumbnail” in “Options”. Gold! (cm)

From our sponsor

Build In-Demand Skills In Northwestern’s Online MS In Information Design And Strategy

Work at the Intersection of Data, Design and Technology. Earn your master’s degree online at Northwestern Information Design and Strategy.
Earn your master’s degree online.

7. Tools To Enhance Your Workflow

Often it’s the little tools and helpers that become indispensable in our workflows, whether it’s color contrast checkers, file converters, text comparers, image optimizers, or hash generators. If you are looking to enhance your web dev toolkit, Tiny Helpers is bound to have the tool you need. The site collects free single-purpose online tools that help you with anything from accessibility to APIs, performance, regular expressions, and security.


If you’re a Windows user, DevToys is a swiss army knife of 21+ tools to master your daily tasks. The app works offline and includes a Json to Yaml and Yaml to Json converter, a hash generator, JWT decoder, Regex tester, URL encoder, and much more. And to give your workflow an extra productivity boost, DevToys automatically detects the best tool that fits your clipboard content. Nice! (cm)

8. New Tab, New Artwork

Why not spice up one of the most mundane actions that we perform countless times each day and make it a bit, well, more exciting, inspiring even? We’re talking about opening new browser tabs. If you’re tired of seeing the same plain background every time you open a new tab, the Google Arts & Cultures extension for Chrome might be for you.

Arts and Culture Extension

Each time you open a new tab, the extension presents you a beautiful, new artwork. The artworks range from Van Gogh and Monet, all the way to contemporary works from street artists around the world. If one of the masterpieces sparks your curiosity, you can click the image description to discover more. A great way to breathe a little culture into your day. (cm)

9. New On Smashing Job Board

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

Follow us on Twitter Join us on Facebook

unsubscribe update preferences view in your browser

Older messages

#339: Modern CSS Techniques

Tuesday, February 8, 2022

With modern CSS, techniques for better CSS shadows, SVG icons, CSS Reset and even CSS pseudo commas. Issue #339 • February 8, 2022 • View in the browser 💨 Smashing Newsletter Dear Smashing Friends,

#338: UX & Front-End Tools

Tuesday, February 1, 2022

Little tools for card sorting, tree testing, gathering feedback, testing with screen readers and monitoring Core Web Vitals. Issue #338 • February 1, 2022 • View in the browser 💨 Smashing Newsletter

#337: Design Inspiration

Tuesday, January 25, 2022

With miniature illustrations, Japanese Fireworks, CSS art, generative art and a free Mac screensaver. Issue #337 • January 25, 2022 • View in the browser 💨 Smashing Newsletter Hyvää päivää Smashing

#336: Front-End Accessibility

Tuesday, January 18, 2022

With tips and advice from the community on improving accessibility by creating accessible and inclusive content and debunking accessibility myths together. Issue #336 • January 18, 2022 • View in the

#335: New CSS Adventures

Tuesday, January 11, 2022

With hand-picked CSS guides, inspiring talks, cross-browser tools and the latest CSS practices to dive into in 2022. Issue #335 • January 11, 2022 • View in the browser 💨 Smashing Newsletter Dear

Can Cat-Friendly Design Be Chic?

Tuesday, May 17, 2022

Plus, dive into 20 of the most inviting pools from the AD archive (image) Architectural Digest AD PRO Logo Guest room at the Casa Cody in Palm Springs, California HOW TO LAND—AND SURVIVE—YOUR FIRST

Your PR questions answered

Tuesday, May 17, 2022

Advice from Nora Wolf Welcome to the first edition of PR Questions with Nora. This new monthly newsletter feature was inspired by you! If you've attended one of our recent PR workshops, you likely

#353: Dashboards and Data Visualization

Tuesday, May 17, 2022

Dashboard design, better charts and how to make better decisions around data visualization. Issue #353 • May 17, 2022 • View in the browser 💨 Smashing Newsletter Dear Smashing Friends, I had a dream

Roboto Flex

Tuesday, May 17, 2022

Hi Reader, these are my design and frontend picks this week. Highlights of the week Get the most of built-in interactivity of coded UI components - Design with fully interactive elements that make

Nice, Balanced Colors, Failed Projects, One Million People, CSS Selectors

Tuesday, May 17, 2022

The 5 best design links, every day. Curated by a selection of great editors. Email not displaying properly? View browser version. Sidebar May 17 2022 The Brand Identity Balancing

11 Black Paint Shades Interior Designers Use on Repeat

Monday, May 16, 2022

Plus, tour a 19th-century manse turned wine country hotel (image) Architectural Digest AD PRO Logo Nickey Kehoe. 50 OF THE BEST HOME DECOR STORES IN AMERICA These expertly curated design boutiques need

👀 Notable Landing Page Designs + 🏆 Challenge Updates

Monday, May 16, 2022

The UpLabs Designer Digest Is Dropping Into Your Inbox 📩 To begin, we'd like to congratulate Arjun Makwana, the winner of our latest 📍Device Locator App Challenge! Next, here's a friendly

A Fidi Loft With Room for Pokémon: Before and After Photos

Monday, May 16, 2022

Design editor Wendy Goodman takes you inside the city's most exciting homes and design studios. Design Hunting A visual diary by Design Editor Wendy Goodman The kitchen, after. Photo: Kevin

Accessibility Weekly #292: Why WCAG 2.2 is Still in the Oven

Monday, May 16, 2022

Sponsored by Automattic. They're hiring. May 16, 2022 • Issue #292 View this issue online or browse the full issue archive. Featured: Why WCAG 2.2 is still in the oven “We're currently looking

Beer Trends, Blind VR, Bootstrap 5.2.0, App Icon Book, COLRv1

Monday, May 16, 2022

The 5 best design links, every day. Curated by a selection of great editors. Email not displaying properly? View browser version. Sidebar May 16 2022 2022 Craft Beer Branding and Package Design Trends