Mobility Outlook: HTML and native mobile

Transcript

1. Industry Insight Mobility Outlook Focus on HTML and native mobile Andreas Volmer Sr. Product Manager Voxeo RJ Auburn CTO Voxeo
2. Agenda ©  Voxeo  2010   •  Multi-channel service delivery with VoiceObjects today •  Embracing HTML5 •  Native apps
3. HTML 5 ©  Voxeo  2010  
4. Unified Self-Service Design Once, Deploy Anywhere © Voxeo 2010 Mobile  Apps   Tex2ng   Voice  and  Video   Mobile  Web   Multi-Channel Application
5. UI Design for the Mobile Web © Voxeo 2010 •  IVR Dialog Flow Sequential, simple structure Clear, restricted content  
6. ... Please make your choice: Service plan manager, customer data, billing, or support. Design Once, Deploy Anywhere
7. VoiceObjects Server Core VXML  Driver   Applica2on   Defini2on   VXML  Browser   IVR   [MessagingProxy]   Messaging  Proxy   SMS  GW  Adapter   SMS  GW   HTTP  API   SMS  Gateway   HTTP  GET   HTTP  GET   VXML  /HTTP   Web  Driver   HTML  Browser   Handset   HTML  /HTTP   VoiceObjects  Server   Media   PlaOorm     Drivers   Multi-Channel Architecture © Voxeo 2010 Rendering   Templates  
8. Rendering Templates ... <img class="voTopLogo" id="@OBJTYPE@_@OBJNAME@" src="@TOP_LOGO_URL@" tphmin="0" tphmax="1" tphlink="TOP_LOGO_URL"/> <div class="voOutput" id="@OBJTYPE@_@OBJNAME@"> @PROMPT@ </div> <form action="@RETURNURL@?dialogID=@DIALOGID@” method="@METHOD@“> <replicator tphlink="SLOTNAME" >@SLOTLABEL@ ... ... <img class="voTopLogo" id="@OBJTYPE@_@OBJNAME@" src="@TOP_LOGO_URL@" tphmin="0" tphmax="1" tphlink="TOP_LOGO_URL"/> <div class="voOutput" id="@OBJTYPE@_@OBJNAME@"> @PROMPT@ </div> <form action="@RETURNURL@?dialogID=@DIALOGID@” method="@METHOD@“> <replicator tphlink="SLOTNAME" >@SLOTLABEL@ ... ... <img class="voTopLogo" id="@OBJTYPE@_@OBJNAME@" src="@TOP_LOGO_URL@" tphmin="0" tphmax="1" tphlink="TOP_LOGO_URL"/> <div class="voOutput" id="@OBJTYPE@_@OBJNAME@"> @PROMPT@ </div> <form action="@RETURNURL@?dialogID=@DIALOGID@” method="@METHOD@“> <replicator tphlink="SLOTNAME" >@SLOTLABEL@ ... ... <img class="voTopLogo" id="@OBJTYPE@_@OBJNAME@" src="@TOP_LOGO_URL@" tphmin="0" tphmax="1" tphlink="TOP_LOGO_URL"/> <div class="voOutput" id="@OBJTYPE@_@OBJNAME@"> @PROMPT@ </div> <form action="@RETURNURL@?dialogID=@DIALOGID@” method="@METHOD@“> <replicator tphlink="SLOTNAME" >@SLOTLABEL@ ... ... <img class="voTopLogo" id="@OBJTYPE@_@OBJNAME@" src="@TOP_LOGO_URL@" tphmin="0" tphmax="1" tphlink="TOP_LOGO_URL"/> <div class="voOutput" id="@OBJTYPE@_@OBJNAME@"> @PROMPT@ </div> <form action="@RETURNURL@?dialogID=@DIALOGID@” method="@METHOD@“> <replicator tphlink="SLOTNAME" >@SLOTLABEL@ ... ©  Voxeo  2010   •  Markup rendering is based on Rendering Templates –  Standard templates for standard browser, iPhone etc. –  Optional Customization •  Service level •  Page level
9. How it works: Menus ©  Voxeo  2010   Different  Cascading   Style  Sheets  (CSS)  
10. How it works: Simple Forms ©  Voxeo  2010  
11. How it works: Multi-field forms ©  Voxeo  2010   4  Slots:  
12. Select Appropriate Keypad ©  Voxeo  2010  
13. How it works: Collapsible Content
14. Handling Text Resources •  Text Object •  References external text files defining key/value pairs •  Text files •  can be exchanged without service redeployment •  are cached by VO Server •  Supports multiple languages •  Manage default texts in case text file is missing •  Per language, Layer, Channel © Voxeo 2010
15. Handling Text Resources •  Text Object •  References external text files defining key/value pairs © Voxeo 2010
16. •  The Idea – Similar to the „NoMatch“ handling in the voice channel •  The VoiceObjects Solution – Define regular expressions per input •  regex:{regular expression}:regex (#slotname#) – In case validation fails for at least one field, a NoMatch event is triggered ©  Voxeo  2010   Server-side Input Validation
17. •  Examples –  regex:^\d{15,16}$:regex –  regex:^[a-zA-Z''-'\s]{1,40}$:regex –  regex:^[01]?[- .]?(\([2-9]\d{2}\)|[2-9]\d{2})[- .]?\d{3}[- .]?\d {4}$:regex •  In case input validation fails, a NoMatch event is triggered –  LASTRESULT(validation) Returns list of slot names where validation failed ©  Voxeo  2010   15  or  16  digits   Name   US  Phone   number   Server-side Input Validation
18. Agenda ©  Voxeo  2010   •  Multi-channel service delivery with VoiceObjects today •  Embracing HTML5 •  Native apps
19. VoiceObjects and Mobility •  Step 1: Strengthen VO’s Mobile Web Story •  Integrate with 3rd party frameworks
20. Agenda •  Multi-channel service delivery with VoiceObjects today •  Embracing HTML5 •  Native apps ©  Voxeo  2010  
21. •  Step 2: Go Native! •  Integrate with 3rd party frameworks – Turn HTML5 into native apps – iPhone, Android, Windows 7, … VoiceObjects and Mobility
22. Questions? ©  Voxeo  2010