Essential Prototyping for Entrepreneurs

Ad

Ad

Ad

Ad

Ad

Ad

Ad

Ad

Ad

Ad

Ad

Ad

Essential
Prototyping for
Entrepreneurs
Test Your Business Idea in 1 Day
By Bow Kraivanich 
Cofounder of daydash.co
http:/...

Who am I ?
• Mentor at Hubba Stadium & Startup Weekend (Bangkok)
• Hubba Academy Instructor
• Managing Director at Blanksp...

Course Outline
⇾ Section 1: Prototyping Basics
⇾ Section 2: The Prototyping Processes
——————————— LAUNCH ————————————
⇾ Se...

Today’s Rule
80/20

Prototyping Basics
⇾ UX Vocab 101
⇾ What is a Prototype?
⇾ Why Creating Prototype?
⇾ Building effective prototypes
SECTION...

"
UX
VOCAB
101

cr: zykinetics.com
SKETCH

WIREFRAME
cr: blog.mockupbuilder.com

UI DESIGN/VISUAL DESIGN
cr: www.invisionapp.com

SKETCH
WIREFRAME
VISUAL DESIGN
Brainstorming idea
Structure, functional
Ready for development

SKETCH WIREFRAME
VISUAL DESIGN
MOCKUP
PROTOTYPE

What is a Prototype?

A Prototype is
“A plan for how it WORKS
not how it LOOKS, yet”

PROTOTYPE
cr: www.itaxsmart.com
Can navigate
Can interact with
Can have many different looks 
(sketch, wireframe, ﬁnal vis...

Why Creating Prototype?

“To Answer Questions and
to Generate New Ones”

Why Prototype?
Validate idea
Communicate idea
Provide clear understanding
Make a decision base on real feedback
Force you ...

Building Effective
Prototypes?

Building Effective Prototypes
It doesn’t have to be perfect
Know your audience, what they are expect
Always set goals
Buil...

The Prototyping Processes
⇾ Overview
⇾ Clarify your idea
⇾ Select your core features
⇾ Understand Prototype Fidelity
SECTI...

1. Clarify your idea
2. Planning
3. Create prototype
4. Testing & validation
The
Processes
Overview

Clarify Your Idea with Lean Canvas

Select your core features
For idea “Street Food Delivery”

List all features
(5 mins)
1

Prioritize
2
(5 mins)

EASYHARD
IMPORTANT
NOT IMPORTANT

EASYHARD
IMPORTANT
NOT IMPORTANT

Get rid of unnecessary
features
3
(5 mins)

EASYHARD
IMPORTANT
NOT IMPORTANT

EASYHARD
IMPORTANT
NOT IMPORTANT

EASYHARD
IMPORTANT
NOT IMPORTANT

Understand
Prototype Fidelity

Low-Fidelity
vs
High-Fidelity

Low-Fidelity
(Lo-Fi)

Hight-Fidelity
(Hi-Fi)

GET READY FOR THE
AFTER SESSION
1. download popapp (ios, android) - https://popapp.in
2 download balsamiq (mac, window)- h...

Picking the Right Tools
⇾ Things to consider when picking the tool
⇾ Popular tools
⇾ More Tools
SECTION: 3

Things to consider when picking the tool
Can share to get feedbacks and opinions
Can export / publish
Can view and test on...

Popular tools
Lo-Fi
POP app 
balsamiq mockups 3 
indigo studio
Proto.io 
moqups 
Adobe Xd
Hi-Fi  
(with stencil)
Invision ...

More tools
https://www.cooper.com/prototyping-tools

Workshop
⇾ Create lo-fi prototype using POP app (mobile app)
⇾ Create lo-fi prototype using Balsamiq (web)
⇾ Create hi-fi pro...

Before we start, you should have  
these tools ready!
1. download popapp (ios, android) - https://popapp.in
2 download bal...

WORKSHOP 3
Create lo-ﬁ prototype using POP app
Massage Guru (mobile app)
1. Sketch main pages on paper (2-4 pages)
2. Snap...

WORKSHOP 2
Create lo-ﬁ prototype using Balsamiq  
Google Search Clone (web)
1. Create 2 pages: homepage and search result ...

WORKSHOP 4
Create hi-ﬁ prototype using Proto.io
Instagram (mobile app)
1. Create 2 pages: Home and Proﬁle
2. Basic tools: ...

WORKSHOP 3
Create hi-ﬁ prototype using Proto.io
airbnb (web)
1. Create 2 pages: Browse & Detail Page
2. Set up web canvas
...

Testing & Evaluating
⇾ Create lo-ﬁ prototype using POP app (mobile app)
⇾ Create lo-ﬁ prototype using Balsamiq (web)
⇾ Cre...

What is the  
most important part  
of prototyping process?

Circles Of Feedback
Friend/
Family
Experts in
The ﬁeld
Target
Users

Basic Testing & Interviewing
1. Know your user
2. Introduce your idea in 1 minutes
3. Let them look and try to use your pr...

Collecting Data
1. Basic information
2. Positive Feedbacks
3. Comments
4. Rating

How many users do we need for testing?
You only need at least 3-5 users to start seeing trend

“Don’t stop here, get out of the building and
use your prototype to test with users!”
Q&A
Feel free to connect with me :) ...

Share Slideshare

LinkedIn
Facebook
Twitter

Embed

Size (px)

Show related Slideshows at end

WordPress Shortcode

Link

Share
Email

WordCamp BKK 2017: Designing WordPr... by Bow Kraivanich 5374 views
Design Network North: The Future of... by Peacock Carter Ltd 1006 views
Advanced Custom Fields - WordPress ... by Peacock Carter Ltd 316 views
WordPress North East - capturing mo... by Peacock Carter Ltd 658 views
Magento vs WooCommerce - October 20... by Peacock Carter Ltd 419 views
Introduction to Magento 2 (from Mag... by Peacock Carter Ltd 1271 views

View on Slideshare

1 of 54 Ad

View on Slideshare

1 of 54 Ad