Monday, October 20, 2008

AjaxWorld keynote: Matt Quinlan

Keynote: Get Rich Quick

Hard for business owners to translate from what they actually want to functional requirements. Challenge is to give what they need. To the user, the interface "is" the application. Separate two elements: aesthetics of the interface and the user experience. First isn't hard to convey, second is.

Answer agile development [ed: who didn't see that coming?]. But: problem = phase 2 development often requires refactoring or redesign of phase 1 datamodel. Use agile approach to build UI in phases without backend development.

"High fidelity prototyping". Look for user's emotional response to proposed design. But building prototype has to be efficient.

Prototyping strategies

  • Paper. Pro: fastest. Con: only for early phases, doesn't work for distributed teams.
  • static html wireframe – lots of effort, too much to throw away
  • photoshop - – good for aesthetic design. Still hard work. Lo-fidelity for rich apps.

    Challenges

  • HTML scripts – generated server side, so how to handle that in a rapid prototype. Don't want to have to spend a lot of time programming / simulating server side code
  • JavaScript
  • Ajax - either have to mock ajax calls, or build server-side mocks

Ideal solution

Build a prototype in days or weeks. Build a prototype that is not throwaway, but will be the UI for the final app. Expectation management is key: users must not believe the app is done.

Goals: Avoid CGI. Has to be simple. Easy to mock, and replace post-prototyping phase.

Appcelerator solution: unified widget framework – extend HTML. Large lib of built-in and third party widgets, including flash and flex. Javascript: RIA's include lots of Javascript (e.g. google maps > 6k lines of javascript). Lots of javascript cruft. Three core tasks: DOM manipulation, event handling, ajax invocation. Web expressions: on="condition then action". Lots of built-in condition types – DOM, keypress, history, drag/drop, iPhone ... Actions – scriptaculous effects, CSS, custom javascript, publish custom message. Use of observer pattern, more similar to desktop GUI's. Novel to HTML interfaces. Message broker built-in to client side code. Can be extended to send messages to server-side as well, through service broker. Server-side implmentations of service broker in Java, .net, ruby, python, perl.

No comments: