SwimTimer App an exercise in UI-design Bay Area Mobile Meetup - - PowerPoint PPT Presentation

SwimTimer App an exercise in UI-design “Bay Area Mobile” Meetup - Hacker Dojo - Thu Jul 7, 2011 Frank Siebenlist FrankS@CreativeApptitude.com 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 App Implementation • 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