How to create a browser extension that leverages IBM Watson cognitive API

Use Watson APIs without purchasing the product

You want to use IBM Watson API cognitive solutions, but they’re too often integrated with products that you don’t need. Browser extensions extend your browsers’ capabilities and provide better online experiences for users. In this tutorial, we show you how to create a browser extension that uses Watson APIs via a browser extension, so that you can use the popular API.

Learning objectives

In this tutorial, developers will create a browser extension that uses IBM Watson cognitive API. This browser allows users to consume Language Translation & Tone Analyzer services on their e-mail, calendar, and any other web portals.

Prerequisites

Before beginning this tutorial, you’ll need:

An IBM Cloud account: If you do not have an IBM Cloud account, you can create one.

Estimated time

Steps

Step 1: Create Watson services on IBM Cloud

Create a Language Translator service. Once the service is created, you are directed to the service page where you can see the service credentials. Click on Show Credentials, and you see a username and password for the newly created service.

Take note of the credentials appearing here, we’ll need them in the next step.

You need a logo for your extension. You can use your own or download this one. The image name needs to match the value of the icons key in the file above. In this case, it is ibmwatson.png. Save this in the root directory of the workspace.

After loading the directory, you should see that the extension is set to enabled. In the figure below, the name of the extension is IBM Watson Chrome Extension.

After following the steps above, right click on your Chrome browser, you should then see a menu to interact with IBM Watson API services. Let’s try it out.

Highlight a portion of text and right click to see IBM Watson in the context menu.

Select a language to see the translated output.

Check the tone of the words using the same steps.

Summary

In this tutorial, you’ve successfully created a Chrome browser extension that used Watson API to anaylze tone and translate language.

FAQ

How does this browser extension help on a globally dispersed team with members who speak different languages?

Well, we can’t expect everyone to speak or understand every language. Certain forms of jargon, slang, or colloquialisms are hard to translate and can lead to misunderstandings. Browser extensions are easy to use, and anyone can use them in their work on any platform.

What are the benefits of checking the tone of an email?

When writing text, we sometimes ask ourselves how the recipient will interpret the message we’re trying to convey. By using the browser extension you just successfully created, you now have access to a tone analyzer service that can help with analyzing your messages and can also provide suggestions to re-write messages to align to the sentiment of your choice.

A special thank you to the following people for their contributions and mentoring on this project: