This document discusses the evolution of rich internet applications (RIAs) and user experience design over the past 15 years. It begins with a look at early experimentation with technologies like Java applets, Flash, and ActiveX controls in the late 1990s. Foundational developments from 2000-2004 included XML, SOAP, and early versions of Flash and Flex. Major growth occurred from 2005-2008 as Adobe acquired Macromedia and technologies like Ajax matured. Emerging trends for 2009-2011 include greater integration of hardware and mobile devices. The document argues that user experience should be the primary driver of software development and provides examples of how different technologies like Flex, Silverlight and Ajax have enabled novel applications. It closes by

1. Next Generation
User Experiences
“RIA 2010? A look to the future”
dave meeker, user experience strategist - roundarch
dmeeker@roundarch.com

2. 2
Disclaimer
As a professional that focuses on user
experience, I can not manage to give a
talk without first putting the subject
matter into context.

3. 3
We might Jump Around a bit.
bear with me?

4. 4
Why Are We Here ?

5. 5
in order to
understand why we
are here...we have to
understand where
we’ve been

6. 6
we have been on a constant
search for tools to create
better user experiences.

7. 7
1995 - 2000: “experimentation”
Netscape Plugins
ActiveX Controls
Java Applets
MS HTML Layout Control (IE3.0)
CGI Push Video
Framesets
Shockwave
MS Liquid Motion

8. 8
MS ActiveX Control Pad - 1996

9. 9
MS HTML Layout Control (ActiveX) - 1996

10. 10
Java Applet for Charting - 1996

11. 11
Java Applet Calculator - 1996
“Pocket Calc”

12. 12
Dynamic HTML, Cascading Menu - 1998
“DHTML” Cascading Menu

13. 13
We have been working to
overcome the absurd rule of
page-based applications,
minimally-functional UI controls
and “fetch --> display” nature of
the Web.

14. 14
User Expectations > HTML are greater than
Building “Real” Applications
using HTML as the primary
GUI technology doesn’t allow
for the optimal experience
that your users want.
It gets you there, but could be
so much better!

15. 15
2000 - 2004: “foundation”
SOAP / Web Services
XML
Flash MX*
Flash Remoting
Macromedia Central
Macromedia/Adobe Flex 1.0
MS .NET
* With Flash MX, Macromedia Introduced the term “Rich Internet Application” to the Web Vernacular

16. 16
The Pet Market Application - Rich Become Real

17. 17
2005 - 2008: “revolution”
Adobe Buys Macromedia
SOA Adoption & Readiness
AJAX Maturity
Adobe Flex 2.0 - 3.0, AIR, Flash Player,
FDS
Microsoft Silverlight, Expression Studio,
Surface
Users now demand good experiences

18. 18
2009 - 2011: “the (near) future”
Web Applications Benefit from Hardware
Graphic Acceleration & OS Connectivity
Desktop & Web Blurring Continues
The Cloud Become Real: Personal Remote File
Storage Becomes Preferential
APIs, APIs, APIs & more APIs
The Thin Client Returns
Mobile Gets Real
Semantic Data
Voice / Touch Input
Multi-Channel Becomes Essential

19. User Experience
Not just an academic name for design!
Becoming the key driver behind consumer and enterprise software
development initiatives
Over the last 10 years, we’ve really increased the possibilities of
what can happen on the back-end
Back-end applications have paved the way for what we can now
leverage on the front-end
Users are now demanding that applications adapt to their evolving
skills, wants, and needs.
If you are developing “RIAs” (in any technology) YOU care about user
experience.

20. 20
The future is RIAs.
That future is now.

21. Rich Internet Applications
Do we still have to call them “RIAs”?
“Rich” = “Software Like” not “Page-Based”
Responsive
Contextual
Real-Time
Motion-Capable
Because we now have robust GUI technologies, shouldn’t “RIAs” be
the new standard?
RIAs are not about pushing technology, they are about enabling
better user experiences.

22. What Are the Primary Technologies used
to enable great user experiences (RIAs) ?
MS Silverlight
Flash Player (Flash, Flex)
Adobe AIR
Google’s Tools (Gears, Chrome, Javascript)
JavaFX
Laszlo
Good ‘Ol HTML/Javascript
Others

23. 23
all of this technology
was created with a
single goal...
creating better user
experiences

24. What other technologies have or will have an impact
on our ability to make killer user experiences?
SOA
Business Logic Exposed via Services
Application Enabling Services
Image / Video Processing
AI/Decision Making Services
Recommendation Engines
Audio Processing
VOIP
Context Generation & Search Services

25. 25
Fear Not:
3rd Party
Integration

26. Mixing the best of the UI
technologies with our highly
developed back-end “brains”
leads to next generation
experiences.

27. We’ve built RIAs so that our Web applications
would “Feel” more like Desktop Applications
Sometimes “Feeling” isn’t enough.
How can we combine the Web and the Desktop?
It is happening now!
Desktop Widgets
AIR
WPF
Laszlo Webtop
JavaFX

28. Look how far we’ve come already
Examples of “rich connected” applications

29. What Helps to Enable Next-
Generation Web Experiences?
Utilizing 3-D
Let’s not use the term “3-d”. We aren’t talking about virtual reality here, or bad movies
from the 80s!
3-D = “Interfaces that take advantage of X,Y and Z
Z = “Natural Objects” living in space
Great for data visualization
Great for putting different screen objects in context with one another
Feels more “human”
Boundless - Eliminating page-based boudaries
Not possible on the Web prior to RIAs
Not suitable for all applications, but exceptional for others.
Why lock yourself into a box?
Leaning on “the Cloud”
Utilizing 3rd party functionality for storage & processing

30. What is on the Horizon?
New forms of Input
Voice
Touch / Multi-Touch Screens
Ambient Data (From Device, Location, etc)
Broadband Everywhere
Next-Generation Wireless Technologies
Fiber Optics
Connected Devices
Mobile (of Course)
Appliances
Home Entertainment Systems
Automobiles
Signs / Ambient Displays

31. Look how far we’ve come already
Touch-Screen Computers

32. Look how far we’ve come already
Touch / Multi-Touch Input & Large Screens

33. Look how far we’ve come already
Advanced, Touch-Enabled Smart Phones with Advanced
Web Content Support

34. Look how far we’ve come already
Cars, Appliances, TV’s... Oh My!

35. 35
All devices that contain screens
provide opportunities for user
experience design and development.
It’s not just about the “computer”
The coming years will introduce more advanced, network-connected
devices for both business and consumer use.
When web technology fuses with “legacy devices” such as
automobiles, appliances and televisions, great user experience design
is required to ensure adoption.

36. What RIA tool/technology to use?
Remember: RIAs are about user experience!
RIAs are NOT about Technology
Use the right technology to enable the optimum user
experience. Today, we need to start with design.
Pick the right tool for the right job (and team, and
client, etc)

37. 37
Financial Reporting Application

38. 38
Financial Reporting Application
Why Adobe Flex?
• Robust Flash Player / Handles 3-D GUI Fairly
Well
• Ability to use LiveCycle Data Services for Data
Management
• Integration with Web Services and SOA
• Easy Conversion to Desktop Client (Adobe
AIR) for speci c circumstances
• Development Team was Familiar with Flex
and Enterprise Portal Integration

39. Adobe Flex - Financial Reporting Application 39

40. Adobe Flex - Financial Reporting Application 40

41. Adobe Flex - Financial Reporting Application 41

42. Adobe Flex - Financial Reporting Application 42

43. Adobe Flex - Financial Reporting Application 43

44. Adobe Flex - Financial Reporting Application 44

45. Adobe Flex - Financial Reporting Application 45

46. Adobe Flex - Financial Reporting Application 46

47. Adobe Flex - Financial Reporting Application 47

48. Adobe Flex - Financial Reporting Application 48

49. 49
Video Player Application

50. 50
Video Player Application
Why Microsoft Silverlight?
• Robust Silverlight Player
• Strong Streaming Video Support
• Supported on both PC & Mac
• DRM Integration
• Interactive & Fast GUI
• Microsoft wanted to show off
Silverlight’s Capabilities

51. Microsoft Silverlight - Video Player Application 51

52. Microsoft Silverlight - Video Player Application 52

53. Microsoft Silverlight - Video Player Application 53

54. Microsoft Silverlight - Video Player Application 54

55. Microsoft Silverlight - Video Player Application 55

56. Microsoft Silverlight - Video Player Application 56

57. Microsoft Silverlight - Video Player Application 57

58. Microsoft Silverlight - Video Player Application 58

59. Microsoft Silverlight - Video Player Application 59

60. Microsoft Silverlight - Video Player Application 60

61. Microsoft Silverlight - Video Player Application 61

62. 62
&
Global, Enterprise Device
Troubleshooting Application

63. 63
Global, Enterprise Device Troubleshooting
Application
Why AJAX?
• Must be Internationalized at Runtime - Up to
140 Countries / 60 Languages
• Dynamic Visual Styling based on user, group
or other LDAP data
• Must Allow Web Page to Connect to Device
Connected via USB
• Must Front-End Siebel ERP System
• Many Different Deployments - One Code
Base
• Client Staff Must Support Application

64. Picking a Technology: Motorola MotoTools
“Real” solutions sometimes require a mixed-bag of tricks
Create a solution to the problem, don’t introduce problems because
of your solution!
MS Windows Only
IE
AJAX
ActiveX
Flash Content
Why?
Connect Device to Web Application using existing Windows-Only
Drivers

65. AJAX - Motorola Service & Repair Tools - Before 65

66. AJAX - Motorola Service & Repair Tools - Before 66

67. AJAX - Motorola Service & Repair Tools - Before 67

68. AJAX - Motorola Service & Repair Tools - Before 68

69. AJAX - Motorola Service & Repair Tools - Before 69

70. AJAX - Motorola Service & Repair Tools - Before 70

71. AJAX - Motorola Service & Repair Tools - Before 71

72. 72
You Get the Idea.
“Out of the Box” Siebel Interface
• Cumbersome
• Lots of Pop-Up Windows
• Requires a Lot of Training
• Designed around Data, Not Designed Around Users
• Culturally Insensitive?

73. 73
We Got an Idea!
Custom RIA to Replace the Siebel GUI
• Easy to Use Without a Lot of Training
• Responsive
• Connects Directly to Device(s)
• Internationalized
• Culturally Sensitive!

74. AJAX - Motorola Service & Repair Tools - After 74

75. AJAX - Motorola Service & Repair Tools - After 75

76. AJAX - Motorola Service & Repair Tools - After 76

77. AJAX - Motorola Service & Repair Tools - After 77

78. AJAX - Motorola Service & Repair Tools - After 78

79. AJAX - Motorola Service & Repair Tools - After 79

80. AJAX - Motorola Service & Repair Tools - After 80

81. AJAX - Motorola Service & Repair Tools - After 81

82. AJAX - Motorola Service & Repair Tools - After 82

83. AJAX - Motorola Service & Repair Tools - After 83

84. AJAX - Motorola Service & Repair Tools - After 84

85. AJAX - Motorola Service & Repair Tools - After 85

86. AJAX - Motorola Service & Repair Tools - After 86

87. AJAX - Motorola Service & Repair Tools - After 87

88. Enterprise Applications:
Are no longer Boring, Bad and Unused.
They have started to re ect the changes that have happened in the
consumer space:
Less Serious Feeling
More Visually Appealing
Easier to Understand
“Signposting” Design
Don’t have to feel monstrous, or overwhelming

89. The Challenges of Creating
Next-Generation Experiences
Building RIAs changes the way you work. A Great RIA design and development
team are different people than your traditional “Web” development or
“Desktop” development team.
Internal team – Enterprise product development, etc – Building stuff “for us”.
External team – Building stuff “for others” – Consulting / Pro services / design
shop
Your team make-up needs to change
Your process must change
Conceptual Designs
Prototyping
Lean on Iterative processes when at all possible

90. Hear what I’m saying?
What I am NOT saying
By 2010, all applications will be “Rich”, or will incorporate all
of these concepts.
What I AM saying
Your Future starts with your NEXT DESIGN. Don’t wait for
the future to leverage the best that User Experience can
offer. Put Experience First, and your application will have a
better chance at being #1 against the competition.

91. 91
Why Blur the Line when you
can Erase it?
Building a Bridge Between
Adobe AIR and Java
http://merapiproject.net

92. 92
What is Merapi?
Merapi is a bridge between applications written in Java and those running in
and created for Adobe AIR™ (Adobe Integrated Runtime™).
Merapi has been designed to run on a user's machine, along with an Adobe
AIR™application and provide a direct path between the Adobe AIR™
framework and Java, exposing the power and overall capabilities of the
user's operating system, including 3rd party hardware devices & software
services.

93. 93
Why Did We Create Merapi?
For Adobe AIR
To have access to the features of the Java
language and the myriad of Java libraries
For Java
To have access to the powerful user interface
framework available in Adobe Flex / AIR
applications

94. 94
How Did We Create Merapi?
Flex <-> Java
Communication on a local socket
using Adobe open source libraries
for AMF serialization

95. 95
Ways to Use Merapi
Connect an AIR™ application to any type of remote control that can
be connected to your desktop
Perform TWAIN Capturing of Video or Images from a camera or scanner
Use AIR™ to talk to a phone plugged in via USB
Connect Data on a Web page to virtually any desktop application
Connect an AIR application UI to a GPS device
Sending MIDI signals to instruments over a network using a Flex application
GUI running in the AIR framework
Create a new UI for a command-line Java application or Java
Interface of any type.
There are endless use cases on how Merapi can be used to erase the
line between the Web and the desktop.

96. 96
Q&A
dave meeker - roundarch - meekerd@gmail.com