1. Towards Effective Adaptive User Interfaces Design
by Tomas Cerny*, Michael J. Donahoo# and Eunjee Song#
*Czech Technical University
#Baylor University, TX, USA
ACM RACS 2013, Montreal, CA

2. Background User Interface design Adaptive UI features OOP
3-layer application
Enterprise SW. Architecture
Component-based UI
Java EE
Existing standards
Data-driven appl.
JPA
Information systems
Beans Validation
ACM RACS 2013, Montreal, CA

3. Basic data presentation in UI
Fig. UML Class diagram for data PersonInfo
Fig. UI presentation of PersonInfo
Implementation
OO Class / Entity
Domain specific language (DSL)
ACM RACS 2013, Montreal, CA

4. Basic data presentation in UI
What is the issue?
Fig. UML Class diagram for data PersonInfo
Fig. UI presentation of PersonInfo
Implementation
OO Class
Domain specific language
ACM RACS 2013, Montreal, CA

5. We decompose the form design into various concerns
ACM RACS 2013, Montreal, CA

6. These concerns can be seen as individual ones
ACM RACS 2013, Montreal, CA

7. But the implementation is in a single dimension
ACM RACS 2013, Montreal, CA

8. UI Design Issues Domain-specific languages (DSL) for UI
No type safety
Information replication
Data model -> Presentation
Tedious and error-prone (manually)
Cross-cutting concerns
Lots of coding involved
Research: 48% of total application code and 50% of time devoted to UIs.
Hard maintenance
Date model changes -> manual changes in UI part
ACM RACS 2013, Montreal, CA

9. What is an Adaptive UI Basic UI Adaptive UI
Provides a single UI for various users
No matter their origin, context, capabilities, etc.
Adaptive UI
Takes into consideration specific users, runtime and application context
Adapts to the end user
Adapts to runtime conditions
ACM RACS 2013, Montreal, CA

10. What is an Adaptive UI Basic UI Adaptive UI
ACM RACS 2013, Montreal, CA

11. What is an Adaptive UI Basic UI Adaptive UI
ACM RACS 2013, Montreal, CA

12. What is an Adaptive UI Basic UI
Adaptive UI (Confused, Child and Elderly)
ACM RACS 2013, Montreal, CA

13. What is an Adaptive UI Basic UI
Adaptive UI (Confused, Child and Elderly)
ACM RACS 2013, Montreal, CA

14. What is an Adaptive UI Basic UI
Adaptive UI (Confused, Child and Elderly)
ACM RACS 2013, Montreal, CA

15. What is an Adaptive UI Basic UI
Adaptive UI (Confused, Child and Elderly)
ACM RACS 2013, Montreal, CA

16. Related work evaluation criteria
Runtime context
Development & maintenance
Adaptive UI
Performance
Cross-cutting concerns
Adjustable output
Information replication
ACM RACS 2013, Montreal, CA

17. Model-driven development MDD
Runtime context
+/-
Development & maintenance
+/- & -
Adaptive UI
Performance -
Cross-cutting concerns
Adjustable output
Information replication
ACM RACS 2013, Montreal, CA

18. Domain specific languages DSL
Runtime context
+/-
Development & maintenance
+/- & -
Adaptive UI
Performance -
Cross-cutting concerns
Adjustable output
Information replication
ACM RACS 2013, Montreal, CA

19. Widget editors Runtime context - Development & maintenance +/- & -
Adaptive UI
Performance +
Cross-cutting concerns
Adjustable output
+/-
Information replication
ACM RACS 2013, Montreal, CA

20. Code-inspection Runtime context + Development & maintenance
Adaptive UI -
Performance
Cross-cutting concerns
Adjustable output
Information replication
ACM RACS 2013, Montreal, CA

21. An Ideal? Runtime context + Development & maintenance Adaptive UI
Performance
Cross-cutting concerns
Adjustable output
Information replication
ACM RACS 2013, Montreal, CA

22. General Design Approaches
Model-driven development
Issues with maintenance, runtime context, performance, binding to existing systems, information replication
Generative programming
Static, directly address cross-cutting concerns, information replication
Aspect-oriented programming
Applies in runtime, limited research in the UI, information replication
ACM RACS 2013, Montreal, CA

23. Existing development approaches
3-layer architecture
Enterprise software architecture
Component-based UI
Standards for persistence (ORM) and data validation
Extension for Security and Presentation
Annotation-based
ACM RACS 2013, Montreal, CA

24. How to get to the ideal Lets combine Generative Programming
Current standards,
Aspect-oriented programming
Generative Programming
Model driven development
Code-inspection
ACM RACS 2013, Montreal, CA

25. Rich Entity Aspect/Audit Design
Introducing READ
Rich Entity Aspect/Audit Design
ACM RACS 2013, Montreal, CA

26. READ Entity – the data class
Rich Entity – extended with annotations/XML
Central point of information
Aspect/Audit – code-inspection and transportation
ACM RACS 2013, Montreal, CA

27. READ Phases 1. Inspection 2. Transformation (Meta-model + Context)
Code-Inspection -> Meta-model
Context enforcement -> Context-aware meta-model
2. Transformation (Meta-model + Context)
Presentation rules (Aspect-driven) DSL
Template composition (Aspect-driven) DSL
Layout composition (like as XSLT) DSL
3. Runtime code integration
ACM RACS 2013, Montreal, CA

28. READ Phases
ACM RACS 2013, Montreal, CA

29. READ formalization: Aspect concept model
Join Point Model
Static – the data structure
Dynamic – the application context
Pointcut Language
Unified Expression Language to for queries
Type eq ‘String’ and required and length > 255
Adaptation Mechanism
UI Presentation and integration of various concerns
ACM RACS 2013, Montreal, CA

30. READ Phases The Outcome
1. Inspection
Meta-model + Context = Join Points (Static + Dynamic)
2. Transformation
Presentation rules (Aspect-driven)
For each data field
Pointcut – a query to field properties and context (EL)
Advice – a presentation template to use
Presentation template composition (Aspect-driven)
Gives Presentation
Advice – aspect integration
Layout template composition (like as XSLT)
3. Runtime code integration
ACM RACS 2013, Montreal, CA

31. READ practical impact Runtime context + Devel. & maintenance
Adaptive UI
Performance
Cross-cutting concerns
Adjustable output
Information replication
ACM RACS 2013, Montreal, CA

32. READ evaluation Case study Java EE 7 data classes
ACM RACS 2013, Montreal, CA

33. READ evaluation Case study Java EE 7 data classes
ACM RACS 2013, Montreal, CA

34. READ evaluation Case study Java EE 7 data classes
ACM RACS 2013, Montreal, CA

35. READ evaluation Case study Java EE 7 data classes
ACM RACS 2013, Montreal, CA

36. READ evaluation Performance Java Server Faces
ACM RACS 2013, Montreal, CA

37. READ Real Study
ACM-ICPC
ACM RACS 2013, Montreal, CA

38. READ Real Study 32% of the entire UI code is generated!
ACM RACS 2013, Montreal, CA

39. READ Real Study 32% of the entire UI code is generated!
ACM RACS 2013, Montreal, CA

40. Conclusion READ approach Reduced Devel. & Maintenance efforts
Benefits of AOP, GP, MDD
Runtime Approach
Adaptive UI
Integration of Existing standards
OS Library AspectFaces for Java apps.
ACM RACS 2013, Montreal, CA

41. Future Work Business rule integration Ontology-based criteria
Platform-awareness
Ongoing work on Android, PHP, etc.
User interface protocol
ACM RACS 2013, Montreal, CA

42. Q/A
@inproceedings{cerny2013, Title = {Towards Effective Adaptive User Interfaces Design}, Author = {Tomas Cerny and Michael J. Donahoo and Eunjee Song}, Booktitle = {Proceedings of the 2013 Research in Applied Computation Symposium (RACS 2013)}, Isbn = { }, Month = {October}, Year = {2013}, Keywords = {Aspect-driven design;Inspection-based approach; Adaptive user interfaces,;Reduced maintenance/development efforts}}
ACM RACS 2013, Montreal, CA