The new year is always a great time to think about ways to help work more efficiently. My handy arsenal of Chrome extensions has helped me increase my own efficiency and productivity, so I’d like to share them with you! Also, I’d love to hear about your favorite extensions in the comments.
1. Grammarly (Free)
Grammarly is a great extension that automatically spell-checks content as you type. I’ve pre-emptively fixed many a typo in my project Basecamp posts due to Grammarly. (The service boasts that they fix an average of 16 user mistakes per day!)
2. Project Naptha (Free)
This extension is awesome. It lets you select text from inside an image. While I don’t use this daily, it’s come in incredibly handy when I need to complete a task like copying text that appears within a design comp. Every now and then, it’ll mess up the characters slightly and I’ll need to make a couple edits, but it’s still a huge time-saver when I don’t have copy easily available in text format.
3. Full Page Screen Capture (Free)
This extension captures a screenshot of an entire web page—that’s it. I love this because my regular screenshot tool, Monosnap, doesn’t offer this functionality. If you prefer a more robust Chrome extension that can capture selections and other types of screenshots, try Awesome Screenshot Minus.
4. Browser Width (Free)
This is a handy little extension that will tell you the current pixel width of your browser window, as well as allow you to set a new width. This is particularly helpful for QA on responsive sites
5. Google Docs Offline (Free)
We use GSuite at Viget for documents and file storage (and email, and shared calendars). Having access to your documents from any device is great…but you never know when you’ll be on-site in a client meeting and find out there’s no wi-fi access. Google Docs Offline has helped me stay productive by being able to access and edit my documents even without an internet connection. (Get full Google Docs offline access setup instructions here).
6. BrowserStack (Paid Service)
I use this extension several times a week. At Viget, we find BrowserStack invaluable for browser and device testing/QA on projects. Many of BrowserStack’s testable devices are physical, not emulators, which I love because I don’t have to worry about discrepancies that can occasionally be caused by VM variability. Browserstack is a paid service (that offers a free trial), and the extension is a handy way to easily test the site I’m on without having to open a new tab and navigate to BrowserStack’s site.
7. PageRuler (Free)
This utilitarian extension performs a simple, but very helpful, task—it lets you drag your mouse to form a selection and measures the width and height of your selection. This comes in handy when you’re trying to specify, for example, the number of pixels of padding to add on either side of a design element on a page.
8. Screencastify (Free + Paid Options)
Screencastify is great for recording (and annotating!) screencasts directly from your browser, with the added excellent feature of automatically saving the screencasts to Google Drive or YouTube. This comes in handy for everything from documenting an interaction bug that comes up during QA on a project, to filming a quick how-to video for a new feature in a client’s CMS.
9. 1Password (Paid Service)
We use 1Password for group password management at Viget. While 1Password is a paid service, it’s well worth it to keep your passwords secure and managed in one place. The browser extension easily lets me search for and auto-fill login credentials for sites I frequent.
10. WAVE Evaluation Tool (Free)
We use this extension at Viget to help with accessibility QA. It allows you to test visual contrast and code structure, among other things. Read more about how to conduct accessibility QA and use this tool here and here!
11. Evernote Web Clipper (Free + Paid Options)
I use Evernote for all my personal notes. The Evernote Web Clipper extension can be a handy way to easy select and save content on the web for future reference.
12. Momentum (Free + Paid Options)
Momentum is an extension that creates a simple, beautiful, and customizable experience when you open a new tab. You can set a background (a gorgeous daily photo or custom background image of your choice) and add widgets such as handy links, a search bar, weather, a daily focus, a simple to-do list, and/or a daily inspiring quote
13. Zenhub for GitHub (Free + Paid Options)
Zenhub is an excellent extension that adds a kanban-style board interface to GitHub Issues, which is the the ticket-tracking system we use at Viget on projects. While the free version of Zenhub does limit the max number of users to five, the paid option is well-worth it for larger teams. You can also opt for the similar service, Waffle.io (not a Chrome extension), which is a similar GitHub Issues “skin” that is free for any number of users.
BONUS ROUND: Chrome Developer Tools Color Picker
Having the ability to easily click to select and determine the hex value of any color appearing on a site is super handy. While I used to use ColorZilla as an extension offering a color picker, I recently uninstalled it after discovering that Chrome Developer Tools offers the same functionality without needing an extension! To use, open Developer Tools (command+option+i), select the a color’s square icon for any element’s style that appears on the page, and a dropper UI will appear. You can then select any color on the page and it will tell you the hex values
These 13 Chrome extensions have helped me become more efficient and productive in my own work, and I hope you find them useful! What are your favorite Chrome extensions?