arrowAll projects
Shortcuts.design
Feb. 2017 - now

Centralizing shortcuts for designers

A couple of years ago, I looked for ways to speed up my workflow and help the students I was teaching at the time to speed up theirs. I learned how to code to be able to ship the first version of Shortcuts.design in 2017 and slowly it grew out into a resource helping out thousands of designers each month.

Centralizing shortcuts for designers header image

Using Google Sheets to create and test a MVP

Let's go back to 2017: While observing how other people were working in professional programs, I learned that shortcuts were often hard to remember and people often found it too much hassle to find a good resource for every single application they were using. This is, even more, the case for young designers who are just learning their design programs, especially back in 2017 when a lot of the students I was teaching had to switch from Adobe to Sketch.

I copied a few lists with shortcuts of the internet and pasted them in a Google Sheet, old-school Pieter Levels style, and wrote a PHP script with a redirect from a URL to the Google Sheet. Of course, I noticed that a Google Sheet wasn’t easy to share or use to search and navigate, but handing it out to my students showed me that it solved a problem they were having.

Shortcuts.design Google Sheets version

Designing, learning to code, and testing the site

To create a good resource that was clear, intuitive to use and search through, I sketched and designed many versions of what I later on launched as Shortcuts.design. As I wasn't much of a coder back in 2017, I learned to code simple HTML and CSS. After a while, I got a basic version with three tools up and running.

Watching my idea come to life felt like magic at the time! I tested the website many times with friends and random designers I found on Twitter to tackle as many usability issues as possible. Totally unexpected: everyone was enthusiastic about the idea and my way of executing it.

Shortcuts.design website V1

A viral launch

On November 6th, 2017, I deployed Shortcuts.design. Hoping to get at least 500 people on my website in the first month, I submitted it on Producthunt and wrote a few lines about it on DesignerNews and in some Facebook groups for designers.

After Ryan Hoover (CEO of Producthunt) shared it, hundreds of people started dropping by. Within a week, things went bananas, the website had gotten about 40k unique visitors, became product of the day on Producthunt, and was featured by large websites or companies like Creativebloq, Sidebar, InVision, CSS-Tricks, Prototypr, Sprint UX Podcast and UpLabs, to name a few.

Although the reach was mostly based on luck, and I just build the resource because I liked creating, it inspired young design students all over the world. To help them out and share my process to give others confidence (because I believe everybody could've done this), I wrote an article explaining every little detail to fellow design students. As I later heard, it inspired others to start creating out in the open for themselves (although the article was a little pretentious in hindsight, but oh well, I was young...)

Shortcuts.design launch

Improving the product based on user feedback and making it an even more useful resource

By gathering data using Hotjar and Google Analytics and talking with people who used the website, I learned how people used it and how it could be made better. Over the years I worked on a set of updates:

  • Added support for Windows shortcuts of every tool next to the shortcuts for macOS, and showed the right list based on the users’ OS
  • Built a search so users could more easily find what they’re looking for
  • Redesigned the complete platform to be more intuitive, help people find what they’re looking for and keep them in their flow
  • Designed and built dark-mode
  • Open-sourced the codebase so others could collaborate
  • Build a table of contents for the tools which made it even easier to search through long lists of shortcuts
  • ...and added a lot of tools

Check out the current version on Shortcuts.design.

Shortcuts.design search feature
Shortcuts.design table of contents feature

Building the ability to sponsor the product to keep the development going

In July 2021, I built and launched a first version of Shortcuts.design Sponsorships, a feature for companies to sponsor the website and get featured. Initially I didn’t think a lot of companies would be interested in it, so I set the goal of earning $1. Fast forward to 2023, and the website got sponsored by Framer, Around, VEED.io, Commandbar, Uxcel, Iconfinder, Proto.io, Cleanshot X, Sip and many more.

Want to learn more about the sponsorships? Check out Shortcuts.design/sponsor.

What’s coming next?

What started in 2017 as a small idea, has now become a much-used resource among designers with ±13.000 creatives visiting the website per month. It learned how to design and code my own ideas, how to actually ship products, do a proper launch, iterate based on user feedback, Hotjar and GA4, and how to earn some money online. It has been a truly interesting ride, and I’m curious what the future will bring for the product.

Some of the ideas I’m cooking up:
  • Improving the search functionality and make it possible to find shortcuts without actually knowing the specific name of the feature
  • Building shortcuts support for the website, like for example ⌘K for opening a global command palette
  • Making it easier to find a specific tool from the growing list of tools
  • Favorite tools for quick access of often-used tools
  • Lowering the barrier for adding new tools, updating existing tools and fixing mistakes in the data, as an open source repository on GitHub is often too much hassle for most designers
  • Making toolspages printable, as people in developing countries and teachers love to export them to PDF or hand-out prints

Project info