mobile prototyping masterclass
DESCRIPTION
This presentation covers what is prototyping, why we prototype, how we prototype at Tapmint and some tools you can use. It also includes some case studies of apps we have built at Tapmint. This was a masterclass delivered at the SydStart 2014 conference, Australia's largest startup technology event. It was presented in the morning and afternoon sessions. If you are looking for an innovative mobile app for your business, go to http://tapmint.com and get in touch with us.TRANSCRIPT
Mobile Prototyping Masterclass
About Me
Matthew Ho
● We make innovative apps● Digital Producer background● Worked online for 7 years● Next Digital, Deloitte, Airbnb● Twitter: @inspiredworlds
Head of Product Development at Tapmint
1. A prototype is an early model or release of a product built to test a concept or process.
2. Not final product 3. Distinct to MVP 4. Everything prior to MVP is
prototyping
What is a Prototype?
Why Use Prototypes?
● What are we trying to achieve?● Process: hypothesis - evaluate - test
● Customer feedback
● Test a process
● Cost – Less cost
● Risk – test our assumptions
Case Study 1: LP Strategy App
1. We had a hypothesis that we could win using cheats in the Letterpress game
2. Initial version ran from local computer3. We tested it over several days with
developer running the LP Strategy prototype vs actual user (me)
4. We refined it & tested against real competition
Case Study 1: LP Strategy App
1. We developed it into an app by the end of the 1st week
2. We improved design 3. Refined for 1 more week4. Submitted to app store in two
weeks (MVP)
Case Study: LP Strategy App
1. Constant iteration based on feedback.
2. Weekly release cycles: design, development, and marketing
3. 10,000 downloads. 4. #5 ranked app for “Letterpress” in
AU, #8 in US in a competitive category.
Case Study 2: Fun Social App
● Hackathon - half a day● Purpose: foster teamwork,
showcase our skills● Output: create a fun social app
Friend Select Screen
Initial idea Collaboration
Uploading a File
1. We decided to email attachment 2. Easier and less effort to email it via
mandrill 3. Alternative: setup AWS, create a bucket,
connect servers. Takes more time.
How We Prototype
1. Use tools & technology that you can be most productive in2. We have cross disciplinary skills 3. Mobile/web experience (made 12 products together)4. Immediately move towards working software
How We Prototype
1. We can go from sketch to development/design. 2. Build/design as fast as specs are written3. Developed our own framework and libraries4. Cross platform app development tools 5. We don’t worry about scaling and final live version6. Aim: to get working software in the hands of users
Popapp: turns sketch into interactive prototype
https://popapp.in/
Mobile App Prototyping Tools
● Wireframing tools○ Moqups: wireframes for main screens and write user stories○ Balsamiq, Axure
Mobile App Prototyping Tools
Mobile App Prototyping Tools
● Turn designs into interactive prototype○ Appgyver prototyper○ Flinto○ Invision
Mobile App Prototyping Tools
Mobile App Prototyping Tools
Appendix: Web Prototyping
Web Prototyping Tools● Landing pages: unbounce, strikingly, lead pages ● No graphic designer required: twitter bootstrap http://getbootstrap.com/ ● Themes for bootstrap: https://wrapbootstrap.com/ ● Services to help you get a colour scheme
http://www.pictaculous.com/http://www.cssdrive.com/imagepalette/
What if I don’t have a developer or designer?
Summary
1. The process of creating prototype is similar to MVP2. Hypothesis, experiment, test3. Not final product4. Use technology and tools that we think we can be most
productive5. Team make up can dictate approach and tools
About Us - Tapmint
● Native Tongue - First winning team in Startup Weekend in Australia
● 4 language game apps, 400,000 downloads
● Prototypes: finance, social, word games, productivity.
● Innovation, rapid experimentation, complete solutions
● Twitter: @tapmint ● Website: tapmint.com