280 likes | 418 Views
Introduction to User Interface Markup Language (UIML). What is a Device?. A Scenario: A Hospital. Doctor reviews schedule on office PC makes rounds with handheld checks patient status from voice phone Patient has relapse Info system locates device closest to doctor
E N D
A Scenario: A Hospital • Doctor • reviews schedule on office PC • makes rounds with handheld • checks patient status from voice phone • Patient has relapse • Info system locates device closest to doctor • Text pager alerts message • Doctor orders tests via smart phone
Problem: Tower of Babel Devicevariety Platform (Language & OS)variety + = Trouble !
Troubles for Developers • Multiple source bases(WML, Java, C++, SpeechML, XUL, ...) • Keeping UIs consistent across devices • Tracking changes in too many languages • Learning to use too many interface technologies (voice, handwriting, …) • Vendor risk
Trouble for System Admins • Need to install new releases of software for multiple devices
Perspective • Situation today is analogous to PC industry 20 years ago: • Many types of devices, many APIs • Eventually operating systems shielded developers from device-specific APIs • UIML provides similar shield for devices
Another Perspective Machine language Assembly language “High-level” language (C++, Java) Scripting languages Device-dependent markup Device-independent markup
UIML Objective Universal, device-independent language • Able to describe family of UIs • Maps language to devices via style sheets • Works even for devices not yet invented
Other UIML Objectives • Naturally separates UI from rest of application • Facilitates • rapid prototyping • accessibility • internationalization • Usable by non-programmers • Extensible
Concept 1: UIML is a “Meta” Language • XML • Doesn’t define tags (<P>,…) • Must add doc type definition to make it useful • No need to change XML as new tag sets invented • UIML • Doesn’t define tool-kit specific tags (<Menu>,…) • Uses a few powerful tags (<part>, <property>,…) • Must add toolkit peer definition to make it useful • No need to change UIML as new devices invented
UIML’s Approach UI description: <part name=“Line” class=“MenuItemOrIcon”> Style: <property class=”MenuItemOrIcon" name="rendering” value="java.awt.MenuItem” /> Events are handled similarly.
Concept 2: No Loss of Power Two approaches to cross-device language: • Least common denominator • Preserve full capability of each device (Each device UI is a different view into a rich backend application)
Concept 3: Specifying Any UI Answers 5 ?s... • Which UI elements present for device X? • What presentation style for X? • What words/sounds/images? • What interface events? • How to connect tobackend?
UI description UI/backend connection Map to Java, etc. UIML Skeleton <?xml version="1.0" ...?> <uiml version="2.0b"> <interface> <structure name=“PC”>…</structure> <style>…</style> <content>…</content> <actions>…</actions> </interface> <logic>...</logic> <toolkit-peers> ... </toolkit-peers> </uiml>
Handle button-clickin C++, VB code Handle it inscripting language Handle it declarative(in UIML itself) Concept 4: E volution of Event Handling
Concept 5: UI = Elements + Style + Content • Facilitates internationalization: • Note that you didn’t see text for menuitem yet • Text for menu tag is in <data> section. • Multiple texts for multiple languages • Helps expert/novice UI problem
Credits UIML is an evolution from lots of good ideas: • HTML/CSS/XSL separation of style • UI management systems from HCI community • The “X” in XML • ...
To learn more... • uiml.org: tutorial, spec, Java renderer source code • Try it! Downloadable Java renderer • In progress: • SpeechML, WML, WinCE subset renderers • Dynamic interface server
Rapid Prototyping Example • One UI definition • Two presentation styles