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 docs.new 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, productivity.so 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.

DevToys

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

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

You Might Also Like

🐺 How to create a high impact press page.

Friday, February 14, 2025

͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏

#494: UX and Product Design

Friday, February 14, 2025

Redesigning complex navigation, product design process, UX in legacy systems, UX workshops with users. Issue #494 • Feb 11, 2025 • View in the browser Smashing Newsletter Halò Smashing Friends, How do

Nick Mafi on Capturing LA’s Loss

Friday, February 14, 2025

View in your browser | Update your preferences ADPro 77 Stories Shared As we watched the worst fires in Los Angeles history spread across the city, the editors at AD came together to discuss the

🐺 Content that Converts - the replay is up!

Friday, February 14, 2025

And everyone who joined loved it! ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌

Designer or Couple’s Therapist?

Friday, February 14, 2025

View in your browser | Update your preferences ADPro Let's Make a Deal There's no shortage of spoils in the wonderfully eclectic Hudson Valley home of actor Walton Goggins and writer-director

178 / Visualize your dreams in 2025

Wednesday, January 15, 2025

Product Disrupt Logo Product Disrupt Half-Monthly Jan 2025 • Part 1 View in browser Welcome to Issue 178 Ever get curious about how this newsletter is doing? I shared the 2024 behind-the-scenes and

Mayer Rus on Loss, and Living, in LA

Tuesday, January 14, 2025

View in your browser | Update your preferences ADPro LA, I Love You Los Angeles has been my home for nearly 20 years, and the devastation here, now, is unfathomable. Entire neighborhoods have been

🐺 How to make a great first impression

Tuesday, January 14, 2025

With real examples. ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏

#490: Interface Design

Tuesday, January 14, 2025

How to design better interfaces, how to choose icons, optical effects, iconography, Gestalt principles and icon design. Issue #490 • Jan 14, 2025 • View in the browser Smashing Newsletter Buona

🐺LAST CHANCE to get 20%-off our PR Masterclass Series

Monday, January 13, 2025

Make 2025 your biggest press year yet. ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏