SlideShare a Scribd company logo

From Napkin to App: Rapidly Prototype and Build for Mobile in Days

•Download as PPTX, PDF•
•
Apigee | Google Cloud
Apigee | Google Cloud

This document provides an overview of how to rapidly prototype an app. It discusses ideating app ideas, designing prototypes with sketches, developing click-through demos using HTML and JavaScript, and deploying to mobile devices using tools like TestFlight and Zubhium. The presentation establishes guiding principles like "budget = lifestyle" and "document everything", and recommends generating many app ideas and using visual comps to get buy-in. It also includes a shopping list of recommended tools and platforms for prototyping like UI Stencils, GitHub, and Apigee services.

Related slideshows

Adoption-Centered API Design
Adoption-Centered API DesignAdoption-Centered API Design
Adoption-Centered API Design
 
Introduction to the Art of API Practice
Introduction to the Art of API PracticeIntroduction to the Art of API Practice
Introduction to the Art of API Practice
 
Light Up Your Intranet with 10 Cools Apps
Light Up Your Intranet with 10 Cools AppsLight Up Your Intranet with 10 Cools Apps
Light Up Your Intranet with 10 Cools Apps
 
1 of 85
Napkin to App How to rapidly build a prototype Alan Languirand @13protons Brian Mulloy Apigee @landlessness @apigee
groups.google.com/group/api-craft
youtube.com/apigee
slideshare.net/apigee
@13protons @landlessness Alan Languirand Brian Mulloy
Agenda • Overview • Ideation • Design • Development • Deployment • Demonstration • Shopping List • Summary
Why prototype an app?
High fidelity communication.
APIs are invisible.
Apps are not.
We prototype a new app every two weeks.
For painting an API vision, one app is not enough.
Three apps is enough.
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
How to create ideas for apps for big companies?
Establish a guiding principle:
“Budget = Lifestyle
“Document Everything
“Involve Me and I Learn
Make a big list.
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
More is better. Don’t self-edit.
Narrow down based on:
Credibility for the brand.
Relevance to the customer.
Differentiation.
Dream big.
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
Explore what’s possible with existing APIs.
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
How to approach prototype design?
The first tool you should grab is your sketchbook.
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
How to approach prototype development?
Build a click-through demo.
Then make live API calls.
If the boss insists then build out the rest.
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
How to deploy prototypes on mobile devices?
iOS
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
Android
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
How do we see what’s happening on the app?
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
Demo
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
From Napkin to App: Rapidly Prototype and Build for Mobile in Days
Shopping List • UIStencils • GitHub – http://www.uistencils.com/ – https://github.com/ • Prismacolor Pencils • Apigee App Services – http://www.prismacolor.com/ – http://apigee.com/docs/app_ser vices • Niji Roll Pencil Bag – http://www.amazon.com/Yasuto • Apigee Gateway mo-Niji-Roll-Multi-purpose- – http://apigee.com/about/enterp Pouch/dp/B0027A5A9M rise-capabilities • Apigee API Consoles • TestFlight for iOS – https://apigee.com/console – https://testflightapp.com/ • Google search • Zubhium for Android – https://www.google.com/ – https://www.zubhium.com/ • Adobe Creative Cloud • Apigee Mobile Analytics – http://adobe.com/creativecloud – http://apigee.com/docs/enterpri • Trigger.io se/content/what-mobile- analytics – https://trigger.io/
Summary • Establish a guiding principle • Generate many ideas • Share rough sketches for co-dreaming • Make visual comps to convert believers • Develop in HTML & JS • Deploy to iOS with TestFlight • Deploy to Android with Zubhium • Use fun tools
Questions?
THANK YOU Subscribe to API webinars at: youtube.com/apigee
THANK YOU Questions and ideas to: groups.google.com/group/api-craft
THANK YOU Contact us at: @landlessness brian@apigee.com @13protons alanguirand@apigee.com @apigee

More Related Content

From Napkin to App: Rapidly Prototype and Build for Mobile in Days

Editor's Notes

  1. What security measures can we put around our API?
  2. What security measures can we put around our API?
  3. What security measures can we put around our API?
  4. What security measures can we put around our API?
  5. What security measures can we put around our API?
  6. What security measures can we put around our API?
  7. What security measures can we put around our API?
  8. http://www.flickr.com/photos/falcifer/4784573152/
  9. What security measures can we put around our API?
  10. What security measures can we put around our API?
  11. What security measures can we put around our API?
  12. What security measures can we put around our API?
  13. What security measures can we put around our API?
  14. What security measures can we put around our API?
  15. What security measures can we put around our API?
  16. What security measures can we put around our API?
  17. What security measures can we put around our API?
  18. What security measures can we put around our API?
  19. What security measures can we put around our API?
  20. What security measures can we put around our API?
  21. What security measures can we put around our API?
  22. What security measures can we put around our API?
  23. What security measures can we put around our API?
  24. What security measures can we put around our API?
  25. What security measures can we put around our API?
  26. What security measures can we put around our API?
  27. Sketching – many levels of fidelity
  28. The right tools make a difference
  29. The right tools make a difference
  30. The right tools make a difference
  31. Sketching – many levels of fidelity
  32. Sketching – many levels of fidelity
  33. Sketching – many levels of fidelity
  34. Sketching – many levels of fidelity
  35. What security measures can we put around our API?
  36. What security measures can we put around our API?
  37. What security measures can we put around our API?
  38. What security measures can we put around our API?
  39. What security measures can we put around our API?
  40. What security measures can we put around our API?
  41. What security measures can we put around our API?
  42. What security measures can we put around our API?
  43. What security measures can we put around our API?
  44. What security measures can we put around our API?
  45. What security measures can we put around our API?
  46. What security measures can we put around our API?
  47. What security measures can we put around our API?
  48. What security measures can we put around our API?
  49. What security measures can we put around our API?
  50. What security measures can we put around our API?
  51. What security measures can we put around our API?
  52. What security measures can we put around our API?
  53. What security measures can we put around our API?
  54. What security measures can we put around our API?
  55. What security measures can we put around our API?
  56. What security measures can we put around our API?
  57. What security measures can we put around our API?
  58. What security measures can we put around our API?
  59. What security measures can we put around our API?
  60. What security measures can we put around our API?
  61. What security measures can we put around our API?