Thursday, January 21, 2016

Using browser extensions to enhance user's browsing experience

What is a browser extension?


A browser extension is a piece of add-on software that is installed inside the browser and extends the browser's functionality. Addition of functionality can vary based on the browser. New functionality can be added at two levels:

  1. To the current webpage: Based on the contents of the webpage currently loaded on the browser screen, an extension adds extra content to it that aids the user in some way and enhances his/her experience on the page. E.g. hyperlink all postal addresses on a page and offer to open them in a map if the user clicks on any of them.
  2. To the browser as a whole: The browser itself exposes extra functionality which can be used on any page. Such functionality creates a new option on the browser's toolbar or menu or shows a new status on the status bar. E.g. one touch social media sharing button.

To explore exactly how extra functionality can be added to the browser, let us look at some real life examples of browser extensions.

Add to Pocket




Pocket is a popular service to store webpages for offline use, so that the user can read it later (in fact the tools was called Read It Later before it was renamed to Pocket). Since it is too tedious for the user to open up the Pocket website everytime s/he finds an interesting webpage, Pocket created a browser extension which creates a conveniently placed button on the toolbar. On clicking the button, the contents of the current page are automatically saved to the Pocket service without the user having to visit the Pocket website.

Read more about Pocket service here.

Buy Hatke




E-commerce is really big in India and the competition is cut-throat. Right now, there are at least 6 major players in the sector, with another 30-40 who are breathing down the necks of the top 6. The websites try to attract attention to each other by offering discounts and cashbacks all the time. As offers fly by and prices are slashed further and further, the user finds it hard to keep track of where s/he can find the best deals. Enter Buy Hatke. When the user searches for an item on site A, Buy Hatke finds out if there are special deals offered by competition. If so, then a small bar pops up at the top of the current page and the user can choose to navigate away to the website which offers the deal. At the time of purchase, Buy Hatke also looks for coupon codes offered by famous services like Groupon, which it tries to apply to the item being purchased and shaves off more from the final payable amount.

Read more about Buy Hatke extension here.


Search by Image



Google have always made web browsing easy with their highly relevant search results and images. However they have taken things a step further with 'search by image' feature. One can query by image. They have an extension that puts a small blue camera when the user hovers over an image on any website. Clicking on the camera takes the user to Google's search by image website and the user can search about what is the image. The example above shows how the user ends up with results for Bhutan when s/he clicked on the monastery image.

Read more about Google Search by Image here.

Why create / use browser extensions?


Over the last 5-6 years, users have begun to use smartphones and tablets to go with their desktops and laptops. They use desktops while at office or at home for involved work, leisurely surfing and in-depth research, for which a large screen offers maximum benefits. They use laptops for work and research on the move. Phones are used for information at a glance, messaging and chatting, context-aware usage based on GPS and sensors and for casual photography and recording. Content creators customise the experience of their offerings to suit different screen sizes and contexts by making rich websites, responsive websites, apps and widgets.

However onc use case has been ignored in the midst of all these multiple-screen experiences. Sometimes, the one thing that the user does NOT want is multiple screens. E.g. it is a big distraction for the user to switch between two tabs of a browser or to look alternatively between the computer screen and the phone screen. Sometimes the user would like everything combined into one integrated workspace instead of switching windows, tabs or devices. This is the pain that browser extensions address. We saw the example of Add to Pocket extension above. The beauty of that extension is that the user can send any webpage to the Pocket cloud instead of having to open the Pocket website and switching between tabs. The value of Buy Hatke is that the extension prompts about better offers without the user having to keep 20 tabs open to check prices in 20 different e-commerce sites, nor does s/he have to open the Groupon app on his/her phone to look for discounts. Google Search by image offers the user to query for images directly from any website without having to leave that website.

Where can I get browser extensions?


Browser extensions are specific to particular browsers and are not compatible with the others. The browser that supports by far the most number of extensions is Firefox, followed by Chrome. Safari and Opera have decent support for extensions, but Internet Explorer has very limited support for extensibility using add-ons. IE does however support the concept of browser 'plugin' which is a topic for a different post. But to give you an idea, installing IE plugins is more like installing software on your desktop with a seperate installer file, rather than an intuitive experience from the browser.




How can I make a browser extension for my service?

You have made a cool online service XYZ. Now you want to make the user's life awesome. How can you go about building extensions for your service?

Each browser requires its own process for browser development. At the end of the day, the browser extension is built and submitted to the corresponding Web store / Add-ons store. However extensions can also be hosted on one's own website.


  • To build extensions for Chrome, the tutorial is here.
  • You can learn about starting to build a Firefox extension here.
  • Safari Extensions Development Guide is your definitive guide to enhance your service's experience on Safari.
  • This page has all the info that you need on making add-ons for Opera.

Conclusion



While a typical Internet savvy user spends most of his/her time on the smart phone and apps today, that time is not 100%. Some part of the day is spent actually sitting in front of a PC / Mac / laptop to get work and research done and switching between tabs and screens is definitely a pain. So, while not as hot in the market as mobile apps, browser extensions do have a massive fan following and the number of extension installs everyday does speak volumes about their utility.

We have all been solving problems for the user on the go using mobile technology. However, if you find that the next problem that you want to solve should target the sit-at-desk user using a browser, consider building a browser extension. He/she will be grateful to you for it. Probably you should make a 'thank you' button on the toolbar to go with your extension, to compose and send a 'thank you' email to your email address automatically.

No comments:

Post a Comment