Tools and resources for functional prototyping for mobile apps

1. Functional
Prototyping for
Mobile Apps
Levent Gurses
@gursesl
April 2015

3. Levent Gurses
@gursesl
Entrepreneur, hacker, speaker, organizer

4. Agenda
Paper
Prototyping
Mobile App
Prototyping
Apple Watch
Prototyping
Q & A

5. Terminology
Paper drawings
Wireframes
Mockups
Prototypes
Functional prototypes
Throw-away prototypes
Mock applications

6. The Proto Landscape

7. Prototyping Tools
POP
Balsamiq
Flinto
Marvel
InVision
Proto.io
Axure
Keynote
Adobe After Effects
Form
Origami
Framer
Xcode

8. The Value Proposition

9. Prototyping Saves Money
● $230,000 - Large project for enterprise client -
emphasis on requirements clarification and unified
vision
● $25,000 - Smaller project - offshore development -
most savings from improved developer productivity
and clarity of requirements

10. Unrelated to Prototyping...
Building great software requires a multidisciplinary team
Yet, we always hear some disciplines are done as an
afterthought:
● Security
● Testing - performance, I18N, etc.
● Ops - environment, etc.

11. Have you run into this
Security guy?
Can’t you build security in?
Why do I feel like an
afterthought?

12. Or this Ops gal?
Where is my scripted
environment? You’ve got
everything: Docker, Fig,
Consul, Vagrant, Nginx...
And yet… I feel like an
afterthought...

13. Two days for performance
testing? Are you seriously kidding
me?
I feel like an afterthought...
again...
Or this Testing expert?

14. Clearly...
They must be suffering from a Feeling Like an
Afterthought [and maybe even a Problem]
(FLAP) Syndrome

15. We [UX] may have the
opposite problem
● UI, UX and related “creative” or design disciplines are
sometimes lumped into an upfront analysis phase as a
prequel to the “real” effort. Which clearly makes it feel
like a forethought.
● Maybe I am suffering from a Feeling Like A
Forethought (FLAF) Syndrome

16. Allow me to explain
You might think
‘What’s wrong
with being a
forethought?’

17. Forethought Thought Afterthought
● UI/UX
● Design
● Requirements
● Dev
● Architecture
● Testing
● Database
● Project management
● Security
● Ops
● Testing
● Disaster recovery
● I18N
● Content management

18. Yes!
We all yearn to be part of the “real” team, the
Thought.
No more Forethought, Afterthought. We are
all a Thought!

19. Cross-Functional Teams to
the Rescue
● Dev + Ops = DevOps
● Dev + UX = DevUX
● Dev + DB = DevDB
● Dev + Security = DevSec
● Dev + Requirements = DevReq

20. Each sprint includes all disciplines
No more FLAP or FLAF!
A Better Agile Process

21. In closing...
● Prototyping rocks
● Prototyping = Money
● Abundance of prototyping tools
● DevUX on the horizon

22. Thank you
@gursesl

23. Resources
Sketch resources
● Apple Watch GUI for Sketch - https://designcode.io/watch
● Apple Watch UI/UX - https://www.pinterest.com/linoleum0/apple-watch-uiux
● Apple Watch Springboard - http://dzinlife.github.io/Apple-Watch-Spring-Board
Framer resources
● Framer Docs - http://framerjs.com/docs
● Framer Examples - http://framerjs.com/examples
● Framer Studio - http://framerjs.com/download