Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Unit Design
SNAIL™
© 2014 SNAIL inc.
S NA IL™
Team memberos
● Communication
Sciences
○ Femke Geusens
○ Valerie Ottenburgs
○ Nienke Postma
○ Jasmien Verhoelst
●...
S NA IL™
Contents
● Approach
● Iterations
↻ 1 : Card sorting
↻ 2 : Wireframes & Flowcharts
↻ 3 : Paper Prototyping
● Refle...
S NA IL™
Approach
● Brainstorm
○ Functionality & appearance
● Low-fi screens (early design)
○ Quick ’n’ Dirty
○ Modifiabil...
S NA IL™
Card Sorting
“Focus on development of an information structure”
S NA IL™
Card Sorting
● Open card sorting
○ Participant freedom ↗
○ Add cards & group cards
● User testing
○ 5 participant...
S NA IL™
Wireframes
“Low-fidelity representations that serve as the
skeleton of the actual design”
S NA IL™
Wireframes
● Focus on structure
● No details (dummy text & wireframe boxes)
● Grouping information
● Identifying ...
S NA IL™
Wireframes
● User testing
○ 5 participants
○ A list of scenarios
○ Navigating through the app
○ Feedback on struc...
S NA IL™
Paper Prototypes
“Prototyping helps people to summarize their ideas,
demonstrate progress and expertise, surface ...
S NA IL™
Paper Prototypes
● Fast interaction
● Detailed content
● Digital prototyping
○ Design: Inkscape (vector graphics)...
S NA IL™
Reflection
● High fidelity digital prototype
● Ready for expert evaluation
S NA IL™
Q & A
Upcoming SlideShare
Loading in …5
×

[SNAIL] Unit Design

509 views

Published on

A brief summary of the Unit Design phase of a mobile sports application.

Published in: Social Media, Technology
  • Be the first to comment

  • Be the first to like this

[SNAIL] Unit Design

  1. 1. Unit Design SNAIL™ © 2014 SNAIL inc.
  2. 2. S NA IL™ Team memberos ● Communication Sciences ○ Femke Geusens ○ Valerie Ottenburgs ○ Nienke Postma ○ Jasmien Verhoelst ● Computer Sciences ○ Dennis Degryse ○ Ben Lefevere
  3. 3. S NA IL™ Contents ● Approach ● Iterations ↻ 1 : Card sorting ↻ 2 : Wireframes & Flowcharts ↻ 3 : Paper Prototyping ● Reflection
  4. 4. S NA IL™ Approach ● Brainstorm ○ Functionality & appearance ● Low-fi screens (early design) ○ Quick ’n’ Dirty ○ Modifiability ↗ ● Hi-fi screens (later design) ○ Decent example content
  5. 5. S NA IL™ Card Sorting “Focus on development of an information structure”
  6. 6. S NA IL™ Card Sorting ● Open card sorting ○ Participant freedom ↗ ○ Add cards & group cards ● User testing ○ 5 participants ○ Different profiles ○ Think-aloud ● Output ○ 5 - 9 major categories ○ Flowchart
  7. 7. S NA IL™ Wireframes “Low-fidelity representations that serve as the skeleton of the actual design”
  8. 8. S NA IL™ Wireframes ● Focus on structure ● No details (dummy text & wireframe boxes) ● Grouping information ● Identifying application screens & navigation ● Sketching & drawing flowchart ● Support for different designs ● Different design pattern libraries
  9. 9. S NA IL™ Wireframes ● User testing ○ 5 participants ○ A list of scenarios ○ Navigating through the app ○ Feedback on structural aspects ○ Think-aloud ○ Additional questions ● Output ○ Grouped per screen ○ Several structural problems
  10. 10. S NA IL™ Paper Prototypes “Prototyping helps people to summarize their ideas, demonstrate progress and expertise, surface implicit design vocabulary, and group communication and decision making”
  11. 11. S NA IL™ Paper Prototypes ● Fast interaction ● Detailed content ● Digital prototyping ○ Design: Inkscape (vector graphics) ○ Automation: Invisionapp ● First step towards expert review
  12. 12. S NA IL™ Reflection ● High fidelity digital prototype ● Ready for expert evaluation
  13. 13. S NA IL™ Q & A

×