November 17, 2010

Keynote (RIA Unleashed: Boston 2010)

Keynote by Ryan Stewart and Terry Ryan

Flash has seen a rise in competition: Silverlight, Java FX, JS/HTML

Flash adoption is getting faster. To get penetration from 0 - 80%


  • Flash Player 8 = 12 months

  • Flash Player 9 = 11 months

  • Flash Player 10 = 6 months

  • Flash Player 10.1 = 74% in 3 months


Flash is showing up on more and different devices every day. Truly becoming a multiscreen platform. All walks of technology want Flash.

Flash is responding with device centric features like: accelerometers, GPS, multi-touch, and virtual keyboards.

Adobe is enabling you to use your Flash skills while tailoring the experience to use each devices unique capabilities.

Flash focusing on performance enhancements like: optimized garbage collection, JIT improvements, audio/video hardware acceleration, and AS2 optimizations.

Important to remember that content written for desktop won't run out of the box on the TV or mobile. Currently can target mobile using Flash in the browser or writing native applications.

Flash showcase for mobile at http://m.flash.com/.

Flash 10.1 is currently on 2 million devices and should be on 10 million by the end of the year.

Juniper Research says the mobile application market will be worth $25 billion in 5 years.

Blackberry is a whole new idea because native development is done in AIR, default applications are all AIR, and AIR runs the UI.

For multiscreen development, write once run anywhere isn't the case. Need to make changes based on UI and device.

Flash CS5 has added templates and packages for Android and iOS.

Flash Builder Burrito includes templates for Android, Flex mobile components, deployment and package tools, and on device debugging (deployments are over USB and debugging is over Wifi).

For front end development, Flex SDK "Hero" adds a mobile framework with views and view navigator and mobile optimized components, while Flex Builder "Burrito" adds mobile projects, debugging for mobile, publishing for mobile, and multiscreen testing.

For back end development, ColdFusion 9 gives you ORM, CFScript, and Flash Remoting, while ColdFusion Builder has extensions, and an IDE that works great.

ColdFusion Builder Storm gives you: code editing with better code folding, better code assist, better code formatting (with customizable preferences), better search, and better find and replace, while the new extensions offers more server data, extensions in views (instead of modal boxes), extensions code assist, and extensions custom keys.

Flash is making is easier to create games with native game controller support and new 3D APIs (code name Molehill) that can target DirectX and OpenGL to fully render on the GPU.

Multimedia improvements for Flash include StageVideo which is a new way to display video that offloads entirely to GPU which cuts down on CPU usage and battery drain.

Message of the day: It is a great time to be a Flash Developer!

Tags: adobe flash flex riaunleashedboston2010

November 17, 2010

Adding 3D to Your Arsenal (RIA Unleashed: Boston 2010)

Adding 3D to Your Arsenal by Charlie Schulze

Can find a bunch of information on his blog at papervision2.com. Working on redoing site with Away3D examples as almost everything is Papervision3D focused at this point.

Talk is more about how to add 3D to your application than how to do 3D modeling.

Good uses for 3D


  • Games - Redbull / Farmville

  • Enhancements to entertainment, automotive, educational sites

  • It's just the spice not the main course

Bad Uses


  • Games that should just be 2D

  • Text and content heavy sites

  • AmericanExpress.com

What is easy


  • Getting started

  • Creating rich and compelling 3D experiences

  • Moving into more advanced aspects of the 3D engines

What isn't easy


  • Performance tweaks

  • General optimization

  • Advanced mathematics
  • Two main engines are Papervision3D and Away3D. Right now Away3D is planning to have better support for Molehill. Speaker has found Away3D to be more optimized (especially if you can target Flash Player 10) and robust, so if he had to pick would go with that, even though he has mostly used Papervision3D.

    Both engines follow the same format of creating a view, renderer, scene, objects with materials, and a camera. Besides a few syntax differences the majority of your code will be the same regardless of which engine you are using.

    One gotcha is that in Away3D by default planes lay flat, need to change that otherwise it is hard to see anything.

    Likes TweenMax for all his tweening.

    Working with 3D models is hard. They really need to be optimized for the engine you are working with.

    Tags: 3d api flash riaunleashedboston2010

June 27, 2010

Firefox 3.6.4 and Flash Debugging

After getting the latest update to Firefox (3.6.4) yesterday, when I was debugging some Flash code this morning, my debugging session got disconnected in the middle of looking at some variables. Returning to Firefox I was greeted with the following:

This was the new plugin crash detector. Only problem was I didn't want it to kick in while I was debugging. Thankfully a little searching on the net turned up a solution. Through Firefox's "about:config" mechanism you can disable crash detection for certain plugins. In my case Flash is NPSWF32.DLL. Flipping the "dom.ipc.plugins.enabled.npswf32.dll" property to false fixed the issue:

Tags: debugging firefox flash

May 23, 2010

FLA version reporting?

With the release of Flash CS5 we have an issue that some files we distribute to customers need to be saved as Flash CS4 compatible. I'm looking for a cross-platform utility that I can easily call from Ant that will report the Flash version that an FLA file was saved as. The goal being to add a source control hook that prevents an FLA in the wrong version from being checked in. Anyone know of such a tool?

Tags: fla flash tool version

March 30, 2010

The Company of Myself

If you are a fan of Braid, The Company of Myself is an awesome little Flash game that uses the replay your actions concept very well.

Tags: flash game

November 22, 2009

Keynote (RIA Unleashed: Boston 2009)

Ryan Steward

Three trends being focused on right now:
Rich Internet Application which Adobe have been doing for a long time.
Cloud Computing is coming to the forefront. Have your data available anywhere. SoA is becoming the norm. Clean separation between front-end and back-end.
Desktop and Devices making the experience available everywhere.

All rolled into contextual applications. Applications where and how your users want them.

finetune.com example of contextual applications. Explore with the traditional browser, then use desktop specific application, iPhone version, and Wii specific version.

Take advantage of device specific features.
Move data and state between contexts.

New runtime support:

Flash Player 10.1 geared for smart phones. Approximate 60% memory reduction with no code changes. Better battery performance.

AIR 2.0 extending ability to leverage native code. Native installer and application support.

Code an application in Flash CS5 and run it natively on iPhone.

New tooling support:

Flash Catalyst is all about designer having more control over UI without touching Flex.

Flex 4 is all about separating logic and look. Components based on states and skinParts.

Demo of Flash Catalyst.

Adam Lehman

New IDE for ColdFusion development called ColdFusion Builder also Eclipse based. CFML support for: code assist, insight, debugging, and ORM insight. Also have code assist for: HTML, DOM, CSS, JavaScript, AJAX (jQuery, ExtJS, etc.), and SQL. Code snippets, log viewer, AIR 2.0 Support. IDE can be extended through CFML extensions. CFScript allows tag-less components. Additional ORM support for CFCs based on Hibernate with CFML languages but still have access to low level settings. Expanded access to ColdFusion services for PDF, charting, document services, etc. all exposed through a SOAP & AMF interface with granular security control.

New CF SWC that will give AS3 / MXML libraries for accessing these functions like: , , , etc. Flash Remoting is 9 times faster in the latest versions. Now has full BlazeDS integration.

ColdFusion 9 has many PDF enhancements. Headers, footers, optimize, extract text and images, and converting Word to PDF. Has support for working with spreadsheets.

Demo of ColdFusion.

Ryan Steward

New Flash Builder adds data centric design features, better refactoring, performance optimizations, network monitor, and many others.

Demo of Flash Builder.

For people at the conference you have access to AIR 2.0 bits.

Tags: air coldfusion flash flex iphone riaunleashedboston2009

November 22, 2009

Building iPhone Applications with Flash CS5 (RIA Unleashed: Boston 2009)

Ryan Stewart (Using Mike Chambers' Slides)

What did Adobe announce:
Adobe Flash CS5 can create native stand-alone iPhone Applications
Flash Player 10.1 that is smartphone enabled (see keynote)
Did not announce Flash Player for Safari Mobile on iPhone.

Flash based iPhone applications exist today

LLVM (Low Level Virtual Machine) previous used in Alchemy
* Open source compiler with optimizations for any input language
* Capable of generating machine code for various targets
Front-end (SWF/ABC) -> LLVM -> Back-end (ARM)

Just like building an .air but with the descriptor capturing additional iPhone .app properties.

Flash Pro CS5 -> SWF, app.xml, app:/resources & Apple Certificates -> ADT -> .ipa

ADT does ahead of time (AoT) complication. Can't do JIT so you need to bundle code in, compiles ABC byte code from SWF and then pass through LLVM

Can use Flash Player 10.1 and Adobe AIR 2.0 APIs to get access to:
* MultiTouch
* Screen Orientation
* Media Library
* Accelerometer
* Geo-Location
* Cut, Copy, Paste
* Native rtextinput
* tel:, mailto: maps:, video:
* AMF, Flash remoting, RTMP

Can't do these
* Keyboard events outside of textfields
* Rollover or Hover
* ActionScript 1 or 2
* Loading SWF with ActionScript
* LocalConnection
* PixelBender
* H.264 and Speex codecs
* Microphone / Video Camera access

Still need to go through Apple certificate process, public key request, key signing request, application provisioning, etc.

Demo of Flash CS5 iPhone development process.

This allows you to build iPhone applications on Windows.

Current application use software rendering, latest releases are using GPU which will be part of the first public release.

Lots of tips and tricks for getting Flash based applications to perform well on an iPhone.

iPhone isn't like a Mac G5, much less power and performance so you need to think about your application development differently.

Device fonts for input fields, Helvetica is default.

Primary input is a finger (less accurate than mouse, larger hit area, no modifier keys, obscures the screen) 44x44 pixel recommended hit area size.

Text Input is the only component that launches virtual keyboard (get undo, magnifying glass, cut/copy/paste all work)

Resources
* bit.ly/arnoiphone
* bit.ly/mobilehig

Code Optimizations
* Improve performance and memory on desktop
* Some are AOT specific
* Test and profile in Flash Builder
* Grant Skinner Testing harness bit.ly/as3performance
* Reuse Instances
* Cleanup unused event listeners (especially ENTER_FRAME and Timers)
* Event dispatching can get expensive (use callbacks instead)
* Disable unused mouse events (don't use mouse_move use interval checks instead) or use mouse_down/mouse_up instead

Lots more information at www.mikechambers.com

Tags: flash iphone riaunleashedboston2009

May 12, 2009

Be wary of micro-benchmarks baring speed improvements

I've seen some links recently to the Round up of ActionScript 3.0 and Flex optimization techniques and practices and I'm afraid. I'm afraid that entries on that list are going to become gospel and code that doesn't use the tricks listed will be labeled bad. Knuth said it best, "We should forget about small efficiencies say about 97% of the time: premature optimization is the root of all evil." While the author frames the discussion correctly stating "You have to learn when to use some techniques and when to leave some out." I don't think he does enough to call out the type of optimization each entry is, or more importantly, how these techniques were derived.

One of the key tenants of any performance reporting is carefully detailing the environment and method used to construct the test. I'll focus first on the environment. With any ActionScript 3.0 and in particular Flex optimization techniques there are factors beyond the code that impact the effectiveness of a possible performance tweak. Depending on your target audience (e.g. intranet, internet, etc.) some of these techniques may work against you (i.e. your tweak makes your code run slower in certain cases).

The first is the Flex compiler. The same code compiled with different versions of the compiler will produce different performing SWFs. The Flex SDK is continually improving the optimizations applied to the generated SWF. That means that in some cases a performance tweak you made for the Flex 3.0 SDK may end up fighting the compiler and producing slower code with 3.2. As such keep track of any performance tweaks you make and be sure to test them whenever you change the tools you use to produce your SWFs. #19 is a classic example of a code pattern that in many cases the compiler could optimize automatically.

If we assume that the compilation tools are consistent the next big factor that will affect your performance is the Flash player itself. Remember one of the big advances that Adobe did with Flash 9 was introduce a virtual machine into the player that has just it time (JIT) compilation support. Each version of the Player makes tweaks to the JIT that can impact how your code runs. That might mean code which ran one way in a previous version of the player now behaves differently possibly even running slower. #13 and #15 on the list are examples of how the player may impact performance.

Of course the other half of runtime in the machine that the Flash player is running on. While Adobe does a fantastic job of providing a consistent cross platform runtime, they don't have any hard guarantees about the performance across platforms or hardware. Maybe memory management on one machine makes your code page fault more frequently which will slow it down. Maybe hyper threading or hardware acceleration of Pixel Bender filters helps the code run faster. The wide variability in hardware and software that the Flash player can run on means that there are many performance optimizations that could easily backfire in certain situations if you are really trying to eek out every millisecond of performance.

The other area I'd like to touch on beyond the environment is the testing methodology. The article gives almost no information about how each of the performance techniques was measured. While references are listed at the bottom the hints and tips are not cited well enough to easily track down the source. To take #1 "Array instantiation" as an example: Did someone write a single function that created X arrays using each technique and measure the total time taken? Were they two methods in the same SWF or were they different SWFs? Did they vary the order that the methods were called? How many times did they run the loop? Did they examine what happened when garbage collection started happening? Did they create these Arrays within the scope of a method, a class, as a static? What compiler did they use? What Flash Player was it tested on? What were the specifications of the machine that the tests were run on? That's just a sampling of questions that come to mind when I see a sample optimization technique. The answer to anyone of them could impact how helpful it might be to your code or even if it does anything in real code versus some micro-benchmark.

With all of that said my intent is not to dissuade you from thinking about performance optimizations but instead focus the discussion not at the micro-benchmark level but at the algorithmic level. What I mean is that for a given problem, I don't care how you initialize your Arrays, the fact that you are using bubble sort instead of heap sort means that for any reasonable implementation and application usage it will always be slower. That is the 97% that Knuth is referring to. Real world performance problems are almost always going to be inefficient algorithms long before your Array initialization technique starts taking up the majority of your time.

Scanning the list of techniques, I consider these to be more algorithmic focused and worth thinking about first:

  • 26: given that the Flex documentation continues to say this I'm inclined to agree with this one
  • 27: more objects to layout, more objects to keep in memory, etc. make this a good thing to keep in mind
  • 37: it's much better to not even need to think about needing to draw something, I'd add that includeInLayout is another important setting

A couple other observations:

  • 2: I'd say any object that you don't need is expensive so don't create what you don't need
  • 12: ideally you're using polymorphism so you don't even need to do branching but if not the axiom of Keeping the Common Case Fast applies here keeping in mind there is still a chance that the compiler or JIT can impact performance

I'm know my observations about items from the original list could be debated. I still think it is a great list of things to try, but in general don't treat it as gospel. Overall I want to emphasize that minor tweaks will not impact performance as much as algorithmic inefficiencies. Keep that in mind next time you need to speed up some code.

Tags: flash flex performance

September 26, 2007

Flashforward Boston: Beyond the Knowledge; The Art of Playing

Rough Draft Notes

Erik Natzke, Natzke Design

play.natzke.com

comes to interactive design from a design background.

looking to animate things in an organic manner
Flash is a digital sketch book
freeze and analyze life.
everything in advertising needs to have reflection

system based on percentages so that 15 second always takes 15 seconds
need to account for resizing
inventing new ways to be lazy

how do you make things file size sensitive.
build tools for yourself

curves and way points are a big thing

phenomenal flash generated video for an art installation.

Tags: flash flashforward2007boston

September 26, 2007

Flashforward Boston: Sound Visualization Using Flash

Rough Draft Notes

Jared Ficklin, frog design

Want to flatten learning curve, inspire with examples, remove barriers to entry, expose enabling technologies.

Sounds visualization: it is fun, enhance experience, increase usability

What is sound visualization. Standard visualization partial effects, are cool but you can do so much more. vectors and drawing, time line, interaction, sound engine, cell animation, rich media.

Sound is vibration. Author of flame sound visualization (Ruben Tube). Net result is what we consider digital music.

Sound terminology: wave length, period, amplitude, pitch, tone.

To visual: need sound and data. Sounds is easy, data has been hard. imported data: picture of the future. Marmalade FlashAmp.

frogDB WMP sound visual

native data: microphone object, SoundChannel.leftPeak & SoundChannel.rightPeak, SoundMixer.computerSpectrum(). In client and can be called dynamically.

active_mic.activityLevel (version 6 and above) between 1- 100.
SoundChannel: version 9, value between 0-1. current amplitude.
SoundMixer: version 9. 512 value byte array. waveform or FFT frequency and sampling rate. -1 to 1 waveform or 0 to 2 for frequency. 256 left next 256 right.

Be concerned about security. Security.allowDomain("*");

With the frequency output, there will be holes. bass 50-80Hz. vocals 200Hz-1000Khz. Snare. 10000 KHz to 30000KHz.

Need to think about frequency to make good sound visualization.
Multipliers, segmenting, and averaging to make the data useful.
50Hz per array value

Data stacked to the low end since that is what we hear most. Need to average samples on the high end and stretch out the lower end data to see real data.

Tactics:
direct interpolation: manipulate property, frame manipulation,
threshold spawning: values measured against a threshold
algorithmic spawning: funnest one: values processed and measured against rules
interaction: have user setup basis for visualization

self assembling music video

Tags: flash flashforward2007boston sound

September 26, 2007

Flashfoward Boston: Designers vs. Developers: How To Avoid Fights on the Playground

Rough Draft Notes

Marc Leuchner, Almighty
Matt Wright, ROKKAN

Everyone is working together to make projects happen. Most common sense but people aren't really calling it out.

Industry overview: Best area related to Internet. Unique people, extremely creative, lots of technologies continually expanding. FWA tracking latest and greatest. newstoday.com, Communication Arts Magazine.

Subcultures: code fiends, design junkies, framework freaks, application addicts, game gurus, usability nuts.

In larger companies: role strictly defined, objective, performance, but hard to communicate. While in a small company: roles loosely defined, absorb responsibilities, easier communication.

Can people work together? Yes if we talk and compromise.

Look at current workflow. If it is working, maybe you don't need to change anything. Some areas could be improved, need to really pinpoint weaknesses and admit your faults. Focus on opportunities to collaborate.

Education is key to working together. Need to educate each other about what you do and why it matters.

Some people don't want to change (don't force it), start with something fun. You will probably fail a few times but learn from your mistakes.

Designers: should ask for help with programming tasks to get into it more.
Developers need help with: UI design, typography, color theory, photoshop.

Brainstorming: invite everyone, technology can drive ideas, PM as moderators, open mind (no egos).

Creative Development: narrow ideas, define technologies. Need to be as clear as possible and justify. Talk about why a technology is good/bad, don't throw around buzzwords, stay open minded. Last time to argue.

Information Architecture: Don't work in a vacuum, avoid nonobjective views, run ideas by developers, keep yourself in check.

Art Direction & Design: Need prototypes, solicit developer feedback, might need to sell your idea, may require longer design.

Production and Development: After hand-off check in frequently, nit-picking is okay, way to get back to idea since translation to code may have lost something. Pixel perfect isn't always possible. Motion comps are helpful and remember that some compromise maybe needed.

Testing & QA: Not just for developers, learning experience, help prevent future issues

Project Review: discuss positives and what went wrong.

Workflow: Layer comps, motion samples, functional specs, Flex skins, separate style information, consistent folder structure.

Ted Patrick has some good articles on skinning Flex components.

Breaking communication barrier: active early communication helps build trust, respect and learn about everyone's role, don't be afraid to ask questions. Keep an open mind. Don't build barriers creates clicks and makes it hard to cross the bridge.

Middle Man: Hard to find but good for bridging the gap.

Deadlines = stress = fights. It is unavoidable but strive to work together.

nobien.net

Tags: flash flashforward2007boston flex

September 26, 2007

Flashforward Boston: Imagination and Technology

Rough Draft Notes

Craig Swann, CRASH!MEDIA
Chief imagination officer

interactive toy maker

not about flash or flex or as3
want to talk about ideas
R&R=R&D blurring line of work and play
happiness is fuel of creativity
work less play more
creative cross-pollination
all about changing the way you look at things, makes the things you look at change

everything is an API, HAPI, hates the word user

listen, watch, touch, sense
ambient awareness, listen 360 degrees (built-in microphone)

visualization of microphone input, how it plays into environment design. Line in audio and.
kaleidescope video example, stop video example triggered on sound

speech recognition

watch (like a computer with a set of eyes)
motion threshold (detecting presence)

more about the idea dn how to interact with the computer.
userface (computer vision)

video difference visualization to show motion

motion mapping example, going beyond simple interactivity.

gesture based interface.

color tracking.

how to simulate mutli-touch
multi color tracking color mixing interface

time delay video across a grid
line based video delay

how to control time through the interface
video displacement of time, linear record and playback versus real-time

physical realm
IPAC (USB)
wind chimes are constantly touching tie to sound samples, virtual wind chimes
lock that can be wired up (physical control)
rings on fingers connected to wires, contact with thumb, 8 connection gives a scale
conductive paint and pencil to create interface

painting with light: litegraf
ipac on painters palette plugged into computer

many forms of control, make controller, arduino
light sensor and cover it, phidgetRFID
radio control car controller to remotely control flash

SMS sudden motion sensors
using accelerometers for physical version of breakout

monome
OSC (way to get data into flash)

midi controller

wii interface to flash and ability to play with it

try something different today

Tags: flash flashforward2007boston video

September 26, 2007

Flashforward Boston: Designing with Sound

Rough draft of notes

Dave Schroeder, pilotvibe.

Sound is a powerful communicator
Sometimes more powerful than visual and can be misused

Design is about seeing what isn't there as much about as what is there. Design is inventive and reductive. Sound design can be dangerous.

Sound design: Voice over, sound effects, navigation sounds, ambiance, music.
Visual story-telling: on screen, off screen, non-digetic (out of story space).
Sound relationship: sympathetic, contrasting, abstract/emotive. Bad day movie clip shown with 3 different sound tracks. showing each relationship.

How plan audio in interactive. Goal of audio, time & budget, mission statement + asset list, reference points hard to talk about sound (almost like a foreign language).

  1. music
  2. voice over
  3. ambience
  4. navSounds
  5. sound effects

Working with sound.
Music: focus on mood versus genre, creates singular/linear space, it can convey abstract things. Tempo and complexity. May focus your attention.

Voice overs: pro talent, one file = one thought, location recording (consistent background noise), inflection. Record some quick / fast and make sure it works before doing it all.

Ambiance: complete the picture, hard to find the perfect loop (build with layers instead), only need essential sonic cues. Non routine sounds can't loop. Speaking, accidents, etc.

Navigation Sounds: help user navigate and explore, focus attention on visuals, meaning derived from relationship with sound, reinforces communication goal.

Same sonic space (wet & dry sound). Reverb (delay) does a lot, helps to locate and place objects. EQ helps with that. Easier to make a dry sound wet.

Spatial sound: x: balance/pan, rising less low end, moving away less high end

Audio editing: Likes Pro Tools, important to input/export .wav, .aiff, .mp3, record to wav, high quality master files, import movies to work against

Tracks: 4 tracks of playback, separate tracks fof VOs/effects, layer sounds to ceate sounds, mock up a sound scheme.

MP3: compression is hard. Use EQ to shave off the top freqs. length is important, trim tight, respect tails. 80kpbs or higher is great, but be consistent.

Pro Tools example. Cut in middle drag end to beginning and overlap in middle with cross fade. Easier way to make a good loop.

Voice overs: Find highest peak across all files and make it louder. Normalize across all takes.

Tags: flash flashforward2007boston sound

September 26, 2007

Flashforward Boston: BitmapData and 3D Image Manipulation in AS3

Rough Draft Notes

Paul Ortchanian, Goodby Silverstein & Partners

Effects don't all need to be done with OOP

Don't always view in terms of x and y. view in circle instead 0, 180, 360 degrees.
think in circles, best way to think of programming in 3D

cerate illusion of depth by scaling elements.
scale=fl/(fl+_z);
_x=x*scale;
_y=y*scale;
_xscale=_yscale=scale*100;

principal rotations

pitch, roll, yaw
find formulas on wikipedia

need to eliminate objects in background

bezier formula

model tween as line that point follows x, y determine speed at each point

Flash 8 added Flash Image API.
bitmap color: argb (alpha, red, green, blue)
can apply masks

DisplacementMapFilter
ColorTransformMatrix

3d radian manipulation
3d skew

Transform matrix is very complex but very powerful.

Tons of examples with code at: reflektions.com

Tags: 3d flash flashforward2007boston

September 26, 2007

Flashforward Boston: Usability Approach to Accessibility

Rough draft of notes

Niqui Merret

Audience poll: Some people have done accessibility testing, but most have mot done so with disabled users.

Need to understand your users.

Accessibility is for everyone vs. technology or device. Focus on users with disabilities.

Accessibility in the real world, no technology is 100% accessible to all users. Aim to achieve best solution, maybe multiple technologies are needed. Combine Flash and HTML.

Definition of Accessible: To be able to be accessed. Want to break down barriers to accessing information.

Two main barriers:
Controls outside of Flash control: no tabbing between Flash and HTML site, wmode setting issues along with MSAA issues, MSAA didn't work with prior versions of Flash player, can't tell screen reader "I've made an update", can't set reading order on static textfields, Flash doesn't support voice over on Mac, Flash doesn't take high contrast settings on Windows.

Content and presentation barriers: stuff we build in that we need to think about (not everything needs to be accessible). Understand where the user is coming from. Screen reader users probably can't use mouse, need keyboard control.

Disability categories (these are all muddy and shouldn't be a taken as hard and fast):
visual (color blindness biggest issue), audio, motor, cognitive (good understand, foreign language).

Legal and General UK case study of accessibility and ROI.

Color and contrast (don't care about colors, need to distinguish content). Showing contrast demo with memoriaduo.com. Mac system settings has built in contrast control. Some tools available on other platforms. Don't talk about a color without a non-color cue ("Click on the green button") Provide tools to switch within your application if possible.

Size: Provide mens of controlling font size.

Keyboard Access: Provide logical structure. Flash accessibility dialog (easily set tab index). Focus highlighting is important if you have keyboard controls. Shortcuts make sense if someone is going to be using the site multiple times. Non visual users need to have them explained.

Audio: Provide textual or graphics of audio information. Using weebls-stuff.com videoas an example. Text on screen of audio lyrics. Harry Potter website is another good example.

Screen reader access: Auto next doesn't force update. Yahoo developer network has videos about screen readers and explanations from blind users and screen magnifier example. Set the name of buttons for non text buttons. Flash auto labels textual buttons. Specify reading order (tab index). Avoid using wmode.

Demo of Inspect tool part of Microsoft accessibility suite to show what is being sent to screen.

swffix.org Going to be best embedding technique, currently in public Alpha. Will replace SWFObject and UFO joint project.

http://www.adobe.com/accessibility/

http://blogs.adobe.com/accessibility/

How big is big enough for font size: Niqui recommends minimum of 11 or 12 for Arial. Font and context specific.

Standalone player and AIR don't communicate with MSAA.

Flash vs. AJAX accessibility. Flash is more accessible by default. osflash.org has AJAX aid which detects virtual buffer refresh. Easier to control visual output (contrast, fonts, etc.) in Flash.

Flash components can destroy tab ordering. Something on stage that that isn't labeled will throw off tab order. Best to set tab enabled to false.

Tags: accessibility flash flashforward2007boston

September 26, 2007

Flashforward Boston: Keynote

Rough draft of notes

Flickr tag with flashforward


Kevin Lynch from Adobe

Pushing Flash forward with AS3. Complimentary copies of Essential ActionScript 3.0.

With FP9 and AS3: E4X, regular expressions, strong and lose typing.

Inside Tamarin is the Virtual Machine within FP9. Core of VM has been opened sourced to Mozilla. 10 times speedup in FP9. Also have this is as the scripting language for the web. FireFox and Flash Player 9. ECMAScript standard. Includes Just-in-Time compiler.

Showing RSS XML data and E4X possibilities:

feed.channel.title.text()
feed..title.text()
feed..item[1].text()
feed..item.(@id =="82").title.text()

Power of regular expression.

Showing comparison of AS3 and JavaScript 1.7. In general 10 times faster.

Flash Player adoption. Fp7 70% in 1 year, FP 8, almost 90% in one year, FP 9 90% in one year.

Picnik. Online photo editing. Zoom, rotate, alignment, color editing (saturation, temperature), sharpness, real-time editing.


Joshua Hirsch from Big Shapeship (Digital Creative Agency) talking about HBO.

8 apartments single building, like no walls. Projected onto side of building. Watch on-demand on digital cable. Also put the web.

HBO Voyeur. Using papervision for 3d effects. Full video.


Kevin: Adobe is focusing on digital technologies. Video workflow from creation to distribution. Adobe media player to view video on desktop.

H.264, multi-core cpu, full screen hardware scaling, bitmap downscaling, secured delivery of streaming video. IPv6, ISO video standard video camera, personal media players, set-top boxes, tvs. FP9 being updated to include H.264 code named Moviestar.

HD Video Demo. Releasing soon, new component for CS3 to use H.264 right in Flash. CSI HD video example. 70% of web video is in Flash.

Papervision example with multi-core speedup.


Adrian Ludwig talking about Flex. Already two versions of Flex. Currently working on Moxie. Language intelligence, profiler, visualization, workflow.

Flex is moving to be open source. bugs.adobe.com. Profiler demonstration. Memory usage. Object creations. Snapshot of application. Application is running faster than he expected (had to muck code). Zoom in on method that is taking a long time. Who was calling.

Showing refactoring example. Method rename. Workflow speedup.Sample application is using charting controls. Advanced data grid, has per column formatting.

Flex perceived as too big. Flex framework cache. Download framework code only once.


Kevin back talking about AIR. Flash, PDF, and HTML. AIR platform overview.

AIR sample applications. AIR Samples.
Showing badge install process. One click to install AIR and your application. PixelPerfect example.

artMusheen. Paint with shapes example. Native chrome.

digimix, mixing audio.

Finetune. Streaming music on your desktop.

Buzzword. Word processor. Edit locally or shared thorugh a cloud. Lists, tables, pictures, graphic editing. No drag'n'drop support out of the box yet.

Flickair searches Flickr for photos, nice chromeless application.

adobe.com/go/air

CS3 extension for Flash to just package application as AIR, should just work.

Tags: air flash flashforward2007boston flex

September 26, 2007

Flashforward Boston: SWX

Rough draft of notes

Aral Balkan is talking about SWX.

Some post lunch jumping to capture a room of a full of people in the air yelling SWX.

Aral likes to consult, speak, and teach about user experience design, development processes, and software architecture. Works primarily with Flash, Flex, and a focus on open source. Founded osflash.org. Currently working on SWX.

What is SWX: new and native data format for Flash platform. Like JSON which is data in JavaScript. SWF is the native format for Flash. Want to put data in a SWF.

Terms:
SWX: Native format for Flash.
SWX RPC: RPC protocol encoded in SWX.
SWX PHP: PHP backend for SWX.
SWX Tools: Service Expolkire
SWX AS Lib: Optional, high-level AS library that handles SWX RPC calls.
SWX APIS: APIS for Flickr, Twitter
Public gateway: Open SWX RPC endpoint

Why SWX: Issue with existing data formats.
loadVars, loadVariables: deserializing string is complicated, it's plumbing, should be handled for you
XML: What data structure is being loaded, first child, last first, what child
Remoting: Created SWX because of remoting. Go to Adobe and search for remoting classes. Barrier of entry is too high. Doesn't work with Flash Lite.

SWX just works. SWX is easy. swxformat.org
Demo of Services Explorer: Test services installation of PHP SWX Services.

Launch Data Analyzer, Launch Flash, AS 2 FLA: Create MovieClip named loader, In actions panel:

loader.serviceClass = "Flickr";
loader.method = "swxPhotosGetRecent";
loader.debug = true;
loader.loadMovie("http://swxformat.org/php/swx.php", "GET");

Data Analyzer has data that was returned. Creating second MovieClip called image:

// hack to get things up and running, see if it works
function onEnterFrame()
{
    if (loader.result)
    {
        image.loadMovie(loader.result.photo[0].src);
        onEnterFrame = null;
    }
}

swxformat.org/faq/ for information about Flash IDE Sandbox warning issue

swxformat.org/download (SWX ActionScript library) comes with classes and examples.

import org.swxformat.SWX;

var swx:SWX = new SWX();
swx.gateway = "http://swxformat.org/php/swx.php";
swx.debug = true;
// got rid of loader MovieClip
var callParameters:Object =
{
    serviceClass: "Flickr",
    method : "swxPhotosGetRecent",
    result: [this, resultHandler]
}
swx.call(callParameters);
function resultHandler(event:Object)
{
    trace("Hello");
    var imageSrc:String = event.result.photo[0].src;
    image.loadMovie(imageSrc);
}

Currently this only works with AS2.

How to create your own service side class. SWX MAMP Bundle to work with PHP on a Mac allows working with things easily. One click run on Mac, just download ZIP for Windows or Linux if you have a running web server with PHP.

HighScores.php SWX services example

<?php
class HighScores
{
    function getNames()
    {
        return array('Branden', 'Mario', 'Chafic');
    }
}
?>

Changing example from above:

swx.gateway = "http://localhost:8888/phph/swx.php";
serviceClass: "HighScores",
method: "getNames",

// updated resultHandler

var names:Array = event.result;
for (var i=0; i < names.length; i++)
{
display.text += names[i];
}

TextField component called display

FlashLite 2.0 and 2.1 are supported.

Showing demo of miniflickr using CS3. Trying to demo it on his Nokia N95 (couldn't get network).

Showing application with SWX that pulls Twitter data.

SWX Ruby (Locomotive one click Mac installer for Ruby)
creating swxrpc ruby application. Line of code to install SWX Ruby.
Showing example using Ruby service, same loader calls.

SWX uses: Mashups for Flickr, Twitter, Jaiku, Numpa, Nabaztag, etc.
Flickr API: current, MIT license, upload, actively maintained

Mobile applications: Limitations no POST. DeviceCentral doesn't support LocalConnection.

Games, Kiosks, CDs, Wrap it with AIR (Twimpa is an example)

SWX has a showcase on swxformat.org

AS2, Flash 6+, Flash Lite 2.0, 2.1 Mobiles, Wii, PS3, PSP, Chumby

Soon: AS3/Flash 9

Roadmap: Writting RFCs for SWX and SWX RPC, bundles for other platforms, more APIs.

nabaztag.com

Tags: flash flashforward2007boston swx

May 19, 2007

Stopping Flash 4 SWF with Sound in Flex 2

I recently had an issue where in Flex 2 I had to load and play a Flash 4 SWF that had embedded sound in it. I'm not a Flash developer so I'm not 100% sure if the sound was encoded as an event or what have you. In any case as soon as the SWF was loaded it would start playing and it would loop. Since Flex 2 uses Flash 9 the Flash 4 SWF shows up as an AVM1Movie when loaded which means you can't do much of anything to the movie once it's loaded. Most annoyingly the sound keeps playing and playing.

Problem 1: How to stop the sound?
The only fix I found was to call SoundMixer.stopAll();. Drastic, but it worked.

Problem 2: How to stop the sound looping?
Great the sound stopped, temporarily, only problem was when the SWF looped the sound started up again. The fix requires using a Loader and a call to unload() when you are done using it:

// create a loader and load the file
var loader:Loader = new Loader();
loader.load(new URLRequest("sound.swf"));

// later when you want to stop it
SoundMixer.stopAll();
loader.unload();

Problem 3: Security issues?
This works if you are requesting the SWF from your own server, but if you are using another site to store the sound files (say a CDN), you'll run into security sandbox issues. To get around this the remote site will need to have an appropriate crossdomain.xml file and you'll need to use a custom loader context:

// create the loader context
var loaderContext:LoaderContext = new LoaderContext();
loaderContext.securityDomain = SecurityDomain.currentDomain;
loaderContext.applicationDomain = ApplicationDomain.currentDomain;
loaderContext.checkPolicyFile = true;

// use it when loading the file
loader.load(new URLRequest("sound.swf"), loaderContext);

Other notes:
You should also setup a listener on loader.contentLoaderInfo to register when the SWF has loaded as unload() only works when the loader has completed, prior to that you need to use close().

Tags: flash flex sound

June 30, 2006

Missing Link

I can't believe I never linked to this. Must see. Although most of you that read this blog probably already have, multiple times.

Tags: flash funny

April 30, 2006

Flash 8.5 Beta 2, Firefox, Mac OS, and Sleeping

Since installing the Flash 8.5 Beta Firefox has been crashing on a fairly regular basis when my Mac is coming out of sleep mode. I'm going to try reverting back to Flash 8 and see if that makes the problem go away. I've also recently upgraded Firefox due to recent security issues and I'm fairly certain the latest round of Mac OS patches got pushed out also, so the blame may not be squarely on Flash but given that it's the only beta product in that mix I'm going to try that first.

Tags: bugs flash mac