14
SwimTimer App an exercise in UI-design “Bay Area Mobile” Meetup - Hacker Dojo - Thu Jul 7, 2011 Frank Siebenlist [email protected] Monday, July 11, 2011

an exercise in UI-design - Meetup

  • Upload
    others

  • View
    1

  • Download
    0

Embed Size (px)

Citation preview

SwimTimer Appan exercise in UI-design

“Bay Area Mobile” Meetup - Hacker Dojo - Thu Jul 7, 2011Frank Siebenlist

[email protected]

Monday, July 11, 2011

What?

• SwimTimer App Demo

• High-level App Implementation Features

• Conclusions

Monday, July 11, 2011

Get your stopwatch-apps out

and get ready... set... go...

Monday, July 11, 2011

SwimTimer Demo - Example Screens

Monday, July 11, 2011

Standard iPhone Stopwatch App

Monday, July 11, 2011

What’s wrong with “other” timer apps?

• Buttons are too small

• easy to press outside of button

• More than one button

• easy to press the wrong button

• Mistakes are made

• unforgiven - too bad...

• No saving or sharing of results

• reset is forget

Monday, July 11, 2011

What’s right with “this” SwimTimer app?

• One huge button

• impossible to miss - pay attention to race

• One single button for start/lap/finish

• impossible to press the wrong button

• Manage timed entries when you have the time

• during/after race - no hurries... relax

• Timed entries can be discarded

• with a swipe - does the right thing

• Tweet/email results

• uses internet memory

Monday, July 11, 2011

SwimTimer App• Much improved stopwatch-app

• unique features among dozens of “similar” apps

• Tested by real swim-coaches and timer-challenged parents

• close to feature freeze

• Started out as just an exercise in UI-widget use

• became an exercise in UI-design

• About 2 dozen beta-testers

• maybe... probably... app will get published... soon(which was never the original intention)

Monday, July 11, 2011

SwimTimer AppImplementation

• Toolkit/Language: ANSCA’s Corona/Lua

• Why?

• Contemplating to use Corona for real-world apps

• Corona’s ui.lua was far too “primitive”

• See if we could improve...

• Not much left of original ui.lua...

Monday, July 11, 2011

Implementation Features (1)

• Description of ui-elements fully declarative

• Objects and Handlers referred to by name

• Geometry managers to dynamically align groups of objects

• Object display properties, groups, alignment, handlers... all (optionally)described in json-files

• Object cloning and persistence (almost) for free

Monday, July 11, 2011

Implementation Features (2)

• Button defined by image, rectangles, or any instantiated display object or sprite

• All event-driven - propagate thru standard Corona event registration/handling mechanism

• Listview enhanced with geometry manager

• Swipe left/right for duplicate/delete

• Easily configure button-state in xor/and-groups

• Much easier to keep app modular and MVC-like

Monday, July 11, 2011

Corona UI Futures (?)• ANSCA working on new extended widget support

• widget.lua (beta - work in progress)

• still “primitive” in many ways... as far as visible (source unavailable so far)

• Waiting to see if my “enhancements” would be easily portable to new library

• if not too much work... will port relevant parts as open-source

• Corona is a great game development toolkit...

• ...but basic ui-widget support is lagging behind substantially compared to other SDKs (LiveCode, IOS, Appcelerator, ...)

• This SwimTimer app shows what you “could” do with Corona for a UI... not necessarily what you “can” do out-of-the-box...

Monday, July 11, 2011

Post-Mortum...• The day after this presentation, ANSCA communicated that Corona’s widget/coronaui-

library will NOT be open-source after all...

• change of previous promises... too bad... guess they have their reasons...

• Consequences

• Impossible to port my UI-extension to Corona’s widget-library

• Makes no sense to publish my UI-extension as open-source

• Corona’s widget-library: non-declarative, no json-config, no named-objects/handlers, no geometry-groups&mgr, no swipes, no object persistence, no MVC modularity, ... so 1980’s ;-) ... ANSCA’s loss ...Corona’s community’s loss

• Corona good for physics-games as a box2d-shim... but rather primitive for business apps

• In process to re-render SwimTimer App on LiveCode (RunRev.com)

• ...as well as to use LiveCode for our “real” business apps (personalized medicine)

• No need to write any UI-extensions, true IDE with GUI-designer, HyperCard on steroids, real debugger, plus easy call-outs to native IOS: LiveCode is a very impressive environment!!! (...and it’s difficult to impress me anymore...)

• Maybe next meeting I should give a presentation about my LiveCode experience (...and compare it to Corona...)

Monday, July 11, 2011

Thanks!??? Questions/Comments/Suggestions ????

Ability to create innovative apps for on-the-go and on-the-couch.

Monday, July 11, 2011