The Wireless Web: The Wireless Web: Not!Not!
T376 / CS471, Winter 01T376 / CS471, Winter 01© 1999-2001 Armando Fox© 1999-2001 Armando Fox
[email protected]@cs.stanford.edu
© 2001
Stanford
Project AdministriviaProject Administrivia
By today: teams formed, proposals on WebBy today: teams formed, proposals on Web Advisors will start to review them shortlyAdvisors will start to review them shortly
Design review meetings: you can schedule Design review meetings: you can schedule yourself for…yourself for… Feb 8-9 time slotsFeb 8-9 time slots
Use link in email sent to cs241Use link in email sent to cs241
What hardware/software will you need to What hardware/software will you need to borrow/buy?borrow/buy?
© 2001
Stanford
OutlineOutline
Approaches to wireless “thin clients”Approaches to wireless “thin clients” ““Straight but reduced” ports: MS Pocket IE, C-HTML, etc.Straight but reduced” ports: MS Pocket IE, C-HTML, etc.
Adaptation by proxy: ProxiNet and Palm VII “Web Adaptation by proxy: ProxiNet and Palm VII “Web clipping”clipping”
Targeting phones: the WAP Forum and protocolsTargeting phones: the WAP Forum and protocols
The thinnest of clients: smart pagersThe thinnest of clients: smart pagers
Wireless and Palms - technology choicesWireless and Palms - technology choices
HCI: why technology improvements are largely HCI: why technology improvements are largely irrelevantirrelevant
© 2001
Stanford
1996-1998: Three-Way 1996-1998: Three-Way ConvergenceConvergence
WWWTechnologies
WirelessAccess
Thin Clients
Complex content, services, corporate applications
High functionalitybut palm-size
portable devices
Inexpensive but slowwireless access
Wireless Internet Becomes Real
Wireless Internet Becomes Real
© 2001
Stanford
Specific Announcements & Specific Announcements & ProductsProducts
Palm Pilot: the resurrection of PDA’sPalm Pilot: the resurrection of PDA’s Cut the right corners to solve someone’s problemCut the right corners to solve someone’s problem
Even better when combined with wireless…though its Even better when combined with wireless…though its designers didn’t intend thatdesigners didn’t intend that
WAP Forum announcementWAP Forum announcement Took a long time to pick up steam, but it placed a stake in Took a long time to pick up steam, but it placed a stake in
the ground for wireless data to smart phonesthe ground for wireless data to smart phones
Japanese (primarily) hybrid phonesJapanese (primarily) hybrid phones I-mode: compact HTML, a simple text-centric Web all over I-mode: compact HTML, a simple text-centric Web all over
again; what can happen when you control the phones again; what can happen when you control the phones andand the servicethe service
J-mode: the next stepJ-mode: the next step
© 2001
Stanford
The Big PictureThe Big Picture
Existing Web content and services are not designed Existing Web content and services are not designed for non-PC devicesfor non-PC devices Displays too small or text-onlyDisplays too small or text-only
Slow connection speedSlow connection speed
Data input methods very limited (phone keypad or pager Data input methods very limited (phone keypad or pager buttons)buttons)
etc.etc.
But the Web is where the action is…so we can:But the Web is where the action is…so we can:
1.1. Adapt existing content on the fly and automaticallyAdapt existing content on the fly and automatically
2.2. Make browsers run on non-PC devicesMake browsers run on non-PC devices
3.3. Manually reauthor to new standards (there are so many!)Manually reauthor to new standards (there are so many!)
4.4. Make an end run around the problem and move closer to Make an end run around the problem and move closer to the sourcethe source
© 2001
Stanford
Get content from origin Get content from origin Internet serversInternet servers
Separate by datatypeSeparate by datatype
Perform device-specific Perform device-specific transformationstransformations
Compression is a nice Compression is a nice side effect…side effect…
We’ll discuss structure We’ll discuss structure of this app in detail of this app in detail laterlater
Armando Fox
PhD Candidate, UC Berkeley Computer Science Division
Advisor: Eric Brewer
Armando Fox
PhD Candidate, UC Berkeley Computer Science Division
Advisor: Eric Brewer
1. Content Adaptation1. Content Adaptation
© 2001
Stanford
Pay Only For the Bytes You NeedPay Only For the Bytes You Need
Ultimately, users know bestUltimately, users know best proxy transforms as best as it can, but gives users a way proxy transforms as best as it can, but gives users a way
to “force” proxy to deliver original contentto “force” proxy to deliver original content
here, a simple client-side UI enhancement is coupled with here, a simple client-side UI enhancement is coupled with proxy-side refinement intelligenceproxy-side refinement intelligence
transformed contentfrom Proxy
refined contentfrom Proxy
local UIinteraction
© 2001
Stanford
More On AdaptationMore On Adaptation
How to make adaptation dynamicHow to make adaptation dynamic Why would you want to do this?Why would you want to do this?
How to structure an adaptation systemHow to structure an adaptation system
Adaptation workloads have nice systems Adaptation workloads have nice systems propertiesproperties State managementState management
Replication/parallelizationReplication/parallelization
CachingCaching
An excellent workload for clustersAn excellent workload for clusters
© 2001
Stanford
Limitations of AdaptationLimitations of Adaptation
Presentation is messed upPresentation is messed up Some content just doesn’t translate to smaller screensSome content just doesn’t translate to smaller screens
Some content is purpose designed at the pixel level for Some content is purpose designed at the pixel level for desktop browsersdesktop browsers
User experience is often terrible: navigation is User experience is often terrible: navigation is cumbersome…why?cumbersome…why? Limited inputLimited input
Each roundtrip to server takes a lot longerEach roundtrip to server takes a lot longer
Feedback often provided using graphics that don’t reproduce Feedback often provided using graphics that don’t reproduce wellwell
Adaptation of existing Web content is a useful Adaptation of existing Web content is a useful technology, but by itself won’t result in an acceptable technology, but by itself won’t result in an acceptable user experience.user experience.
© 2001
Stanford
2. Straight Ports2. Straight Ports
Example: Microsoft Pocket Internet Explorer Example: Microsoft Pocket Internet Explorer (WinCE)(WinCE) Subset of MSIE desktop functionalitySubset of MSIE desktop functionality
No Java, JavaScript, or plug-insNo Java, JavaScript, or plug-ins
Slow to render complex pagesSlow to render complex pages
Power-intensive! Power-intensive! (Battery life does (Battery life does notnot follow Moore’s Law) follow Moore’s Law)
Real limitations come from HTTP/HTMLReal limitations come from HTTP/HTML Images are scaled -- Images are scaled -- afterafter downloading downloading
Complex pages (many frames, etc.) difficult to render -- Complex pages (many frames, etc.) difficult to render -- browser can only throw up its hands browser can only throw up its hands afterafter content arrives content arrives
Many roundtrips (separate connections)Many roundtrips (separate connections)
Suffers from similar limitations as adaptationSuffers from similar limitations as adaptation
© 2001
Stanford
Performance of Ports vs. ProxiesPerformance of Ports vs. Proxies
UC Berkeley research prototype of ProxiWeb, UC Berkeley research prototype of ProxiWeb, vs. Netscape Navigator on laptop w/same vs. Netscape Navigator on laptop w/same
bandwidthbandwidth
© 2001
Stanford
3. Reauthoring: Compact HTML3. Reauthoring: Compact HTML
Proposed by Japanese ACCESS ConsortiumProposed by Japanese ACCESS Consortium engages in Internet and middleware standards activities in engages in Internet and middleware standards activities in
JapanJapan
Similar to W3C, but focused on practical applications for Similar to W3C, but focused on practical applications for consumer electronics (Web terminals, kiosks, etc.)consumer electronics (Web terminals, kiosks, etc.)
Approach: subset HTML (no frames, tables, JPG, image Approach: subset HTML (no frames, tables, JPG, image map, background images, stylesheets)map, background images, stylesheets) Reauthoring assumedReauthoring assumed
Deployed in jMode phonesDeployed in jMode phones
Note: Japanese “Internet phones”Note: Japanese “Internet phones” are much more ambitious than are much more ambitious than current U.S. and European current U.S. and European models!models! Kyocera video cell phone
© 2001
Stanford
Reauthoring: WAPReauthoring: WAP
WAP: Wireless Applications ProtocolWAP: Wireless Applications Protocol Not-for-profit “WAP forum” (analogous to W3C) formed in Not-for-profit “WAP forum” (analogous to W3C) formed in
19941994
Founding members: Unwired Planet (now Phone.com), Founding members: Unwired Planet (now Phone.com), Motorola, Ericsson, NokiaMotorola, Ericsson, Nokia
Membership now ~100 companiesMembership now ~100 companies
The WAP protocolsThe WAP protocols Cover everything from link layer to application layerCover everything from link layer to application layer
Of interest here: WML (formerly HDML)Of interest here: WML (formerly HDML)
© 2001
Stanford
Wireless Markup LanguageWireless Markup Language
Formerly HDML, proprietary to Unwired PlanetFormerly HDML, proprietary to Unwired Planet Became “open standard” after WAP forum startedBecame “open standard” after WAP forum started
Target: cell phones with 2-10 line text-only displays, icon Target: cell phones with 2-10 line text-only displays, icon graphicsgraphics
A cross between a markup language and HyperCardA cross between a markup language and HyperCard Metaphor: a “deck” of display cardsMetaphor: a “deck” of display cards
Display information (including support for images, rarely Display information (including support for images, rarely used)used)
Encode a series of menus for keypad navigationEncode a series of menus for keypad navigation
Data entry using alphanumeric mode of phone keypadData entry using alphanumeric mode of phone keypad
““Form submission” -like mechanism to retrieve data from Form submission” -like mechanism to retrieve data from InternetInternet
© 2001
Stanford
WML, cont’d.WML, cont’d.
The WML browserThe WML browser Interprets WML decks, displays info, etc.Interprets WML decks, displays info, etc.
Maps phone’s user interface (keypad, soft buttons, dials, Maps phone’s user interface (keypad, soft buttons, dials, etc.) to UI controls for menu navigation, data entry, etc.etc.) to UI controls for menu navigation, data entry, etc.
WML apps served from HTTP server via WAP WML apps served from HTTP server via WAP gatewaygateway Apps live onApps live on
standard Webstandard Webserversservers
Gateway Gateway operated byoperated bywireless datawireless dataproviderprovider
Diagram © 1999 WAP Forum
© 2001
Stanford
WML Architecture NotesWML Architecture Notes
WAP architecture isolates application delivery WAP architecture isolates application delivery App developers don’t deal with wireless transport directly App developers don’t deal with wireless transport directly
(since WAP leverages HTTP infrastructure for app distribution)(since WAP leverages HTTP infrastructure for app distribution)
Becomes a non-differentiator for phonesBecomes a non-differentiator for phones
App developers don’t have to commit to one phone platformApp developers don’t have to commit to one phone platform
Lots of incompatibilities across devices and browsersLots of incompatibilities across devices and browsers WMLscript scripting language: part of the spec, but not WMLscript scripting language: part of the spec, but not
deployed in practicedeployed in practice
HDML 1.0 vs 1.1 vs WMLHDML 1.0 vs 1.1 vs WML
VXML in future?VXML in future?
In practice, everyone uses least-common-denominatorIn practice, everyone uses least-common-denominator
Free emulator available from Unwired PlanetFree emulator available from Unwired Planet
© 2001
Stanford
WML Is Not HTMLWML Is Not HTML
reauthoring required, or applications have to be reauthoring required, or applications have to be developed from the ground updeveloped from the ground up
Differences are conceptual, not syntacticDifferences are conceptual, not syntactic WAP browser/apps are highly stateful (why?)WAP browser/apps are highly stateful (why?)
No metaphor for “clicking on a link”…only menu selectionNo metaphor for “clicking on a link”…only menu selection
WAP deck can control history stack WAP deck can control history stack
A thought: can we use the proxy approach again?A thought: can we use the proxy approach again? At least two scenarios for converting WML to HTMLAt least two scenarios for converting WML to HTML
Case 1: we can make strong assumptions about structure, Case 1: we can make strong assumptions about structure, semantics, syntax of contentsemantics, syntax of content
Case 2: we can’tCase 2: we can’t
© 2001
Stanford
Merging WAP With the Web: Case Merging WAP With the Web: Case 11
Semantic/structural assumptionsSemantic/structural assumptions Content was specifically authored for “small” devicesContent was specifically authored for “small” devices
Content sourced from more structured data (e.g. Web Content sourced from more structured data (e.g. Web front end to a database)front end to a database)
Future: XML and WIDL for describing content (more later)Future: XML and WIDL for describing content (more later)
Syntactic assumptionsSyntactic assumptions Simple runtime scan of contentSimple runtime scan of content
Look for “troublesome” elements: frames, tables, Look for “troublesome” elements: frames, tables, imagemaps, …imagemaps, …
Translate, or drop?Translate, or drop?
© 2001
Stanford
Case 1, cont’d.Case 1, cont’d.
Example: WirelessKnowledgeExample: WirelessKnowledge Exchange Server is the center of the worldExchange Server is the center of the world
Revolv service makes WAP phone into limited Exchange Revolv service makes WAP phone into limited Exchange clientclient
Example: Oracle Panama (last year)Example: Oracle Panama (last year) Many Web sites already backed by RDBMSMany Web sites already backed by RDBMS
Instead of wrapping query output in HTML, wrap in HDMLInstead of wrapping query output in HTML, wrap in HDML
Better: wrap in XML, then use XSL/XSLT for presentationBetter: wrap in XML, then use XSL/XSLT for presentation
© 2001
Stanford
Merging WAP With the Web: Case Merging WAP With the Web: Case 22
No No assumptions about contentassumptions about content
Can apply some standard tricks for a few things…Can apply some standard tricks for a few things… Client side imagemaps: extract ALT text and anchorsClient side imagemaps: extract ALT text and anchors
Images: extract ALT textImages: extract ALT text
Navbars: hope there’s a textual version farther down the Navbars: hope there’s a textual version farther down the pagepage
Making the result Making the result syntactically acceptablesyntactically acceptable is “easy” is “easy”
Making it Making it usableusable is a different story is a different story
If you use WAP, plan for it from the moment you start If you use WAP, plan for it from the moment you start designing your data schema and user interactionsdesigning your data schema and user interactions
© 2001
Stanford
The Age of “Everywhere”The Age of “Everywhere”
Everything is EverywhereEverything is Everywhere ““Java Everywhere”Java Everywhere”
““Windows Everywhere”Windows Everywhere”
““WAP Everywhere??” How about “IP everywhere”?WAP Everywhere??” How about “IP everywhere”?
How about it? IP to a cell phone?How about it? IP to a cell phone? How does this argument play in the “proxy camp”?How does this argument play in the “proxy camp”?
Yet, many (most?) proxies are TCP/IP based…Yet, many (most?) proxies are TCP/IP based…
So how about “Existing standards everywhere”?So how about “Existing standards everywhere”?
© 2001
Stanford
Pagers: the Thinnest of ClientsPagers: the Thinnest of Clients
Early yearsEarly years 1921: first use of paging, Detroit Police Dept.1921: first use of paging, Detroit Police Dept.
1976: POCSAG radio paging code1976: POCSAG radio paging code
1980’s: numeric-display pagers1980’s: numeric-display pagers
Current growth: >20% per year in USCurrent growth: >20% per year in US In Japan, paging is on the way out!In Japan, paging is on the way out!
Far thinnerFar thinner than PDA’s or WAP phones than PDA’s or WAP phones Tens of KB of memory, embedded OSTens of KB of memory, embedded OS
< 6400 baud for most systems< 6400 baud for most systems
© 2001
Stanford
Paging ProtocolsPaging Protocols
Motorola FLEX: widely-licensed one-way paging Motorola FLEX: widely-licensed one-way paging protocolprotocol 6400 baud, fallback to 32006400 baud, fallback to 3200
4-bit checksum to pager4-bit checksum to pager
In principleIn principle, 30K char limit, 30K char limit
ReFLEX: Two-way extension to FLEXReFLEX: Two-way extension to FLEX
Motorola FLEXscript SDKMotorola FLEXscript SDK For designing Motorola SmartPager appsFor designing Motorola SmartPager apps
1-way or 2-way1-way or 2-way
Model seems similar to Web clippingModel seems similar to Web clipping
© 2001
Stanford
Combining Paging and 2-Way DataCombining Paging and 2-Way Data
Paging system excels at short notificationsPaging system excels at short notifications Ubiquitous coverageUbiquitous coverage
InexpensiveInexpensive
Range of devices (digits only, alphanumeric, pixel-Range of devices (digits only, alphanumeric, pixel-addressable)addressable)
2-way data link excels at selectively pulling down 2-way data link excels at selectively pulling down more contentmore content
Idea: combine the two capabilitiesIdea: combine the two capabilities Especially in devices that are capable of bothEspecially in devices that are capable of both
Examples: PCS phones, some PDA’s (with pager cards) Examples: PCS phones, some PDA’s (with pager cards)
© 2001
Stanford
Integration of Push and PullIntegration of Push and Pull
ProxiWeb (browser) used as universal display clientPushed information seamlessly integrated with pulled information
PushBack example: © 1999 ProxiNet, Inc.
© 2001
Stanford
Other Wireless TechnologiesOther Wireless Technologies
Web clipping and Palm.net (PQA)Web clipping and Palm.net (PQA) Basically a proxied approach with subset HTMLBasically a proxied approach with subset HTML
Focused on user experienceFocused on user experience
OracleMobile - a completely hosted mobile app OracleMobile - a completely hosted mobile app environmentenvironment You provide your own Web serverYou provide your own Web server
You code your presentation layer in You code your presentation layer in MobileXMLMobileXML
Your app is hosted on Your app is hosted on theirtheir server, which makes calls to server, which makes calls to youryour server and handles the WAP devices server and handles the WAP devices
They have ready made “modules” including weather, ATM They have ready made “modules” including weather, ATM locator, etc.locator, etc.
© 2001
Stanford
Reliability, Latency, CoverageReliability, Latency, Coverage
Which is most appropriate for Which is most appropriate for youryour service? service?
Cell phone Cell phone (SMS or (SMS or WAP)WAP)
1-way pager1-way pager 2-way pager2-way pager
ReliabilityReliability End-to-end End-to-end reliablereliable
Best-effort, but Best-effort, but can build e2e on can build e2e on toptop
Reliable Reliable notification notification
End-to-End-to-end ackend ack
NoNo NoNo NoNo
Delivery Delivery latencylatency
BimodalBimodal Short (<4 min)Short (<4 min) DependsDepends
PersistencPersistencee
YesYes DependsDepends DependsDepends
AvailabilitAvailability/y/CoverageCoverage
GoodGood ExcellentExcellent FairFair
© 2001
Stanford
Wireless & Palm: Technology Wireless & Palm: Technology ChoicesChoices
Direct HTML browsingDirect HTML browsing Intellisync Browse-it now in public beta Intellisync Browse-it now in public beta
(www.intellisync.com)(www.intellisync.com)
Use existing HTML authoring tools, etc.Use existing HTML authoring tools, etc.
Requires wide-area connectivity (Metricom, OmniSky)Requires wide-area connectivity (Metricom, OmniSky)
Site will be portable to WinCE browsers such as Pocket IESite will be portable to WinCE browsers such as Pocket IE
Palm VII PQAPalm VII PQA OnlyOnly works with Palm VII or OmniSky-enabled Palm III/V works with Palm VII or OmniSky-enabled Palm III/V
PQA dev kit is free from Palm, mostly use standard toolsPQA dev kit is free from Palm, mostly use standard tools
Waba (a subset of Java - but Waba (a subset of Java - but notnot the libraries!) the libraries!) Code entire standalone apps for the PalmCode entire standalone apps for the Palm
Network connectivity is something of a pain in the buttNetwork connectivity is something of a pain in the butt
© 2001
Stanford
HCI Issues: Voice ControlHCI Issues: Voice Control
Myth: perfect voice recognition will solve all HCI Myth: perfect voice recognition will solve all HCI problems related to phone-based servicesproblems related to phone-based services
Reality of voice interfaces:Reality of voice interfaces:
Inherently sequentialInherently sequential
User must remember context and choicesUser must remember context and choices
Big problem with recognizing commands vs. dataBig problem with recognizing commands vs. data
User is usually distracted because they’re doing User is usually distracted because they’re doing something else! (Otherwise they’d use a data service)something else! (Otherwise they’d use a data service)
Moral: Use voice where it’s the most natural Moral: Use voice where it’s the most natural interaction (e.g. to leave a message)interaction (e.g. to leave a message)
© 2001
Stanford
HCI Issues: Network SpeedHCI Issues: Network Speed
Myth: fast, widely-available 3G networks will solve Myth: fast, widely-available 3G networks will solve usability problems for wireless apps.usability problems for wireless apps.
Reality:Reality:
How much data can you stream to a cell phone? Is How much data can you stream to a cell phone? Is “talking head” videoconferencing that compelling?“talking head” videoconferencing that compelling?
Most Most realreal limitations are limitations are unrelatedunrelated to network speed to network speed Limited screen sizeLimited screen size
Limited data-input capabilityLimited data-input capability
Technologies have been developed that are pretty effective at Technologies have been developed that are pretty effective at working around slow networks!working around slow networks!
Slow networks hamper some apps, but are not likely to be Slow networks hamper some apps, but are not likely to be the main “dealbreaker” for today’s apps.the main “dealbreaker” for today’s apps.
© 2001
Stanford
HCI Issues SummaryHCI Issues Summary
Technology breakthroughs will not provide “magic Technology breakthroughs will not provide “magic bullet”bullet” Convenience of doing task is critical: minimize number of clicks Convenience of doing task is critical: minimize number of clicks
Compare to Palm Pilot!Compare to Palm Pilot!
How can you exploit task context to do this?How can you exploit task context to do this? Location of the phoneLocation of the phone
Stored information about user in their profileStored information about user in their profile
Other sources of context?Other sources of context?
Remember: things that are easy on a desktop Web Remember: things that are easy on a desktop Web browser become awkward on a smaller device.browser become awkward on a smaller device.
Wireless experience must be carefully designed--not Wireless experience must be carefully designed--not retrofitted from the Web experienceretrofitted from the Web experience
© 2001
Stanford
ConclusionsConclusions
Consumer wireless is here, ready or notConsumer wireless is here, ready or not
The user experience must come firstThe user experience must come first Most current efforts have floundered in not observing thisMost current efforts have floundered in not observing this
Lots of turbulence in the area right nowLots of turbulence in the area right now Competing application standards: WAP, C-HTML, HTML, Competing application standards: WAP, C-HTML, HTML,
various proxied approachesvarious proxied approaches
Phones becoming “open” platforms (via WAP)Phones becoming “open” platforms (via WAP)
PDA’s being served by proprietary wireless (Palm VII), open PDA’s being served by proprietary wireless (Palm VII), open standards based wireless (ProxiNet), cradle/dock based standards based wireless (ProxiNet), cradle/dock based offline browsing (MS Channels and Channel Viewer)offline browsing (MS Channels and Channel Viewer)
No 800-pound gorillas yet…No 800-pound gorillas yet…it may pay to stay it may pay to stay agnosticagnostic