Save 5–10 min a day with this web extension

Do you use keyboard shortcuts? If yes — this article is for you

Dmitry Mind
4 min readAug 20, 2019

I love shortcut keys because they save me time. Pressing ‘Cmd+Z’ is much faster than clicking ‘Edit — Undo’. Do you agree with me?

Pressing Ctrl/Cmd+ Z
0.05s

Clicking “Edit — Undo”
4.15s

I understand that shortcuts aren’t for everybody. Some people work with wacoms, some don’t use shortcuts by ideological principles, some people have a physical limitation. But if you are shortcut user, so welcome :)

There is no doubt shortcuts are much faster and effective than a mouse clicks. Also, they improve fine motor skills, and that can prevent Dementia, Depression, and Alzheimer at older age according to the Society of Physical Therapy Science.

As well, many times I use Alt + Tab (for Windows) or Cmd + Tab (for Mac) shortcut combination to access open programs.

Much faster than moving the mouse to the bottom of the screen, especially if the bottom bar auto hides each time

But what about the browser with all these tabs? There is Ctrl/Cmd + Tab combination, but it just switches to the next tab. And usually, I have more than 10 tabs open, not very handy at all…

So… I created an extension called Quick ‘A’ that brings an operating system user experience to the browser by clicking Ctrl/Cmd + Shift + A.

Tech part:
When ‘Quick A’ is called background scripts sends all the open tabs data to the content script, then it appends shadow dom element to the body. Made with VueJS ❤

Why users should use ‘Quick A’ instead of native browser tabs navigation?

Short answer: Because it’s faster.

I made a few screen records with switching tab activities than I opened it in After Effects and compared time that takes me to switch tabs with classic tabs navigation and Quick ‘A’ extension.

Native tabs switch avg time:
5.30 Seconds

Quick ‘A’ tab switch avg time
2 Seconds (165% faster)

I understand that this is very individual, there are more many more factors that affect tab switching speed. The more tabs open the more time it takes to switch em, when the user is tired, he/she switch tabs slower.

I could do more research with more exact numbers, like create an extension that will record tab switching time... But, I just developed and designed Quick ‘A’ extension with a minimum valuable functionality just in one week. And now it’s time to harvest feedbacks.

What makes Quick ‘A’ interface faster than native tabs?

Short answer: Positioning and sizing

Look at native tabs navigation:

Let’s say the user wants to open StackOverflow tab

Click target size:
Width: 62px
Height: 31px

Distance to the target:
~1020px

Also keep in mind, that there are 2 StackOverflow tabs and the 3 first symbols are displayed, so maybe the user will open the wrong one and then he/she should open the second one again. How many seconds that will that take?

Visual part was borrowed from Mac OS app switcher, just abandoned blurry background for the better performance.

Now compare it with Quick ‘A’ navigation:

Click target size (113% bigger):
Width: 64px
Height: 64px

Distance to the target (68% shorter):
~605px

Quick ‘A’ tab navigation is better than native because of 113% bigger click area size, much easier to click and because it’s located in the screen center, mouse path is ~65% shorter. Also, page titles are fully visible.

There are also a few cons:
1. It doesn’t work on tabs that start with chrome://, chrome store and new tab because of security reasons. But most of the time users don’t use these tabs

2. Sometimes with a slow internet connection or when the site is somehow broken, Quick ‘A’ won’t load. I will try to solve this problem later.

3. To open a new tab or type new URL, there is still a need to navigate to the old tabs, it’s a little bit confusing user experience. In the upcoming version, I will add the “New Tab” icon

Why should the user learn a new shortcut just to save 2 seconds?

Each interface has its own shortcuts, humans brain has limits. Why the users should change their behavior for such an insignificant difference?

Let’s do a little math. How many times a user who works on a computer switch browser tabs per day? Honestly, I didn’t count (theoretically I can write an extension and get real numbers), but let’s say that 200 times is a fair number.

Avg tab switching time is 5 seconds
200 clicks x5 seconds=1000 seconds for a day.
1000 seconds x 22 working days =22000 seconds.
22000 seconds / 60 sec in min = 366 minutes
366 minutes x 12 moth = 4392 minutes
4392 minutes /60 = 73 hours
73 hours / 24 hours in a day = 3.04 days

3 days per year a user spends switching browser tabs. With Quick ‘A’ this number can be decreased to 1.5 Days!

I know these numbers are veeeeery approximately, if I had access to the big data, I could do a more precise count.

Thank you for reading, Quick ‘A’ just started its existence, and your feedback is very important. You are welcome to try it.

Thank you :)

Link:
https://chrome.google.com/webstore/detail/quick-a/gilkjbonaifnnghbdpjmbomjjfffabmn

--

--

Dmitry Mind

Product Designer, Frontend developer and Dreamer 🌟