Creating interfaces

1
Creating interfaces

• XML to WML, Push
• Use actual cell phones
• Homework practice with simulators your own
  cell phone if you have a contract for Web
  access. Look at commercial Web sites and report
  on Discussion Board. Sign up as tellme developer.

2
Online tutorials

• Webmonkey, elsewhere tutorials on wml and
  xhtml-mp
• Pursue this if you want to do your second project
  on this.

3
Soccer results

• Take same content (results xml file) and use XSLT
  to produce a WML file
• (Leave out steps of posting this WML file to a
  WAP transmitting server for access by WAP enabled
  phones and PDAs.)
• Our goal is to work with different channels to
  focus on the interface design.

4
XML to WML

• On my site, see the two files
• resultsnoref.xml
• resultswml.xsl

5
resultsnoref.xml (fragment)

•   07-Jun-2002
•   Spain
•   Paraguay  
• .
•   31-May-2002
•   France loses to Senegal
•   The 1998 World Cup Champion France lost
  the opening game to Senegal. for France. The
  team was playing without one of the stars,
  Zidane.
•   Senegal
•   France
•   soccer1.jpg  

6
Task for transformation

• What do we need to do?
• generate at the start the 'boilerplate' for
  producing an WML file
• produce a 'card' for each match
• Generate ids for the cards m1, m2, etc.
• produce in that card the text giving the score
• produce next and prev tag elements to go forward
  and back
• do and go elements for the next (generating the
  href value
• prev for the previous

7
resultswml.xsl

• "http//www.w3.org/1999/XSL/Transform"
  xmlnsfo"http//www.w3.org/1999/XSL/Format"
•   WML 1.3//EN" doctype-system"http//www.wapforum.o
  rg/DTD/wml13.dtd" /

8

•   /
•  

9

•  
•  
•  
  
•  
•  
•   ,
•  
•  
•  

10

•   /
•   nextp)" /
•  
•  
•  
•  
•  

11
Push

• refers to pushing information out to a client
  through a previous arrangement
• send me the soccer scores as they occur
• send me news on these topics
• send me financial information
• Old idea being re-cycled. It MAY be more
  appealing for cell phone/PDA/wireless media than
  for 'old fashioned' desktop PCs using the Web
• I'm a news junkie and do not want to limit my
  news to specific topics.
• You?

12
Problem

• OpenWave handles xhtml-mp meta tag mechanism for
  timed events, but does not handle links to wml
  (with wmlscript calls)
• Nokia handles links to wml (with wmlscript calls)
  but not meta tag mechanism for timed events
• Not sure about actual phones

13
Why is this a problem?

• Want to do virtual pet example
• need timing to (starve) dog
• need random for petting

14

• Mobile 1.0//EN"
• "http//www.wapforum.org/DTD/xhtml-mobile1
  0.dtd"
• Virtual Dog
• urlthindog.xhtml" /
• type"text/css"/
• Regular dog
• 
  
• You may
• • Feed
    dog
  • Pet dog
  
  

15

• 1.3//EN"
• "http//www.wapforum.org/DTD/wml13.dtd"
• ...petting

16

• ...petting

17

• ...petting

18

• ...petting

19

• doing it

20

21

• sad dog

22

• happy dog

23

24

• sad dog

25

• happy dog
• sad dog -- should never happen

26
trytopet.wmls

• extern function pet(odds)
• var choice
• Lang.seed(-1)
• if (oddsLang.random(4))
• WMLBrowser.go("petdog.wmlhappy"odds)
• else
• WMLBrowser.go("petdog.wmlsad"odds)

27
newmedia.purchase.edu/Jeanine/origami.htmlnewmed
ia.purchase.edu/Jeanine/origami.xhtml

• On my phone (verizon service), origami.xhtml did
  NOT workorigami.html worked partially
• the css file and the gif files were not used
• links did work
• demonstrate using
• regular web browser
• simulators

28
Homework

• Try samples
• Experiment with your own!