1. STUDIO DESIGN
METHOD

2. HEY,
I’M BENJI!
@lazerhurst
I’m Lead Web Designer at Parisleaf, Artist and Illustrator.
I try and bridge the design process and the web development process
I research user experiences, interview users, watch user patterns.
I try and make sure targeted users are empathised with, so their
needs are understood and designed around.

3. LET’S
HAVE
FUN!
What is the Studio Design Method?
When should I use it?
Sketching
Do a couple sample rounds
Feedback?
What did we learn?

4. DESIGN
STUDIO
METHOD
Developed by Todd Zaki Werfel & Will Evans.
One of many methods you can use to solve problems.
infinitely customizable.
Great solution when there are:
• Lots of stakeholders who aren’t designers.
• Complex goals that need to be solved quickly.
• Multiple teams and partners that need buy-in.

5. BUT I’M
NOT A
DESIGNER!
Yes you are!
As cognitive psychologist Herbert Simon says,
“Everyone designs who devises courses of action aimed at
changing existing situations into preferred ones.”

6. BENEFITS
Generate lots of ideas quickly.
Instill a broad sense of ownership.
Create empathy with the end user.
Create team-wide buy in.
Remove people from their comfort zones.

7. HOW
TO
SKETCH
Design Studio Method is based on sketching.
Good news! Everyone can sketch.
But you need to know a few symbols first.

8. YOU
SKETCH!

9. YOU
SKETCH!
Divider
Image
Icon
Button
Text lines
Body text

14. TEAM
WORK Quantity: Aim for 5 people.
Diversity: Find folks with different expertise.
Gather up: Circle around a table.
BUSINESS
BALANCE
DESIGN DEV

15. THE
CHALLENGE Parisleaf is partnering up with the Gainesville Dev Academy, the
Gainesville Chamber, and the Gainesville Tech Council to launch
a project dubbed Gainesville Inspired.
It will communicate how attractive and vibrant our community
is for young professionals and entrepreneurs.
The key tools for the initiative will be a website that serves as
the main area for stories and activities, job opportunities, and
more.
Our challenge today will be to determine the layout of the
homepage of the desktop view of website.
We want to organize our key features and content to create
an impression that aligns with our personas’ goals, attributes,
attitudes, and aptitudes.

16. THE
TOOLS These are some potential components of the site.
Menu and Navigation structure.
Events calendar.
Featured stories & Featured Gainesville personalities.
Job listings.
A blog-style directory of notable Gainesville companies.
An interactive map of the city.
Photography scroll of people and events.

17. PERSONAS
Based on real research and data.
Aggregates of themes and analysis from the research phase.
Fictionalized stories to help us with empathy.
They’re not representative of any single user.
Similar to “an audience,” but tailored based on research.
Focusing on personas helps us address a more human
experience rather than a specific, fictional path.

18. PERSONA #1:
GAVIN
BELSON
Gainesville-based Web Engineer

19. PERSONA #2:
AMANDA
CREW
San Diego-based Social Media & SEO Manager

20. SKETCH
PITCH
CRITIQUE

21. SKETCH
PITCH
CRITIQUE
• Sketch > 5 minutes together
• Present > 2 minutes per person
• Critique > 2 minutes per person
• Repeat
Ready? Go!

22. SKETCH
5 MINUTES Based on the challenge, use the symbols to sketch where
you think each tool should be placed on the homepage.
Remember, you’re sketching for the persona.

23. PITCH
2 MINUTES Explain the benefits of your design.
How and why does this hit on the goals of the persona?
REMEMBER : It’s not your personal preference.
(“I’d like...”)
Empathize with the persona.
(“Gavin wants to...”)

24. CRITIQUE
2 MINUTES Did they successfully achieve the goals of the persona?
Share 2-3 ways the design solves the problem.
Share 1-2 opportunities to improve.
No “likes.” Give goal based critique.

25. LET’S
TALK! What’d you think?
What was tough? What was easy?
Did you focus on the persona or your opinion?
How was sketching? Was it clear?

26. THE
TAKEAWAYS Some people do this in 1 hour, 3 hours, or 5 hours.
It’s all about:
• Research
• Empathy
• Collaboration
• Critique

27. LET’S
KEEP
TALKING!
Benji Haselhurst, Lead Web Designer
benji@parisleaf.com // @lazerhurst
(352) 377-5560
www.parisleaf.com
@parisleaf // #parisleafgrows