Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Interactive prototyping
Search
jaideepsingh
August 24, 2013
Design
2
100
Interactive prototyping
A workshop on interactive prototyping using Indigo Studio - BA Conf, 2013
jaideepsingh
August 24, 2013
Tweet
Share
More Decks by jaideepsingh
See All by jaideepsingh
Mobile app analytics
jaideepsingh
0
130
Measuring the in-broswer experience
jaideepsingh
0
87
HTML5
jaideepsingh
1
220
Memory profile your JavaScript application
jaideepsingh
0
840
The mechanics of iconography
jaideepsingh
0
160
AngularJS
jaideepsingh
1
360
Tools and techniques to validate visual design
jaideepsingh
0
200
Other Decks in Design
See All in Design
Portfolio 齋藤明敏 Hiroyuki Saito_守秘義務あり
crearedesign
0
290
Them Middle School Kids Pitch
stevie_vee
0
140
SAMSUL KAMAR ABDUL RAHMAN
samsulrahman32
0
160
Design Studio Deck | インクルーシブデザインスタジオCULUUM
culumu
3
3.9k
数理的アプローチで挑むスマホUIのデザイン改善:タップ成功率推定ツール「Tappy」の社内活用事例 / Improving Smartphone UI Design with a Mathematical Approach: In-house Use Case of the Tap Success Rate Estimation Tool "Tappy"
lycorptech_jp
PRO
0
800
児童相談所における養育里親委託時の親権者同意に向けたコミュニケーションの実態
trivia
0
540
バイアスを凌ぐデザインとコード ―異動直後にどうふるまうか―
kkaru
0
550
AI時代に、僕たちデザイナーはどう歩むか
kazuhirokimura
0
370
Light My Fire/ハートに火をつけるコミュニティ
kgsi
1
150
Мышление историями. Как текстовые модели поведения помогают дизайнеру проектировать
ashapiro
0
140
サービスリブランディングにおけるイラストレーションシステムの構築と活用事例 / Building and Utilizing an Illustration System in Service Rebranding
lycorptech_jp
PRO
0
580
第4回関東Kaggler会LT HCD-Net人間中心設計スペシャリストが語るNotebookメダルの取り方
utm529f
0
1k
Featured
See All Featured
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
23
1.4k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
18
1.1k
Building Applications with DynamoDB
mza
96
6.6k
GraphQLとの向き合い方2022年版
quramy
49
14k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.4k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
A better future with KSS
kneath
239
17k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.5k
YesSQL, Process and Tooling at Scale
rocio
173
14k
Building Better People: How to give real-time feedback that sticks.
wjessup
368
19k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
Producing Creativity
orderedlist
PRO
347
40k
Transcript
Interactive Prototypes Jaideep Singh
Tools TIME FIDELITY Storyboards Prototypes Digital mockups HTML/CSS pages Dynamic
pages (DB etc)
What is a prototype Picture credits: Wikipedia
Why prototype Quick visual representation All stakeholders on the same
page Validate information architecture Early feedback
What is not a prototype Color & graphics Typography Detailed
interactions Working application
Paper vs digital
You can draw A straight line Circle Rectangle Triangle Shade
Paper prototype Create a todo app List of tasks Option
to mark tasks done Option to delete tasks Group tasks as completed and incomplete
General guidelines Straight lines Spacing between elements Post-Its for components
and for states Time limit the activity
Lifealytics demo http://www.youtube.com/watch?v=J- bVzUahNIg
Prototyping tools Solidify (Analytics) Invision (Collaboration) Antetype (Responsive) Balsamiq (Quick,
minimal) Wires (In-browser) Proto.io (Animations)
Indigo Studio Storyboards Interactive wireframes Import paper wireframes Animated transitions
Share FREE (v1.x)
The prototype Ecommerce app for a camera store Key categories
Screens Product listing Product details
List Detail
Thank you! @_jaideep