Add Voice Search with a Few Lines of Code (for free)

Just want to develop? Click here

Voice search means for most optimizing your website to support natural language queries. This is important, because many are searching on Google by using voice instead of typing and typically these queries are somewhat different.

For instance, searching for the population of US by typing the keywords might result in a query such as "us population" whereas searching for the same thing by voice might be natural by asking "what is the population of the United States?". In fact, already 20% of Google App searches are done by using voice.

However, when the user eventually lands to a page they were looking for by using their voice, they are back to the "old-school" way of operating websites. Instead of voice, they'll have to resort to typing, clicking and scrolling.

While most of us are very familiar with those UI patterns, they are nowhere near perfect. A typical eCommerce search with a few category filters (such as blue Nike t-shirts in size large for men) takes easily around half a minute or more, even for a somewhat experienced user.

This is because the order, names, and even the existence of these filters vary widely in eCommerce stores. Some stores don't offer color filters, some categorize t-shirts under shirts and some have a separate category for them and so on. Sometimes the filters are on the sidebar, sometimes on top and sometimes they require opening a hamburger menu.

What if this tedious filtering could be replaced with voice? Let's see an example.

Voice is a very natural way for creating search experiences. While a text-based menu can't include all the synonyms because of lack of screen real estate, voice UI can support as many synonyms and different ways to express things as required. As the filters are updated in real time as the user keeps on speaking, the user gets visual feedback and is encouraged to go on with filtering. On the other hand, if they misspeak or if the system recognizes something wrong, they can naturally correct themselves.

We have created a fully streaming voice UI API that enables building this kind of experiences very easily. Instead of the traditional "voice assistant" style that resembles Microsoft's Clippy, our solution is based on directly manipulating the graphical user interface with voice.

As most of the eCommerce stores have already implemented some kind of a category filtering, adding Speechly enables their users to replace searching and selecting for the correct filters by simply saying out loud their preferences. The user interface stays the same and doesn't require any other updates than adding the microphone button. We even provide a customizable microphone button for easy integration.

We have productized voice search as a very simple solution that enables developers to add voice search to their website in a few lines of code. We have also created a demo to showcase a real-life application using this pattern. You can try out the demo here.

Instructions for integrating voice search to your website can be found here. There's also a simple Codepen example that you can edit yourself and see the full code for a simple implementation.

You can use Speechly for free for up to 20 hours a month.
If you need any help creating your models or integrating it, you can contact our support at [e-mail].

Would be great to hear your thoughts!