SlideShare a Scribd company logo
1 of 25
Download to read offline
Prototyping
with virtually no budget and no tech skills!
Why prototype?
•   Mobile development can get pricey

•   Mobile development can take time and can get
    bogged down

•   Prototyping helps manage cost and risk

•   Prototyping helps get buy-in and user
    acceptance/usability out of the way earlier
Considerations
The Basics
 •   Building Prototypes should be EASY

 •   Prototypes should not need to be pixel
     perfect

 •   Prototypes goals need to be clearly spelled
     out prior to creation

 •   Build Prototypes that have an output that
     everyone can see

 •   If animations, etc. are going to be used in the
     final, attempt to build them in the prototype
Fidelity vs. Functionality
  •   Functional Fidelity and Visual Fidelity

  •   You need to envision the goals for the
      prototype

  •   Choose method and graphic sophistication
      based on the goals.

  •   More “Production Ready” = more time

  •   More graphically rich = more time

  •   More revisions at this point are less expensive
      than later
Fidelity vs. Effort
A few prototyping
     options.
Paper prototype
Pros

 •     Inexpensive

 •     Easy
Cons

 •     Doesn't really emulate the UX

 •     Hard to pull off a complicated design or one
       with a lot of screens/data

 •     None of the design elements/deliverables
       really will live on

 •     Tough to justify with so many good tools
       these days.
Paper Example
HTML/CSS
Pros

  •    Inexpensive

  •    Easy

  •    Using Webkit based browsers, you can emulate mobile
       devices pretty well

  •    There are tools popping up now that ease this
       considerably

Cons

  •    More tech knowledge might be required than simple
       paper prototypes

  •    There is still very little reuse of assets for the final version,
       unless you are going to mobile web, not apps
HTML/CSS Example
http://www.adobe.com/devnet/dreamweaver/articles/getting-started-with-jquery-mobile.html
New! Rapid
prototyping tools.
FieldTest
Pros

  •    Inexpensive (so I’ve been assured)

  •    Super-easy!

  •    Web/Cloud based (so it's collaborative)

  •    Results are pretty stellar

Cons

  •    It's still in beta

  •    Pricing is as of yet ???

  •    Assets are not going to be used for the final deliverable
Field Test Example
Tools that aren't really
 for prototyping, but
 still work pretty well.
Powerpoint/Keynote
Pros

  •    Most everyone has one of these

  •    Reasonably easy to use for any one familiar with desktop
       publishing tools

  •    Produces interactivity and animation

Cons

  •    It's a tad expensive if you don’t own it already

  •    None of the design elements/deliverables really will live on

  •    Good UI Stencils are tough to find or need reprep

  •    Output isn’t really “mobile”
Keynote Examples
    http://keynotekungfu.com
Omnigraffle
Pros

  •    great toolset – highly extensible, large community

  •    Produces fantastic diagrams and high quality output

  •    Reasonably easy to use for any one familiar with desktop
       publishing tools

  •    produces interactivity

  •    move from wireframe to prototype easily

Cons

  •    It's a tad expensive

  •    Mac only (which might also be considered a 'Pro')

  •    None of the design elements/deliverables really will live on
Graffle!
Digital Publishing Suite
Pros

  •    Uses InDesign

  •    Produces rich interactivity

  •    Allows for media

Cons

  •    Fairly pricey if you want to take it past a prototype and use
       it for production

  •    Does require InDesign, which some of you may not have

  •    Output is iPad only
DPS
Lots more examples in
      App Savvy
Wrap it up, already.
Why prototype?
•   Prototyping is fast

•   Prototyping is easy

•   Prototyping gets stakeholders involved sooner

•   Prototyping saves money
Finishing up
 •   Q&A

 •   Discussion

More Related Content

More from Chad Udell

Whats Next for Mobile Learning
Whats Next for Mobile LearningWhats Next for Mobile Learning
Whats Next for Mobile LearningChad Udell
 
There Is No Easy Button
There Is No Easy ButtonThere Is No Easy Button
There Is No Easy ButtonChad Udell
 
Learning Tracking Out of the LMS and Embracing Learning Analytics
Learning Tracking Out of the LMS and Embracing Learning AnalyticsLearning Tracking Out of the LMS and Embracing Learning Analytics
Learning Tracking Out of the LMS and Embracing Learning AnalyticsChad Udell
 
The Leadership Challenge - mLearnCon
The Leadership Challenge - mLearnConThe Leadership Challenge - mLearnCon
The Leadership Challenge - mLearnConChad Udell
 
Design concepts for Mobile Learnng
Design concepts for Mobile LearnngDesign concepts for Mobile Learnng
Design concepts for Mobile LearnngChad Udell
 
ASTD St. Louis Presentation - July 28th
ASTD St. Louis Presentation - July 28thASTD St. Louis Presentation - July 28th
ASTD St. Louis Presentation - July 28thChad Udell
 
Is Mobile For Me? What Skills Do I Need?
Is Mobile For Me? What Skills Do I Need?Is Mobile For Me? What Skills Do I Need?
Is Mobile For Me? What Skills Do I Need?Chad Udell
 
How to Convert Your eLearning to Mobile
How to Convert Your eLearning to MobileHow to Convert Your eLearning to Mobile
How to Convert Your eLearning to MobileChad Udell
 
Max 2010- Building Mobile Learning with Your Existing eLearning Toolkit - Ado...
Max 2010- Building Mobile Learning with Your Existing eLearning Toolkit - Ado...Max 2010- Building Mobile Learning with Your Existing eLearning Toolkit - Ado...
Max 2010- Building Mobile Learning with Your Existing eLearning Toolkit - Ado...Chad Udell
 
Comparing the Four Main Mobile OSes
Comparing the Four Main Mobile OSesComparing the Four Main Mobile OSes
Comparing the Four Main Mobile OSesChad Udell
 
Creating mLearning With Your Existing Toolkit
Creating mLearning With Your Existing ToolkitCreating mLearning With Your Existing Toolkit
Creating mLearning With Your Existing ToolkitChad Udell
 
Hacking Robots for Fun and Profit
Hacking Robots for Fun and ProfitHacking Robots for Fun and Profit
Hacking Robots for Fun and ProfitChad Udell
 
Hacking Robots for Fun and Profit
Hacking Robots for Fun and ProfitHacking Robots for Fun and Profit
Hacking Robots for Fun and ProfitChad Udell
 
History of Generative and Computer Art
History of Generative and Computer ArtHistory of Generative and Computer Art
History of Generative and Computer ArtChad Udell
 
A Brief Intro to Adobe Flex
A Brief Intro to Adobe FlexA Brief Intro to Adobe Flex
A Brief Intro to Adobe FlexChad Udell
 
Social Media 101
Social Media 101Social Media 101
Social Media 101Chad Udell
 
Designers are from Venus - Presentationas Given to CD2
Designers are from Venus - Presentationas Given to CD2Designers are from Venus - Presentationas Given to CD2
Designers are from Venus - Presentationas Given to CD2Chad Udell
 
Ria Palooza2 Presentation
Ria Palooza2 PresentationRia Palooza2 Presentation
Ria Palooza2 PresentationChad Udell
 
Dev Learn Handout - Session 604
Dev Learn Handout - Session 604Dev Learn Handout - Session 604
Dev Learn Handout - Session 604Chad Udell
 

More from Chad Udell (20)

Prototyping
PrototypingPrototyping
Prototyping
 
Whats Next for Mobile Learning
Whats Next for Mobile LearningWhats Next for Mobile Learning
Whats Next for Mobile Learning
 
There Is No Easy Button
There Is No Easy ButtonThere Is No Easy Button
There Is No Easy Button
 
Learning Tracking Out of the LMS and Embracing Learning Analytics
Learning Tracking Out of the LMS and Embracing Learning AnalyticsLearning Tracking Out of the LMS and Embracing Learning Analytics
Learning Tracking Out of the LMS and Embracing Learning Analytics
 
The Leadership Challenge - mLearnCon
The Leadership Challenge - mLearnConThe Leadership Challenge - mLearnCon
The Leadership Challenge - mLearnCon
 
Design concepts for Mobile Learnng
Design concepts for Mobile LearnngDesign concepts for Mobile Learnng
Design concepts for Mobile Learnng
 
ASTD St. Louis Presentation - July 28th
ASTD St. Louis Presentation - July 28thASTD St. Louis Presentation - July 28th
ASTD St. Louis Presentation - July 28th
 
Is Mobile For Me? What Skills Do I Need?
Is Mobile For Me? What Skills Do I Need?Is Mobile For Me? What Skills Do I Need?
Is Mobile For Me? What Skills Do I Need?
 
How to Convert Your eLearning to Mobile
How to Convert Your eLearning to MobileHow to Convert Your eLearning to Mobile
How to Convert Your eLearning to Mobile
 
Max 2010- Building Mobile Learning with Your Existing eLearning Toolkit - Ado...
Max 2010- Building Mobile Learning with Your Existing eLearning Toolkit - Ado...Max 2010- Building Mobile Learning with Your Existing eLearning Toolkit - Ado...
Max 2010- Building Mobile Learning with Your Existing eLearning Toolkit - Ado...
 
Comparing the Four Main Mobile OSes
Comparing the Four Main Mobile OSesComparing the Four Main Mobile OSes
Comparing the Four Main Mobile OSes
 
Creating mLearning With Your Existing Toolkit
Creating mLearning With Your Existing ToolkitCreating mLearning With Your Existing Toolkit
Creating mLearning With Your Existing Toolkit
 
Hacking Robots for Fun and Profit
Hacking Robots for Fun and ProfitHacking Robots for Fun and Profit
Hacking Robots for Fun and Profit
 
Hacking Robots for Fun and Profit
Hacking Robots for Fun and ProfitHacking Robots for Fun and Profit
Hacking Robots for Fun and Profit
 
History of Generative and Computer Art
History of Generative and Computer ArtHistory of Generative and Computer Art
History of Generative and Computer Art
 
A Brief Intro to Adobe Flex
A Brief Intro to Adobe FlexA Brief Intro to Adobe Flex
A Brief Intro to Adobe Flex
 
Social Media 101
Social Media 101Social Media 101
Social Media 101
 
Designers are from Venus - Presentationas Given to CD2
Designers are from Venus - Presentationas Given to CD2Designers are from Venus - Presentationas Given to CD2
Designers are from Venus - Presentationas Given to CD2
 
Ria Palooza2 Presentation
Ria Palooza2 PresentationRia Palooza2 Presentation
Ria Palooza2 Presentation
 
Dev Learn Handout - Session 604
Dev Learn Handout - Session 604Dev Learn Handout - Session 604
Dev Learn Handout - Session 604
 

Recently uploaded

Snow Chain-Integrated Tire for a Safe Drive on Winter Roads
Snow Chain-Integrated Tire for a Safe Drive on Winter RoadsSnow Chain-Integrated Tire for a Safe Drive on Winter Roads
Snow Chain-Integrated Tire for a Safe Drive on Winter RoadsHyundai Motor Group
 
Pigging Solutions in Pet Food Manufacturing
Pigging Solutions in Pet Food ManufacturingPigging Solutions in Pet Food Manufacturing
Pigging Solutions in Pet Food ManufacturingPigging Solutions
 
New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024
New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024
New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024BookNet Canada
 
#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024BookNet Canada
 
Advanced Test Driven-Development @ php[tek] 2024
Advanced Test Driven-Development @ php[tek] 2024Advanced Test Driven-Development @ php[tek] 2024
Advanced Test Driven-Development @ php[tek] 2024Scott Keck-Warren
 
Key Features Of Token Development (1).pptx
Key  Features Of Token  Development (1).pptxKey  Features Of Token  Development (1).pptx
Key Features Of Token Development (1).pptxLBM Solutions
 
APIForce Zurich 5 April Automation LPDG
APIForce Zurich 5 April  Automation LPDGAPIForce Zurich 5 April  Automation LPDG
APIForce Zurich 5 April Automation LPDGMarianaLemus7
 
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks..."LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...Fwdays
 
Artificial intelligence in the post-deep learning era
Artificial intelligence in the post-deep learning eraArtificial intelligence in the post-deep learning era
Artificial intelligence in the post-deep learning eraDeakin University
 
Streamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupStreamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupFlorian Wilhelm
 
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmaticsKotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmaticsAndrey Dotsenko
 
Pigging Solutions Piggable Sweeping Elbows
Pigging Solutions Piggable Sweeping ElbowsPigging Solutions Piggable Sweeping Elbows
Pigging Solutions Piggable Sweeping ElbowsPigging Solutions
 
Transcript: New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024BookNet Canada
 
Making_way_through_DLL_hollowing_inspite_of_CFG_by_Debjeet Banerjee.pptx
Making_way_through_DLL_hollowing_inspite_of_CFG_by_Debjeet Banerjee.pptxMaking_way_through_DLL_hollowing_inspite_of_CFG_by_Debjeet Banerjee.pptx
Making_way_through_DLL_hollowing_inspite_of_CFG_by_Debjeet Banerjee.pptxnull - The Open Security Community
 
CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):comworks
 
Beyond Boundaries: Leveraging No-Code Solutions for Industry Innovation
Beyond Boundaries: Leveraging No-Code Solutions for Industry InnovationBeyond Boundaries: Leveraging No-Code Solutions for Industry Innovation
Beyond Boundaries: Leveraging No-Code Solutions for Industry InnovationSafe Software
 
Bun (KitWorks Team Study 노별마루 발표 2024.4.22)
Bun (KitWorks Team Study 노별마루 발표 2024.4.22)Bun (KitWorks Team Study 노별마루 발표 2024.4.22)
Bun (KitWorks Team Study 노별마루 발표 2024.4.22)Wonjun Hwang
 
My INSURER PTE LTD - Insurtech Innovation Award 2024
My INSURER PTE LTD - Insurtech Innovation Award 2024My INSURER PTE LTD - Insurtech Innovation Award 2024
My INSURER PTE LTD - Insurtech Innovation Award 2024The Digital Insurer
 
Build your next Gen AI Breakthrough - April 2024
Build your next Gen AI Breakthrough - April 2024Build your next Gen AI Breakthrough - April 2024
Build your next Gen AI Breakthrough - April 2024Neo4j
 

Recently uploaded (20)

Snow Chain-Integrated Tire for a Safe Drive on Winter Roads
Snow Chain-Integrated Tire for a Safe Drive on Winter RoadsSnow Chain-Integrated Tire for a Safe Drive on Winter Roads
Snow Chain-Integrated Tire for a Safe Drive on Winter Roads
 
Pigging Solutions in Pet Food Manufacturing
Pigging Solutions in Pet Food ManufacturingPigging Solutions in Pet Food Manufacturing
Pigging Solutions in Pet Food Manufacturing
 
New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024
New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024
New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024
 
#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
 
Advanced Test Driven-Development @ php[tek] 2024
Advanced Test Driven-Development @ php[tek] 2024Advanced Test Driven-Development @ php[tek] 2024
Advanced Test Driven-Development @ php[tek] 2024
 
Key Features Of Token Development (1).pptx
Key  Features Of Token  Development (1).pptxKey  Features Of Token  Development (1).pptx
Key Features Of Token Development (1).pptx
 
APIForce Zurich 5 April Automation LPDG
APIForce Zurich 5 April  Automation LPDGAPIForce Zurich 5 April  Automation LPDG
APIForce Zurich 5 April Automation LPDG
 
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks..."LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
 
Artificial intelligence in the post-deep learning era
Artificial intelligence in the post-deep learning eraArtificial intelligence in the post-deep learning era
Artificial intelligence in the post-deep learning era
 
Streamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupStreamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project Setup
 
DMCC Future of Trade Web3 - Special Edition
DMCC Future of Trade Web3 - Special EditionDMCC Future of Trade Web3 - Special Edition
DMCC Future of Trade Web3 - Special Edition
 
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmaticsKotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
 
Pigging Solutions Piggable Sweeping Elbows
Pigging Solutions Piggable Sweeping ElbowsPigging Solutions Piggable Sweeping Elbows
Pigging Solutions Piggable Sweeping Elbows
 
Transcript: New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024
 
Making_way_through_DLL_hollowing_inspite_of_CFG_by_Debjeet Banerjee.pptx
Making_way_through_DLL_hollowing_inspite_of_CFG_by_Debjeet Banerjee.pptxMaking_way_through_DLL_hollowing_inspite_of_CFG_by_Debjeet Banerjee.pptx
Making_way_through_DLL_hollowing_inspite_of_CFG_by_Debjeet Banerjee.pptx
 
CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):
 
Beyond Boundaries: Leveraging No-Code Solutions for Industry Innovation
Beyond Boundaries: Leveraging No-Code Solutions for Industry InnovationBeyond Boundaries: Leveraging No-Code Solutions for Industry Innovation
Beyond Boundaries: Leveraging No-Code Solutions for Industry Innovation
 
Bun (KitWorks Team Study 노별마루 발표 2024.4.22)
Bun (KitWorks Team Study 노별마루 발표 2024.4.22)Bun (KitWorks Team Study 노별마루 발표 2024.4.22)
Bun (KitWorks Team Study 노별마루 발표 2024.4.22)
 
My INSURER PTE LTD - Insurtech Innovation Award 2024
My INSURER PTE LTD - Insurtech Innovation Award 2024My INSURER PTE LTD - Insurtech Innovation Award 2024
My INSURER PTE LTD - Insurtech Innovation Award 2024
 
Build your next Gen AI Breakthrough - April 2024
Build your next Gen AI Breakthrough - April 2024Build your next Gen AI Breakthrough - April 2024
Build your next Gen AI Breakthrough - April 2024
 

Prototyping on a Shoestring with Virtually No Tech Skills!

  • 1. Prototyping with virtually no budget and no tech skills!
  • 2. Why prototype? • Mobile development can get pricey • Mobile development can take time and can get bogged down • Prototyping helps manage cost and risk • Prototyping helps get buy-in and user acceptance/usability out of the way earlier
  • 4. The Basics • Building Prototypes should be EASY • Prototypes should not need to be pixel perfect • Prototypes goals need to be clearly spelled out prior to creation • Build Prototypes that have an output that everyone can see • If animations, etc. are going to be used in the final, attempt to build them in the prototype
  • 5. Fidelity vs. Functionality • Functional Fidelity and Visual Fidelity • You need to envision the goals for the prototype • Choose method and graphic sophistication based on the goals. • More “Production Ready” = more time • More graphically rich = more time • More revisions at this point are less expensive than later
  • 7. A few prototyping options.
  • 8. Paper prototype Pros • Inexpensive • Easy Cons • Doesn't really emulate the UX • Hard to pull off a complicated design or one with a lot of screens/data • None of the design elements/deliverables really will live on • Tough to justify with so many good tools these days.
  • 10. HTML/CSS Pros • Inexpensive • Easy • Using Webkit based browsers, you can emulate mobile devices pretty well • There are tools popping up now that ease this considerably Cons • More tech knowledge might be required than simple paper prototypes • There is still very little reuse of assets for the final version, unless you are going to mobile web, not apps
  • 13. FieldTest Pros • Inexpensive (so I’ve been assured) • Super-easy! • Web/Cloud based (so it's collaborative) • Results are pretty stellar Cons • It's still in beta • Pricing is as of yet ??? • Assets are not going to be used for the final deliverable
  • 15. Tools that aren't really for prototyping, but still work pretty well.
  • 16. Powerpoint/Keynote Pros • Most everyone has one of these • Reasonably easy to use for any one familiar with desktop publishing tools • Produces interactivity and animation Cons • It's a tad expensive if you don’t own it already • None of the design elements/deliverables really will live on • Good UI Stencils are tough to find or need reprep • Output isn’t really “mobile”
  • 17. Keynote Examples http://keynotekungfu.com
  • 18. Omnigraffle Pros • great toolset – highly extensible, large community • Produces fantastic diagrams and high quality output • Reasonably easy to use for any one familiar with desktop publishing tools • produces interactivity • move from wireframe to prototype easily Cons • It's a tad expensive • Mac only (which might also be considered a 'Pro') • None of the design elements/deliverables really will live on
  • 20. Digital Publishing Suite Pros • Uses InDesign • Produces rich interactivity • Allows for media Cons • Fairly pricey if you want to take it past a prototype and use it for production • Does require InDesign, which some of you may not have • Output is iPad only
  • 21. DPS
  • 22. Lots more examples in App Savvy
  • 23. Wrap it up, already.
  • 24. Why prototype? • Prototyping is fast • Prototyping is easy • Prototyping gets stakeholders involved sooner • Prototyping saves money
  • 25. Finishing up • Q&A • Discussion

Editor's Notes

  1. Use skills and tools you or your team have mastered or can easily pick up. This isn’t a masterpiece Make sure everyone is on the same page Don’t use proprietary or hard to use file formats Add polish where it helps you sell.
  2. Lo fi to address structural and IA issues Hi Fi to address usability and graphics issues Early prototypes need to address IA and Features Later needs to address usability and user acceptance