1 / 24

Understanding Device-Independence with UIML Markup Language

Explore UIML - A User Interface Markup Language for device-independent web authoring. Learn about its key concepts, implementation benefits, and address existing challenges in UI design. Embrace the power of UIML for creating versatile user interfaces across various devices.

kimberlykatz
Download Presentation

Understanding Device-Independence with UIML Markup Language

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Device-Independence with UIML(User Interface Markup Language) Marc Abrams abrams@harmonia.com uiml.org W3C Workshop on Web Device Independent Authoring October 2000

  2. Quotes from Position Papers • New XML language should • Allow author-once-deploy many scenarios • Achieve clean separation between behavior, content, presentation [Ruud Siebelink] • Issue is interaction not presentation[Paul Smethers, WAP] • Ideal solution: write well-formed code once [Jansen] • Semantics [meaning of Web content] must be made clear at primary design level [William Loughborough] • Must adapt to new devices not envisioned[Ralph Case, Stephane Maes]

  3. Where UIML Fits In Application database Content (XML, audio,…) Device Adaption UIML Using CC/PP XHTML VoiceXML XHTML VoiceXML

  4. UIML… One Part of a Solution • 3+ years in development at Harmonia, Center for HCI at Virginia Tech • Tools downloaded in 40+ countries • Compile to anything • Anyone can freely implement UIML • Objective is open standard • One canonical representation of UI forany device, language, OS, UI-metaphor

  5. Problem with Existing Approaches • Suggested way to annotate existing markup: <card> <select class=“DISPLAY_SMALL”> … </card>

  6. Key Concept: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 vocabulary to make it useful • No need to change UIML as new devices invented

  7. Device / Platform UI Metaphor Application Presentation Interface Logic Structure Style Content Behavior 6-way separation of UI description (vs. 3-way MVC) UIML Model Underlying principle of single authoring is MVC [to separate content/structure] [Ralph Case, Stephane Maes]

  8. <interface> <structure> <part class=“Button”> … </part> ... </structure> </interface> UIML Skeleton What parts comprise the UI &what’s their relationship? <?xml version="1.0" ... ?> <uiml version="2.0"> </uiml>

  9. <style>…</style><content>…</content> <style>…</style><content>…</content><behavior>…</behavior> <style>…</style><content>…</content><behavior>…</behavior> <style>…</style><content>…</content> <style>…</style><content>…</content><behavior>…</behavior> What behavior do parts have? <style>…</style> What presentation style for each part? How to connect to outside world?(business logic, UI toolkit object) <style>…</style><content>…</content> <style>…</style><content>…</content> <peers>...</peers> What content for each part?(text, sounds, image, …) UIML Skeleton <?xml version="1.0" ... ?> <uiml version="2.0"> <interface> <structure>…</structure> </interface> </uiml>

  10. <peers> Maps Classesto Targets <d-class name="JButton" … maps-to="javax.swing.JButton"> … </d-class> Versus <d-class name="JButton" … maps-to=“html:input"> … </d-class> This part is written once, like a device driver for an OS. Events and calls to outside world handled similarly.

  11. HTML XML UIML Java ... Reduces to N+M NxM Problem • App composed on • M “pages” • accessed via N devices • requires NxM authoring steps [Ralph Case, Stephane Maes]

  12. Richest user experience Fastest to build UIML PermitsDevelopment Continuum Usedevice-specificvocabulary: <part Class=“JPopupMenu”>versus<part Class=“Select”> Usegenericvocabulary: <part Class=“Menu” >

  13. UIML Permits Families of UIs

  14. Another Perspective… Device-independent markup Device-dependent markup Scripting languages “High-level” language (C++, Java) Assembly language Machine language

  15. Still…UIML is Not a Silver Bullet… Some open problems: • Aid/enforce accessibility guidelines [Jon Wu] • Support auto adaptation/personalization[Ruud Siebelink] • Reorganizing UI: • Many apps will need to be re-designed entirely [Guido Grassel] • 1 page in a desktop Web browser might be split into 2 screens for TV [Peter Ferne]

  16. European Workshop on UIML –January 2001 in Paris(see uiml.org)

  17. Supplemental Slides

  18. Quote • Level 0 represents universal content, level 1 content with knowledge of device capability,… [Jon C.S. Wu]

  19. More Quotes • Assumption that there is primordial content… forming single original document… • These assumptions are false… • A news story in one paragraph in tabloid is not same as an extended column in a broadcast [Miles Sabin]

  20. More Quotes • WML/WMLScript differs significantly from … HTML/JavaScript. Hence format used needs to be expressive enough [Guido Grassel]

  21. Identification of content should be device-independent • Text may be represented … in [either] fully-formated… [or] paraphrased versions [Gimson]

  22. More Quotes • Choice between template-driven & content-driven presentation generation [Sebastian Nykopp] • Issue is interaction not presentation[Paul Smethers on WAP]

  23. Toward N + M

More Related