Creating User Interfaces

1
Creating User Interfaces

• Continue with VoiceXML
• Homework Post proposal on project, team members

2
VoiceXML

• A VoiceXML program must be legal XML and
• Obey rules of vxml
• What this means
• Well-formed (close up elements) and
• Obey rules for what can be child elements of
  what
• Look up in on-line guide, what are valid child
  and parent nodes

3
Some rules

• Application consists of 1 or more and
  elements
• Use to go to follow-up or
  
• elements can have elements and
  elements

4
Caution

• This is not a procedural language like
  JavaScript, Java, c, c, ActionScript,
  Processing, etc.
• It may be good to use element with the
  variant of JavaScript
• Note use of quotes in expr" " and cond" "
  . The expression in the double quotes may contain
  single quotes ' ' to indicate actual (aka)
  literal strings of characters.

5
Interpretation logic

• Need to consider use of , or
  , , , , etc.
  for handling the interactions with real
  callers.
• Note my name for users is callers

6
VoiceXML elements

• for handling less than ideal conditions
• and
• for selection from list (alternative to grammar)
• pause

7
Accepting caller input

• Application getting caller name
• More complex than you would think
• There is the element

8
Simple record/playback

• Hello. Who is calling?
• Hello.
• Have a nice day.

9
Problems

• Replays in callers voice
• Cant use outside the form
• Could save to server lookup record under
  VoiceXML elements.
• Sample php code

10
More involved dialogue

• Hello. Who is calling?
• Great to hear from you.

11
Continued ask for class

• Which class are you in?
  
• databases
• interfaces both
• no none not

12
Continued respond for each class

• Good to hear from you
• check the next class notes for how to
  do this
• This may not be quite what some of you
  wanted.
• I don't know why you are calling
  
• but it is nice to chat

13
Suggestion

• Get the simple one working and then work on the
  second one
• Suggested use is for callers to record a greeting
• So it makes sense to be in the callers voice
• Experiment with grammar

14
rock paper scissors

• Note a different version is on the tellme site.
• This is not a great choice (identify a better
  one) since it doesn't support the illusion that
  'the computer' is making the choice at the same
  time that the player is.
• but it does illustrate the features.

15
rps logic requirements

• create a random move for 'the computer'
• use Math.random and Math.floor
• prompt and then distinguish caller saying 'rock',
  'paper', 'scissors', 'score', 'quit'
• use and elements
• keep score
• use JavaScript variables
• modest amount of error handling
• and and count attribute in
  

16
VoiceXML features

• Menu element replaces form element (and its use
  of field and grammar elements)
• Each has a count. Used when nomatch or
  noinput occurs and you dont want to re-prompt
  with exact same words.
• Can distinguish nomatch from noinput
• Can control timing amount of time waiting for
  caller input and time between system utterances.
• My version could be improved!

17

• var movesnew Array('rock','paper','scissors')
• function randommove()
• var r Math.floor(Math.random()3)
• return movesr

18

• Say rock, paper, scissors, score or
  quit
• Please make a choice, rock, paper or
  scissors, or say score to get the score or quit
  to quit
• I guess you're done.

19

• I didn't understand.
• I didn't hear anything
• rock
• scissors
• paper
• score
• quit

20

• Scores are wins
• .
• Losses
• Ties

loops back
21

• Computer played
  
• Tie
• You lose. Paper covers rock.
• You win. Rock breaks scissors

22

• Exercise write the missing forms.
• Exercise improve prompts.
• (Exercise when you can test it using the phone
  improve use of breaks.)

23

• Good bye

24
testing

• Go to your tellme account
• Point your account at the website.
• For my examples, find out URLs by going to my XML
  stuff site.
• Rock-paper-scissors is at
• http//newmedia.purchase.edu/Jeanine/interfaces/r
  ps.xml

25
Adding your voice

• Use tellme studio procedure for recording using
  the phone.
• They mail you the file.
• You should rename file.
• You upload that file to your website.
• You will need to keep track of files. They will
  use a name/number system for files sent.
• Do one at a time

26
Other VoiceXML elements

• subdialog
• to jump to encapsulated dialog OR server-side
  script (which generates a VoiceXML document)
• submit
• to jump to a new document generated by
  server-side script
• data
• to access XML content (generated by server-side
  programs)
• record
• recording caller input for storage on server
• transfer
• transfer to another phone number

27
Advanced concepts/features

• Transfer
• Bargein
• ???
• Extra credit for including these.

28
Phone as interface recap

• Familiar, ubiquitous, friendly (?), potentially
  hands-free
• Design challenge same (similar, not graphic
  design)
• focus on function (information exchange)
• caller actions can be guided but still
  potentially quite variable

29
Homework

• Decide on your VoiceXML project and post your
  proposal
• May be teams of 1 to 3 people.
• From more, more is expected.
• Must involve interactions
• Think of complexity of rock-paper-scissors
• Must involve some error handling, recovery, help
  to caller.
• Can be funny!