Flash and Flex in an HTML5 / App Store world




Tuesday, October 4, 11
RJ Owen
                           Experience Planner
                           EffectiveUI
                           @rjowen
                                                     Tweeting this session?
                           rj.owen@effectiveui.com   Use the hashtag: #effectiveui


© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
© 2011 EffectiveUI, Inc.
                           .flickr.com/photos/mobilestreetlife/4179063482/
Tuesday, October 4, 11
© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Where is Flash going?




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Where has Flash been?
         Where has Flex been?




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Macromedia Flex 1-1.5 (2004, 2005)
          • Server-side technology
          • Rich component set for Flash
          • MXML / AS compiled to SWF on the
            server using a J2EE server
          • $15,000 per CPU (wikipedia)
                ???
          • Flex Data Services required


        Product Goal:
        Get Flash into Business




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Macromedia Flex 1-1.5 (2004, 2005)
          • Server-side technology
          • Rich component set for Flash
          • MXML / AS compiled to SWF on the
            server using a J2EE server
          • $15,000 per CPU (wikipedia)
          • Flex Data Services required


        Product Goal:
        Get Flash into Business




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Adobe Flex 2 (2006)

        • AS3
        • Eclipsed-based Flex Builder
        • Client-side compiling
        • Free compiler
        • Charting
        • Flex Data Services 2



        Product Goal:
        Get Flash to Developers
        Increase adoption in businesses




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Adobe Flex 3-3.5 (2008, 2009)

        • Open Source
        • Integration with CS product line
        • AIR
        • Profiling and refactoring in Builder



        Product Goal:
        Increase Adoption, Community
        Make Flex Builder a “real” product




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Adobe Flex 4 (2010)

        • “Design in Mind”
        • Spark
        • Catalyst Integration
        • FlexUnit integration
        • Improved profiler
        • Network monitor
        • TLF



          Product Goal:
          Improve UX
          Improve Enterprise tooling




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Adobe Flex 4.5 (2011)

        • Multi-Screen (Mobile!)
        • Builder enhancements to support
          enterprise, templating, etc.
        • More Spark
        • Spoon.as



        Product Goal:
        Mobile app development
        Improve Enterprise development




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
1       1.5   2      3           3.5     4       4.5

         Enterprise
                                 Developers

                                              AIR
                                                          Design
                                                                Mobile

© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Flex’s current trajectory: reverse-
         engineering the business plan
         Provide the tools required for
          enterprise-level workflows
         Marketed to Developers
         To solve a wide array of problems
         With good results




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Flex’s current trajectory: reverse-
         engineering the business plan
         Provide the tools required for        Enterprise
          enterprise-level workflows
         Marketed to Developers                Developers
         To solve a wide array of problems      Ubiquity
         With good results                       Design




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
2                                          11

         Vector
        Animation          Multimedia
                                        Apps
                                               Multi-touch
                                                   Mobile
                                                             3D

© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
1997 - 1999           Flash for animations on the web!

     2000 - 2008           Flash for interactive sites & multi-media
                           on lots of things, but mostly the web!

     2008-2010             Flash-based RIA applications for
                           desktop and web, plus everything
                           from before

    2010                   Flash-based mobile apps and
                           everything from before

     2011 and              Flash-based 3D games, native
     beyond                devices, and not everything from
                           before.
© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
So that Adobe can sell......
         Creative Suite
           part of $2Billion creative solutions
            revenue 2010, 54% of total revenue
            (#1 source)
         LiveCycle
           part of $355M in Digital Enterprise
            Solutions revenue 2010, 9% of total
            revenue (#3 source)
source: adobe.com/aboutadobe/invrelations/financialdocs.html
© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Where will this take Flex and the Flash
         Platform in a post-HTML5 / post-
         Native App world?




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
I put this question to the Quora
         community:
         “What are the best reasons to learn Flash in an HTML5
         web and native app world?”
         Answers:
         Consistent Experience (browser issues)
         Get to market quicker
         Single technology to focus on
         Faster ROI
         Core OOP education
         and more.



© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
That’s a great start. Here’s what I think.

         Flash is and will continue to be valuable
         for....




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
1. Enterprise
© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Enterprise Requirements
         Client-Server integration
         OO languages
         Developer toolsets
         Mature languages
         Code generation
         Best-practices
         Bigger logos


© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Java :: Enterprise Back-End
                           Flex :: Enterprise Front-End




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
2. Multi-Screen Development
© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Same content, multiple screens
         iOS, BlackBerry, Android, WP7, and counting....




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Approaches to multi-screen:
         Web-only
         Multiple native applications
           (avoid multi-screen ubiquity altogether)
         HTML5 app cache
         PhoneGap
         Sencha
         Titanium
         AIR mobile

© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Multi-screen application development
                           represents the best business case for Flex.

                           Flex is an easy technology for multi-screen
                           application development.

                           AIR is the future of the Flash platform for
                           consumer applications.


© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
3. Community
© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
SpringAS                  Signals         Flight
 Swiz                      asmock          FlexLib
 Mate                      as3corelib      Jest
 Parsley                   as3crypto       Ribbit
 PureMVC                   as3awss3lib     TweenLite
 Robotlegs                 Away3D          Tweener
 tinyTLF                   PaperVision3D   Merapi
 Spoon.as                  FCSS            WOW 3D
 hamcrest-as3              Degrafa         as3youtubelib
 SwiftSuspenders           Reflex          as3syndicationlib
 FlexUnit                  Stealth         FZip


© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
4. Video & Audio
Tuesday, October 4, 11
Ogg Theora   H.264   WebM

            IE9/IE10                             Manual Install

            Firefox

            Chrome

            Safari

            Mobile Safari

            Opera



© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Ogg Theora   H.264   WebM


   BROWSER  IE9

            Firefox
                                                 Manual Install




INCOMPATIBILITY
            Chrome

            Safari

            Mobile Safari

            Opera               FAIL
© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Flash   FMS 4.5

            IE9/IE10

            IE10 tablet

            Firefox

            Chrome

            Safari

            Mobile Safari

            Opera



© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
HTML5 video lacks the ability to “secure the
         content, handle reporting for our advertisers,
         to...ensure premium visual quality, communicate
         back with the server to determine how long to
         buffer and what bit-rate to stream, and dozens of
         other things that aren’t necessarily visible to the
         end user.”
                                - Hulu
                                gizmodo.com/#!5538264/hulu-says-html5-isnt-ready-yet




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
“HTML5 Video doesn’t have a viable
                           DRM solution at this point.”
                                          - Netflix
                                          gigaom.com/video/netflix-no-plans-for-html5-video/




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
You have to choose two encoding techs -
                           Flash will be one.

                           Flash is still the only viable choice for
                           delivering protected and controlled video
                           and audio content on the web.

                           Multimedia streaming and DRM are Flash’s
                           strongest hold and future on the web.


© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
5. Games
© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Flash is a vector engine built for animation.
         and has a rich history in gaming.




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
HTML5 games are okay, getting better
         Canvas tag makes things flexible
         Promising platforms like ImpactJS
          starting to appear




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Why move from HTML5 to Flash?
         Browser support is spotty at best
         Performance isn’t up to par
         There is no FGL for html5 games
         Source: blog.tametick.com/2011/01/why-im-moving-from-html5-to-flash.html




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
“Is html5 the future? I sure hope so!
                           Unfortunately, it isn’t the present.”
                                                - TameTick.com
                                                blog.tametick.com/2011/01/why-im-moving-from-html5-to-flash.html




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Flash faces increasing competition from
                           other platforms in the gaming world.

                           AIR is a powerful platform for distributing
                           games to multiple platforms

                           Flash has a deep history in the gaming
                           community


© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
6. Translating Interaction
© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
(Don Norman’s) Experience Design
        Vocabulary
           Visibility
           Affordances
           Feedback
           Mapping
           Constraint
           Consistency




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
VISIBILITY
     Perceiving interactive elements

     AFFORDANCES
     Understanding interactive elements

     FEEDBACK
     Knowing how your actions impact the system

     MAPPING
     How well the interface reflects your understanding of the system

     CONSTRAINTS
     Preventing errors in the system

     CONSISTENCY
     Objects that appear the same function the same

© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
VISIBILITY              COMPONENT SET
     Perceiving interactive elements

     AFFORDANCES             COMPONENT SET
     Understanding interactive elements

     FEEDBACK                EVENT MODEL
     Knowing how your actions impact the system

     MAPPING                 CUSTOM CONTROLS & LAYOUTS
     How well the interface reflects your understanding of the system

     CONSTRAINTS             VALIDATION & ERROR HANDLING
     Preventing errors in the system

     CONSISTENCY             CLASS-BASED VISUAL ARCHITECTURE
     Objects that appear the same function the same

© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
HTML mark-up is SEMANTIC
         MXML mark-up is VISUAL
          Semantic mark-up is good for applying
           multiple views to a single data-
           structure and require external visual
           descriptors (CSS.)

          Visual mark-up is good for defining an
           explicit visual representation of an
           external data object, semantic or
           otherwise.

© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Places Flash is and will be weaker
         than HTML5




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Accessibility
© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Search Engine Optimization
© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Web-sites
© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
The browser was made for semantic
         mark-up.
         Flash locks site content in a layer of
         abstraction.
         Abstraction allows for generalization,
          ubiquity, and re-use.

         Specificity allows for customization,
          perfection, and speed - an experience
          highly-tailored for each specific
          medium.


© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Places Flash is and will be weaker
         than Native*



         *probably.


© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Performance
© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Size
© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Consistency
© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
© 2011 EffectiveUI, Inc.   colinharman.com/portfolio/how-would-you-like-your-graphic-design/
Tuesday, October 4, 11
Software is about balance
                           Consistency Performance Abstraction
                           Ubiquity    Memory      Specificity




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
FEATURES                SPEED
                                  AIR
                                 MOBILE   NATIVE
                                 FLASH
                                 PLAYER



                                           HTML5




                           UBIQUITY                SIZE


© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Flash is:
         Enterprise tools (but platform?)
         Multiple-platforms as installed apps for
          desktop or mobile
         Multimedia with DRM




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Native apps are:
         Best experience possible on any given device




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
HTML5 / CSS3 / JS is:
         The language of the web




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Take aways:
         Flex has a strong future.
         It looks different than its past.

         HTML has a strong future.
         It looks different than its past and Flash’s past.

         Native apps have a strong future.
         Mobile + App stores are highly disruptive.

© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
There’s one final case for Flash I
         left out......




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
7. Pushing Boundaries
© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
Thanks!                Fill out your surveys to win
                                books.
                                Come by the EffectiveUI
                                booth.
                                Other great sessions:
                                Tues 1:00pm:   From Pixar to Ramayana: The Art of
      RJ Owen                                  Graphic Storytelling with Sanjay Patel
      EffectiveUI               Tues 2:30pm:   HTML5 Semantic Web

                                Tues 4:00pm:   Flash Platform Roadmap
      @rjowen
      rj.owen@effectiveui.com   Weds 8:00am:   Practical Mobile Development
                                               with Flex and Adobe AIR



© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11
This slide intentionally left blank.




© 2011 EffectiveUI, Inc.



Tuesday, October 4, 11

More Related Content

PDF
Jax 2011 keynote
PDF
Breizh camp adobe flex et les mobiles
PDF
Devoxx 2010: Develop mobile applications with Flex
PDF
Reasons for Flash: Flash Development in an HTML5 and App Store World
PDF
The future of the Adobe Flash platform
PPTX
HTML5 / Mobile Web
PDF
Jax2001 adobe keynote
PPTX
HTML5 - The Future in a Flash
Jax 2011 keynote
Breizh camp adobe flex et les mobiles
Devoxx 2010: Develop mobile applications with Flex
Reasons for Flash: Flash Development in an HTML5 and App Store World
The future of the Adobe Flash platform
HTML5 / Mobile Web
Jax2001 adobe keynote
HTML5 - The Future in a Flash

What's hot (20)

PDF
Adobe flex at jax london 2011
PDF
Fatc - Productivity by Design
PDF
Montpellier - Flex UG
PDF
Best practices for Flash applications on mobile devices
PDF
Using design pattern for mobile
PDF
Flex mobile for JUG
PDF
Adobe AIR Mobile development for Android and PlayBook
PDF
Xplatform mobile development
PDF
Creating Mobile Content Using Flash
PDF
What's New in IBM Web Experience Factory
PDF
Over the air 2.5 - Adobe AIR for Android
PDF
Making flash work on iPhone & iPad April 2011
PDF
Open source, commercial or a co-existance strategy
PPT
Flash: A call for sanity
PDF
Adobe gaming flash gamm michael
PDF
Android Development with Flash Platform
PDF
Innovation and the Adobe Flash Platform
PDF
Adobe Flash platform の法人利用
PPTX
Should you say no to HTML5?
PPT
Appcelerator mobile. the doppelgänger to XPages
Adobe flex at jax london 2011
Fatc - Productivity by Design
Montpellier - Flex UG
Best practices for Flash applications on mobile devices
Using design pattern for mobile
Flex mobile for JUG
Adobe AIR Mobile development for Android and PlayBook
Xplatform mobile development
Creating Mobile Content Using Flash
What's New in IBM Web Experience Factory
Over the air 2.5 - Adobe AIR for Android
Making flash work on iPhone & iPad April 2011
Open source, commercial or a co-existance strategy
Flash: A call for sanity
Adobe gaming flash gamm michael
Android Development with Flash Platform
Innovation and the Adobe Flash Platform
Adobe Flash platform の法人利用
Should you say no to HTML5?
Appcelerator mobile. the doppelgänger to XPages
Ad

Viewers also liked (20)

PPT
Laterooms Partner Programme
DOC
گیاهان در قرآن
PPT
Itineraris 4rt eso
PPT
Conventions and forms new
PPTX
Social development theory
PDF
Metodologia integratzeko teknologiak_haur_hezk
PDF
PDF
PPT
Eing 4006 part 1
PPT
Tomorrow's Nutrition
PPTX
Eex service learning
PDF
SunGard 2010 Compliance Summit: Keynote speech
PPT
An Opinionated Introduction to Mate
ZIP
Tedx rawariver - prezentacje - marek wyleżoł
PPT
Introduction to japan
KEY
Today's job market
PDF
Windows7poker
PPT
Boots and Macmillan: working together to improve the lives of everyone living...
PDF
Retoucheren
PPT
Peoples and empires #3
Laterooms Partner Programme
گیاهان در قرآن
Itineraris 4rt eso
Conventions and forms new
Social development theory
Metodologia integratzeko teknologiak_haur_hezk
Eing 4006 part 1
Tomorrow's Nutrition
Eex service learning
SunGard 2010 Compliance Summit: Keynote speech
An Opinionated Introduction to Mate
Tedx rawariver - prezentacje - marek wyleżoł
Introduction to japan
Today's job market
Windows7poker
Boots and Macmillan: working together to improve the lives of everyone living...
Retoucheren
Peoples and empires #3
Ad

Similar to Flash and Flex in an HTML5 / App Store World (20)

PPTX
Starting mobile development
KEY
Flash dead ?
PPTX
Practical Design and Development with Flash on Mobile and Devices
PDF
Flash camp portugal - Let's talk about Flex baby
PDF
Max 2010: Having Fun Flex4 Layouts
PDF
Why is flutter mobile app development mostly recommended for your business
PDF
How has the flutter become the game changer in recent years for mobile app de...
PPTX
W-JAX Keynote 2010
PDF
Adobe et la stratégie multi-écrans
PPTX
Software Tools Overview
PPT
Adobeflex(2)
PDF
Mobile HTML5 Web Apps - Codemotion 2012
PDF
Download full ebook of Flex on Java Bernerd Allmon instant download pdf
PPTX
Mobile Apps using Flex and ColdFusion
PPTX
David Evans - EmMeCon Seattle 2013
PPTX
What's New with Perfecto? - April 2017
PDF
CodeMorphic at MinneWebCon 2010
PDF
Flex 4.5 and mobile development
PDF
8 Reasons Why Flutter is the Future of Mobile App Development
PDF
React Native Vs. Flutter Vs. Ionic: Which Is the Best Cross-Platform Framework?
Starting mobile development
Flash dead ?
Practical Design and Development with Flash on Mobile and Devices
Flash camp portugal - Let's talk about Flex baby
Max 2010: Having Fun Flex4 Layouts
Why is flutter mobile app development mostly recommended for your business
How has the flutter become the game changer in recent years for mobile app de...
W-JAX Keynote 2010
Adobe et la stratégie multi-écrans
Software Tools Overview
Adobeflex(2)
Mobile HTML5 Web Apps - Codemotion 2012
Download full ebook of Flex on Java Bernerd Allmon instant download pdf
Mobile Apps using Flex and ColdFusion
David Evans - EmMeCon Seattle 2013
What's New with Perfecto? - April 2017
CodeMorphic at MinneWebCon 2010
Flex 4.5 and mobile development
8 Reasons Why Flutter is the Future of Mobile App Development
React Native Vs. Flutter Vs. Ionic: Which Is the Best Cross-Platform Framework?

More from EffectiveUI (20)

PDF
Design essentials For Executives
PDF
Designing an App: From Idea to Market
PPT
Design Essentials for Developers 08.31.11
PDF
Flex4 Component Lifecycle
PDF
The Art of Interaction
PPT
Design Essentials for Developers
PDF
Rails on HBase
PDF
Git for the Android Developer
PDF
Microsoft Kinect and Molehill
KEY
Discombobulation, Fire-Breathing Dragons and Wet Noodles: Creating Productive...
PPT
Design Essentials for Developers
PDF
Your Mom Has an iPad
PDF
Human-Centered Design and the Intersection of the Physical and Digital Worlds
PDF
From the Trenches: Building the Accessible Web
PDF
Flexerific Visual Effects
PPT
Test-Driven Development
PDF
Diving Deep with the Flex Component Life Cycle
PPT
Flex 360 Rules Engine
PPT
Flex 4 Deep Dive
PPT
Accessibility in Flex
Design essentials For Executives
Designing an App: From Idea to Market
Design Essentials for Developers 08.31.11
Flex4 Component Lifecycle
The Art of Interaction
Design Essentials for Developers
Rails on HBase
Git for the Android Developer
Microsoft Kinect and Molehill
Discombobulation, Fire-Breathing Dragons and Wet Noodles: Creating Productive...
Design Essentials for Developers
Your Mom Has an iPad
Human-Centered Design and the Intersection of the Physical and Digital Worlds
From the Trenches: Building the Accessible Web
Flexerific Visual Effects
Test-Driven Development
Diving Deep with the Flex Component Life Cycle
Flex 360 Rules Engine
Flex 4 Deep Dive
Accessibility in Flex

Recently uploaded (20)

PDF
CXOs-Are-you-still-doing-manual-DevOps-in-the-age-of-AI.pdf
PPTX
Rise of the Digital Control Grid Zeee Media and Hope and Tivon FTWProject.com
PDF
AI.gov: A Trojan Horse in the Age of Artificial Intelligence
PDF
Data Virtualization in Action: Scaling APIs and Apps with FME
PDF
Streamline Vulnerability Management From Minimal Images to SBOMs
PDF
zbrain.ai-Scope Key Metrics Configuration and Best Practices.pdf
PDF
Transform-Your-Factory-with-AI-Driven-Quality-Engineering.pdf
PDF
Examining Bias in AI Generated News Content.pdf
PDF
The-Future-of-Automotive-Quality-is-Here-AI-Driven-Engineering.pdf
PDF
Lung cancer patients survival prediction using outlier detection and optimize...
PDF
A hybrid framework for wild animal classification using fine-tuned DenseNet12...
PPTX
Presentation - Principles of Instructional Design.pptx
PDF
substrate PowerPoint Presentation basic one
PDF
Build Real-Time ML Apps with Python, Feast & NoSQL
PDF
The-2025-Engineering-Revolution-AI-Quality-and-DevOps-Convergence.pdf
PDF
Introduction to MCP and A2A Protocols: Enabling Agent Communication
PDF
A symptom-driven medical diagnosis support model based on machine learning te...
PDF
IT-ITes Industry bjjbnkmkhkhknbmhkhmjhjkhj
PDF
Co-training pseudo-labeling for text classification with support vector machi...
PDF
Rapid Prototyping: A lecture on prototyping techniques for interface design
CXOs-Are-you-still-doing-manual-DevOps-in-the-age-of-AI.pdf
Rise of the Digital Control Grid Zeee Media and Hope and Tivon FTWProject.com
AI.gov: A Trojan Horse in the Age of Artificial Intelligence
Data Virtualization in Action: Scaling APIs and Apps with FME
Streamline Vulnerability Management From Minimal Images to SBOMs
zbrain.ai-Scope Key Metrics Configuration and Best Practices.pdf
Transform-Your-Factory-with-AI-Driven-Quality-Engineering.pdf
Examining Bias in AI Generated News Content.pdf
The-Future-of-Automotive-Quality-is-Here-AI-Driven-Engineering.pdf
Lung cancer patients survival prediction using outlier detection and optimize...
A hybrid framework for wild animal classification using fine-tuned DenseNet12...
Presentation - Principles of Instructional Design.pptx
substrate PowerPoint Presentation basic one
Build Real-Time ML Apps with Python, Feast & NoSQL
The-2025-Engineering-Revolution-AI-Quality-and-DevOps-Convergence.pdf
Introduction to MCP and A2A Protocols: Enabling Agent Communication
A symptom-driven medical diagnosis support model based on machine learning te...
IT-ITes Industry bjjbnkmkhkhknbmhkhmjhjkhj
Co-training pseudo-labeling for text classification with support vector machi...
Rapid Prototyping: A lecture on prototyping techniques for interface design

Flash and Flex in an HTML5 / App Store World

  • 1. Flash and Flex in an HTML5 / App Store world Tuesday, October 4, 11
  • 2. RJ Owen Experience Planner EffectiveUI @rjowen Tweeting this session? [email protected] Use the hashtag: #effectiveui © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 3. © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 4. © 2011 EffectiveUI, Inc. .flickr.com/photos/mobilestreetlife/4179063482/ Tuesday, October 4, 11
  • 5. © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 6. Where is Flash going? © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 7. Where has Flash been? Where has Flex been? © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 8. Macromedia Flex 1-1.5 (2004, 2005) • Server-side technology • Rich component set for Flash • MXML / AS compiled to SWF on the server using a J2EE server • $15,000 per CPU (wikipedia) ??? • Flex Data Services required Product Goal: Get Flash into Business © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 9. Macromedia Flex 1-1.5 (2004, 2005) • Server-side technology • Rich component set for Flash • MXML / AS compiled to SWF on the server using a J2EE server • $15,000 per CPU (wikipedia) • Flex Data Services required Product Goal: Get Flash into Business © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 10. Adobe Flex 2 (2006) • AS3 • Eclipsed-based Flex Builder • Client-side compiling • Free compiler • Charting • Flex Data Services 2 Product Goal: Get Flash to Developers Increase adoption in businesses © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 11. Adobe Flex 3-3.5 (2008, 2009) • Open Source • Integration with CS product line • AIR • Profiling and refactoring in Builder Product Goal: Increase Adoption, Community Make Flex Builder a “real” product © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 12. Adobe Flex 4 (2010) • “Design in Mind” • Spark • Catalyst Integration • FlexUnit integration • Improved profiler • Network monitor • TLF Product Goal: Improve UX Improve Enterprise tooling © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 13. Adobe Flex 4.5 (2011) • Multi-Screen (Mobile!) • Builder enhancements to support enterprise, templating, etc. • More Spark • Spoon.as Product Goal: Mobile app development Improve Enterprise development © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 14. 1 1.5 2 3 3.5 4 4.5 Enterprise Developers AIR Design Mobile © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 15. Flex’s current trajectory: reverse- engineering the business plan Provide the tools required for enterprise-level workflows Marketed to Developers To solve a wide array of problems With good results © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 16. Flex’s current trajectory: reverse- engineering the business plan Provide the tools required for Enterprise enterprise-level workflows Marketed to Developers Developers To solve a wide array of problems Ubiquity With good results Design © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 17. 2 11 Vector Animation Multimedia Apps Multi-touch Mobile 3D © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 18. 1997 - 1999 Flash for animations on the web! 2000 - 2008 Flash for interactive sites & multi-media on lots of things, but mostly the web! 2008-2010 Flash-based RIA applications for desktop and web, plus everything from before 2010 Flash-based mobile apps and everything from before 2011 and Flash-based 3D games, native beyond devices, and not everything from before. © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 19. So that Adobe can sell...... Creative Suite part of $2Billion creative solutions revenue 2010, 54% of total revenue (#1 source) LiveCycle part of $355M in Digital Enterprise Solutions revenue 2010, 9% of total revenue (#3 source) source: adobe.com/aboutadobe/invrelations/financialdocs.html © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 20. Where will this take Flex and the Flash Platform in a post-HTML5 / post- Native App world? © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 21. I put this question to the Quora community: “What are the best reasons to learn Flash in an HTML5 web and native app world?” Answers: Consistent Experience (browser issues) Get to market quicker Single technology to focus on Faster ROI Core OOP education and more. © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 22. That’s a great start. Here’s what I think. Flash is and will continue to be valuable for.... © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 23. 1. Enterprise © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 24. Enterprise Requirements Client-Server integration OO languages Developer toolsets Mature languages Code generation Best-practices Bigger logos © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 25. Java :: Enterprise Back-End Flex :: Enterprise Front-End © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 26. © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 27. 2. Multi-Screen Development © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 28. Same content, multiple screens iOS, BlackBerry, Android, WP7, and counting.... © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 29. Approaches to multi-screen: Web-only Multiple native applications (avoid multi-screen ubiquity altogether) HTML5 app cache PhoneGap Sencha Titanium AIR mobile © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 30. Multi-screen application development represents the best business case for Flex. Flex is an easy technology for multi-screen application development. AIR is the future of the Flash platform for consumer applications. © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 31. 3. Community © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 32. SpringAS Signals Flight Swiz asmock FlexLib Mate as3corelib Jest Parsley as3crypto Ribbit PureMVC as3awss3lib TweenLite Robotlegs Away3D Tweener tinyTLF PaperVision3D Merapi Spoon.as FCSS WOW 3D hamcrest-as3 Degrafa as3youtubelib SwiftSuspenders Reflex as3syndicationlib FlexUnit Stealth FZip © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 33. 4. Video & Audio Tuesday, October 4, 11
  • 34. Ogg Theora H.264 WebM IE9/IE10 Manual Install Firefox Chrome Safari Mobile Safari Opera © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 35. Ogg Theora H.264 WebM BROWSER IE9 Firefox Manual Install INCOMPATIBILITY Chrome Safari Mobile Safari Opera FAIL © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 36. Flash FMS 4.5 IE9/IE10 IE10 tablet Firefox Chrome Safari Mobile Safari Opera © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 37. HTML5 video lacks the ability to “secure the content, handle reporting for our advertisers, to...ensure premium visual quality, communicate back with the server to determine how long to buffer and what bit-rate to stream, and dozens of other things that aren’t necessarily visible to the end user.” - Hulu gizmodo.com/#!5538264/hulu-says-html5-isnt-ready-yet © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 38. “HTML5 Video doesn’t have a viable DRM solution at this point.” - Netflix gigaom.com/video/netflix-no-plans-for-html5-video/ © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 39. You have to choose two encoding techs - Flash will be one. Flash is still the only viable choice for delivering protected and controlled video and audio content on the web. Multimedia streaming and DRM are Flash’s strongest hold and future on the web. © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 40. 5. Games © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 41. Flash is a vector engine built for animation. and has a rich history in gaming. © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 42. HTML5 games are okay, getting better Canvas tag makes things flexible Promising platforms like ImpactJS starting to appear © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 43. Why move from HTML5 to Flash? Browser support is spotty at best Performance isn’t up to par There is no FGL for html5 games Source: blog.tametick.com/2011/01/why-im-moving-from-html5-to-flash.html © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 44. “Is html5 the future? I sure hope so! Unfortunately, it isn’t the present.” - TameTick.com blog.tametick.com/2011/01/why-im-moving-from-html5-to-flash.html © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 45. © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 46. © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 47. Flash faces increasing competition from other platforms in the gaming world. AIR is a powerful platform for distributing games to multiple platforms Flash has a deep history in the gaming community © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 48. 6. Translating Interaction © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 49. (Don Norman’s) Experience Design Vocabulary Visibility Affordances Feedback Mapping Constraint Consistency © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 50. VISIBILITY Perceiving interactive elements AFFORDANCES Understanding interactive elements FEEDBACK Knowing how your actions impact the system MAPPING How well the interface reflects your understanding of the system CONSTRAINTS Preventing errors in the system CONSISTENCY Objects that appear the same function the same © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 51. VISIBILITY COMPONENT SET Perceiving interactive elements AFFORDANCES COMPONENT SET Understanding interactive elements FEEDBACK EVENT MODEL Knowing how your actions impact the system MAPPING CUSTOM CONTROLS & LAYOUTS How well the interface reflects your understanding of the system CONSTRAINTS VALIDATION & ERROR HANDLING Preventing errors in the system CONSISTENCY CLASS-BASED VISUAL ARCHITECTURE Objects that appear the same function the same © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 52. HTML mark-up is SEMANTIC MXML mark-up is VISUAL Semantic mark-up is good for applying multiple views to a single data- structure and require external visual descriptors (CSS.) Visual mark-up is good for defining an explicit visual representation of an external data object, semantic or otherwise. © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 53. Places Flash is and will be weaker than HTML5 © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 54. Accessibility © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 55. Search Engine Optimization © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 56. Web-sites © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 57. The browser was made for semantic mark-up. Flash locks site content in a layer of abstraction. Abstraction allows for generalization, ubiquity, and re-use. Specificity allows for customization, perfection, and speed - an experience highly-tailored for each specific medium. © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 58. Places Flash is and will be weaker than Native* *probably. © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 59. Performance © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 60. Size © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 61. Consistency © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 62. © 2011 EffectiveUI, Inc. colinharman.com/portfolio/how-would-you-like-your-graphic-design/ Tuesday, October 4, 11
  • 63. Software is about balance Consistency Performance Abstraction Ubiquity Memory Specificity © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 64. FEATURES SPEED AIR MOBILE NATIVE FLASH PLAYER HTML5 UBIQUITY SIZE © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 65. Flash is: Enterprise tools (but platform?) Multiple-platforms as installed apps for desktop or mobile Multimedia with DRM © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 66. Native apps are: Best experience possible on any given device © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 67. HTML5 / CSS3 / JS is: The language of the web © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 68. Take aways: Flex has a strong future. It looks different than its past. HTML has a strong future. It looks different than its past and Flash’s past. Native apps have a strong future. Mobile + App stores are highly disruptive. © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 69. There’s one final case for Flash I left out...... © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 70. 7. Pushing Boundaries © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 71. © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 72. © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 73. Thanks! Fill out your surveys to win books. Come by the EffectiveUI booth. Other great sessions: Tues 1:00pm: From Pixar to Ramayana: The Art of RJ Owen Graphic Storytelling with Sanjay Patel EffectiveUI Tues 2:30pm: HTML5 Semantic Web Tues 4:00pm: Flash Platform Roadmap @rjowen [email protected] Weds 8:00am: Practical Mobile Development with Flex and Adobe AIR © 2011 EffectiveUI, Inc. Tuesday, October 4, 11
  • 74. This slide intentionally left blank. © 2011 EffectiveUI, Inc. Tuesday, October 4, 11