Design Studios & Pen Sketching
for Makers of Apps & Websites
Kevin Goldman
Chief Design Architect
@kevingoldman
Jen Walsh
Senior UX Designer
@jendub
Chelsea Winkel
UX Strategist
@hirechelsea
Paul Van Tuyl
Senior Product Designer
@paulvantuyl
JOINING REMOTELY
Scottsdale, AZ
Jackalope. For real.
29th Drive
Our UX Consulting Firm
Inkwell.io
Our Sketch Kit
Today
First this
Sketching Tips & Tools
Then this
Design Studios
sketch, share, vote, present
Why bother sketching?
Pause before investing
Jason Fried’s Illustration from Signal vs Noise blog
Sketching Tips & Tools
Tools
Plain, Cheap White Paper *
0.5 mm Black Pen *
Grey Art Markers (2-3 Shades) *
1 Light Color Marker
1 Red Pen *
Small Ruler
Drafting Dots *
Kraft Paper *
Scissors / Xacto Knife
Post-Its *
Printed Templates
* provided for you to use today
Techniques
Sketching:
UIs & Paper Prototypes:
Sketchboarding
+
Remote
Sketching
Tips
Collaborative
Quick &
Unfinished
Communicative
Iterative
Don’t be
Closed Minded
Drum pants!
Don’t make it
Scarey & Stressful
Design Studios
What is a design studio?
Design Studio
Strategy Session
Recap Session
Strategy
Session
1-2 days in advance
1-2 main stakeholders
Introduce the format
Define focus areas / iterations
Design Studio
2-8 hours long
2-10 attendees
Cross-disciplinary
Flexible focus
Multiple iterations
Recap
Synthesize
Plan direction
Next steps
Why Have a Design Studio?
Today’s Design Studio
The Customer
The Design Problem
Your Challenge—Day 2
Design a mobile first solution that allows Rebuilding Together to manage projects from the field.
A contractor should be able to view a specific home site, see work completed, view work and materials needed, download, view, or email plans, complete tasks, leave notes, and upload photos.
Assign Roles
Timekeeper
Leader
Recorder
Facilitator—Inkwell Team
15 minute break
Welcome back
Iteration 1: Sketch
GUIDELINES
25 minutes
Quietly sketch as individuals
Use the sketch tools provided or your own
Sketch as many solutions as you can
Iteration 1: Present
GUIDELINES
25 minutes
Each person presents their solutions (3 min each)
Hang sketches on your group’s Sketchboard
During the presentations, take notes on ideas you like
Remote presentation demo
Iteration 2: Sketch
GUIDELINES
25 minutes
Quietly sketch as individuals
Build upon your strongest ideas
Think of new ideas
Use others’ ideas
Iteration 2: Present
GUIDELINES
25 minutes
Each person presents their solutions (3 min each)
Hang sketches on your group’s Sketchboard
During the presentations, take notes on ideas you like
Iteration 2: Vote
GUIDELINES
5 minutes
Each person needs 4 BLUE dots and 4 YELLOW dots
Place the BLUE dots next to successful features
Place the YELLOW dots next to unsuccessful features
What Comes Next?
Design Studio Recap
And Then?
Final Sketches
Digital Wireframes
Visual Design Comps
Design in browser
Prototype
Want to continue helping Rebuilding Together?
�chelsea@29thdrive.com
Thank you / Q&A
Kevin Goldman
Chief Design Architect
@kevingoldman
Jen Walsh
Senior UX Designer
@jendub
Chelsea Winkel
UX Strategist
@hirechelsea
Paul Van Tuyl
Senior Product Designer
@paulvantuyl
Group Presentations
GUIDELINES
25 minutes
(5 min each)
Select 1 person from your group to present
Each group rep presents the strongest ideas to the room
Your Challenge - Day 1
Design a mobile first solution that allows Rebuilding Together to recruit and connect volunteers with projects that match their skill set in their area.