VoiceXML Developer Series: A Tour Through VoiceXML, Part II
Welcome back. I hope you enjoyed the last article, which was the first part of a tour through the entire VoiceXML 1.0 language. In Part II, we're going to focus on building VoiceXML applications with menus that allow callers to make selections via DTMF tones and voice commands. The results of this article can be accessed live by calling 510-315-6666.
Create voice menus with the <menu> element
Similar to HTML menu options, VoiceXML menus provide users with lists of information that are selected with DTMF or voice commands. The example below introduces a VoiceXML document than contains a menu with three options preceded by a prompt.
<vxml version="1.0"> <menu> <prompt>What is your favorite color? For red, press 1. For blue, press 2. For yellow, press 3</prompt> <choice dtmf="1" next="red.vxml" /> <choice dtmf="2" next="#blue" /> <choice dtmf="3" next="yellow.vxml#yel" /> </menu> </vxml>
When executed, the example above will play the prompt and wait for the user to press a number on their keypad. Menus contain a list of choices. In this menu, the choices are red, blue, and yellow. The colors are selected by pressing the corresponding number on the phone keypad (1, 2, or 3). When the DTMF tone that matches the dtmf attribute is recognized, it will send the user to the VoiceXML document contained in the next attribute of the choice element. Alternatively, you can have the menu automatically assign DTMF tones to the menu choices by setting the dtmf attribute of the <menu> element to true:
<vxml version="1.0"> <menu dtmf="true"> <prompt>What is your favorite color? For red, press 1. For blue, press 2. For yellow, press 3</prompt> <choice next="red.vxml" /> <choice next="#blue" /> <choice next="yellow.vxml#yel" /> </menu> </vxml>
Now let's look at the next attribute of the choice element. The first next attribute points to another VoiceXML document named red.vxml. So when we press 9, the VoiceXML interpreter loads that document and executes it. The linking mechanism that makes this work is quite like HTML links. In fact, the #blue value of the next attribute inside the second <choice> element points to an internal link in the same document. The # notation for in-document references is the same as in HTML. In fact, the third <choice> points to a reference inside a VoiceXML document called yellow.vxml.
Recognizing voice commands in menus
We've learned how to browse menus with DTMF tones, but VoiceXML also enables us to create grammars for each menu choice, which will recognize speech instead of or in addition to DTMF. This is done by including a simple grammars (compared to form grammars) inside the the <choice> element.
<vxml version="1.0"> <menu dtmf="true"> <prompt>What is your favorite color?</prompt> <enumerate /> <choice next="red.vxml">red</choice> <choice next="#blue.vxml">blue</choice> <choice next="yellow.vxml#yel">yellow</choice> </menu> </vxml>