Kevin Suttle is a Flash Platform UX Architect who has been working with Flash for over 5 years. In his presentation, he discusses the current "battle for platform supremacy" between Flash and HTML5. However, he argues that users just want great content and experiences, and both Flash and HTML5 are capable of providing that. He outlines many new user experience focused APIs in Flash Player 10.1 for touch, gestures, accessibility and more. He advocates for an approach of "mobilizing, not minimizing" applications to provide adaptive experiences across devices using Flash technologies like AIR.

1. The next Generation of
FLASH USER EXPERIENCE
{ Kevin Suttle
Flash Platform UX Architect }

2. Kevin Suttle
Flash Platform UX Architect
5 years of large-scale Flash Platform eLearning content
Featured author for InsideRIA
Tech Reviewer for O’Reilly’s Flex 4 Cookbook
Submitted close to 150 bugs/features for Flash CS5
“Most likely to break hearts” - My mom
I’m on the internet: kevinsuttle.com | @kevinSuttle

3. I wasn’t making that Flash thing up.

4. How I got into Flash:
I started out wanting to be a writer.
I changed my mind.
I got a degree in Electronic Media Communications
from the University of Cincinnati.
I loved digital art and photo manipulation, but it just kind of sat there.
I got into web design, and then met Flash.
I taught myself how to program.
I spend most of my time in
FLASH but I also know my way around FLEX.

5. Flash is at a crucial point
within the realm of
development technologies.
All of a sudden there are “sides”.

6. The Battle for
PLATFORM SUPREMACY

7. I don’t know if you’ve heard:
There’s a bit of news about an new standard - HTML5
Adobe HEARTS Apple but not the other way ‘round.
Apple has their own agenda, and that’s cool. I guess.

8. Smoke and mirrors
It wasn’t about performance
It wasn’t about plugin-architecture
It wasn’t about ubiquity
It wasn’t about devices
It was about competition
Glandul... ia... er... Apple’s JS framework

9. Let’s take a look
Sept 2000 - Flash Player 2 had a 95% average in USA,
CAN, EUR, ASIA, and South America

10. Open or closed
Flash Player is a standard. It’s been at 90+% for years.
Whether Steve likes it or not.

11. The thing is that consumers
don’t really care.
They just want their content,
or do they?

12. Yes, and no.
Users want content, but they
also want a great experience.
The iPhone and iPad are perfect examples.

13. Some users are
willing to only play Farmville
at home and have an iPhone.
They shouldn’t have to make a choice.

14. You’re all developers, right?
Think of it as encapsulation.
Push the button, watch it go.

15. HTML5? Flash? Obj-C?
Doesn’t matter.
...but of course I’m biased.

16. Why does there even
NEED to be a winner?
Can’t we all just get along?

17. The tech tabloids don’t help
because they’re businesses.
They have to make money,
and the internet is full of opinionated nerds.

18. Want to know who will win?
Well, good.
Because I was going to tell you anyway.

19. The platform that wins,
is the one that will provide the
most content through the
best experience.
You had to see that coming.

20. We’re Flash developers
Let’s make great Flash
experiences.
Or Flex. Whatever you want.

21. Worst-case scenario
We go back to ALL of the massive amounts of work
we had before Section 331 PLUS MOBILE.
Open Screen Project FTW

22. I work on what I like to think
are “translatable skills”.
User Experience
Information Architecture
Usability Engineering
Interaction Design
UI Construction
Jesse Freeman says that “Flash is dead”.
I’m just picking out what I’m wearing to the “funeral”.

23. What is
USER EXPERIENCE?
UX, IxD, IA, UI , ETC, HUH

24. “ User experience is the sum of
all your users' interactions
with your company,
its services,
and its products.
”
“User Experience As Corporate Imperative”
hesketh.com

25. The elements of
User Experience
according to Jesse James Garrett
Visual Design
Information Design
Interface design | Navigation design
Interaction Design | Information Architecture
Functional specs | Content requirements
User Needs in parallel to Site Objectives

27. The point is
UX spans all aspects of design
and development.
Let’s talk about both within Flash.

28. Design
CONSIDERATIONS
Pretty screens actually do require thinking.

29. Freedom in design is a
double-edged sword
for any platform.
Please use responsibly.

30. Let’s take a look
HTML/CSS - “Standardized” coding practices,
very loose control of display across browsers
Flash - Complete freedom of design and
development, but bad coding or lack of optimization
can lead to very poor performance

31. Design is
Platform Independent
Design is emotional, subconscious even.
Flash, HTML, Silverlight?
Doesn’t matter.

32. What is “cute?”

33. Disney’s Definition of Cute

34. Good designers play on our
emotions, but for good.

35. More keys to emotional design
Rule of thirds
http://en.wikipedia.org/wiki/Rule_of_thirds
Golden Ratio
http://en.wikipedia.org/wiki/Golden_ratio
Designing on a grid
http://960.gs

36. Development
APPROACHES
New APIs, tools and platforms

37. Freedom in development is also a
double-edged sword
for any platform.

38. Enter Flash Player 10.1
It’s only a dot release, right?

39. So much more
Geolocation IME
Gestures and Touch DRM
Accelerometer Globalization
Global Error Handling Printing
P2P/RMTFP Sampling
Sensors
My VERY unofficial count: a few hundred new APIs.

40. Multi-touch
Freeing Flash from the restraints of traditional mouse
and keyboard interaction.
Flash was always meant to be multi-touch

41. flash.system.Capabilities.touchscreenType
Specifies the type of touchscreen supported, if any.

42. There is a bit of a
misconception about
rollovers on touch screens.
You can TOTALLY do it.

43. flash.display.InteractiveObject.gesturePan
Dispatched when the user moves a point of contact
over the InteractiveObject instance on a touch-
enabled device (such as moving a fingers from left to
right over a display object on a mobile phone or
tablet with a touch screen). Some devices might
also interpret this contact as a mouseOver event and
as a touchOver event.

44. flash.display.InteractiveObject.gesturePressAndTap
Dispatched when the user creates a point of contact
with an InteractiveObject instance, then taps on a
touch-enabled device (such as placing several fingers
over a display object to open a menu and then taps
one finger to select a menu item on a mobile phone
or tablet with a touch screen). Some devices might
also interpret this contact as a combination of several
mouse events, as well.

45. flash.display.InteractiveObject.gesturePressAndTap
flash.display.InteractiveObject.gestureRotate
flash.display.InteractiveObject.gestureSwipe
flash.display.InteractiveObject.gestureTwoFingerTap
flash.display.InteractiveObject.gestureZoom
flash.display.InteractiveObject.touchBegin
flash.display.InteractiveObject.touchEnd
flash.display.InteractiveObject.touchMove
flash.display.InteractiveObject.touchOut
flash.display.InteractiveObject.touchOver
flash.display.InteractiveObject.touchRollOut
flash.display.InteractiveObject.touchRollOver
flash.display.InteractiveObject.touchTap
flash.display.Sprite.startTouchDrag
flash.display.Sprite.stopTouchDrag
flash.events.GesturePhase
flash.events.TouchEvent
flash.events.TransformGestureEvent
... and a TON more.

46. Accessibility
Not just a checkbox any more.

47. Accessibility in Flash
has pretty much been a nightmare for a long time.
... but it’s getting better.

48. flash.accessibility.ISearchableText
The ISearchableText interface can be implemented by
objects that contain text which should be searchable
on the web.

49. flash.accessibility.ISimpleTextSelection
The ISimpleTextSelection class can be used to add
support for the MSAA ISimpleTextSelection interface
to an AccessibilityImplementation.
If an AccessibilityImplementation subclass
implements the two getters in this class, a
screen reader such as JAWS can determine the text
selection range by calling them.

50. Flash Player Throttling
Before, all SWFs ran at the max frame rate,
even when invisible.

51. Two main throttling techniques
Is the SWF instance in a hidden tab?
Is the SWF instance scrolled out of view?

52. HIDDEN TAB DETECTION
Supported Browsers as of APRIL 2010
MAC - Webkit nightly (standalone .app)
WIN - IE7-8, Firefox 3.6
http://blog.kaourantin.net/?p=83

53. OUT OF VIEW DETECTION
Supported Browsers as of APRIL 2010
MAC - Safari 4, Webkit nightly (standalone .app),
Firefox 3.7 (standalone beta .app)
WIN - IE7-8
http://blog.kaourantin.net/?p=83

54. Supported Browsers as of APRIL 2010
Linux folks - Well, you’re going to have to wait.
It would require a LOT of overhauling
within Flash Player and Linux browsers.

55. Globalization API
The most under-hyped API in Flash.

56. UNDER-HYPED
Detects system locale properties to tailor:
Text language/orientation (RTL)
Date/Time
Currency formatting/parsing
Number formatting/parsing
String comparison for sorting or searching for text
Upper and lower case conversions

57. Private browsing mode (inside of Flash Player)
Supported in modern versions of
Chrome, IE and Firefox

58. Mobile-specific APIs
Handy tools for unpredictable runtimes.

59. Mobile text input
Detects if a physical keyboard is attached.
If not, a virtual native keyboard is displayed.

60. Graphics hardware acceleration on mobile
GPU-based vector renderer that replaces OEM software.

61. Supports many types of hardware rendering
Vector graphics
Bitmaps
3D effects
Filters/Shaders
Color transforms
Alpha transparency
Device/embedded text fonts
Saffron Type
and the cacheAsBitmap property

62. Disabled screensaver in fullscreen mode
if video or audio is not paused, stopped, or buffering.
Basically, it checks to see if there is volume.

63. Contextual
APPLICATIONS
Mobilizing, not minimizing

64. It’s not just the
desktop anymore.
... or even mobile handsets.

65. Design & development
are changing.
Adaptability is key now.

66. The data drives
everything.
Content will always be king.

67. Traditionally
multiple instances
had to be written.
One for desktop, mobile, tablets, TVs, etc.

68. Now we have
options for user interfaces
Native, or custom? It’s up to you.

69. We’re getting closer
to a “write once, deploy
everywhere” workflow.
... but it probably will never be that simple.

70. It’s more like
“write once, deploy to many.”
- Scott Janousek

71. Mobilize, not minimize
it’s all about context!

72. Don’t punish the user
for using a device or
platform that you forgot
or didn’t want to test for.

73. Don’t punish the user
by taking away or
diminishing features
based on end platforms.

74. Use the unique advantages
that each platform affords.

75. Enter AIR Mobile
powered by
Flash Player 10.1.
The beginning of the “full” mobile Flash explosion.

76. Enter litl OS
powered in part by a special build of
Flash Player 10.1, to drive the use of
Flash in the living room.
Web book, web-connected TV, multitouch remote
developer.litl.com

77. Flash can be used
virtually anywhere now.

78. It’s up to you,
both designers and developers, to
make the best experiences
with the Flash Platform.

79. The END
KevinSuttle.com
@kevinSuttle
{ Kevin Suttle
Flash Platform UX Architect }