SlideShare une entreprise Scribd logo
1  sur  22
Télécharger pour lire hors ligne
Design that
scales


   Methods and best practices to grow gracefully.

                                                    1
I am Eileen Allen
Super Mom, Photographer, Designer
& Creative Director @ AtlanticBT




                                    @eileenallen
                                                   2
3
4
Drink the kool aid
Process... Weʼre talking about process?! (Allen Iversonʼs voice)
You have to buy into your process, but donʼt let it handcuff you.

    BRIEF      research      ideas     solution     production     product




                                                                             5
the setup
The days of starting your project on a blank Photoshop canvas are
done. It requires too much wasted time and energy.




                     BRIEF    research   ideas




                                                                    6
Our creative arsenal
Whether you are a team of one, a small shop looking to expand, or a
massive force, you can benefit from thorough planning.
   Client Brief / Worksheet
   Creative Brief
   Idea Brief
   Co-Design
   Styleboard


This collection of “setup” methods is meant to help us do one thing...
Think Before We Do.



                                                                         7
Client Brief
This is usually the first interaction a client has with our design team.
   It allows clients to share their hopes and dreams.
   The worksheet is meant to help clients self-evaluate, organize
   their thoughts, and share their preferences.




                                           


                                                                          8
Example Question
How involved do you want to be in the design process of your site?
   I trust your expertise and leave the design decisions up to you.
   I would like to have a say in the design of my site.
   I know exactly what I want and would like you to follow my
   instructions.




                                     Visit Atlantic BTʼs Actual Worksheet http://www.atlanticbt.com/client-worksheet.php


                                                                                                                           9
creative brief
This is NOT your grandmaʼs brief. Instead, we ask a series of five
questions during the client kick off meeting.




                                                                    10
creative brief
 Define purpose. Why do you feel like you need a site?
 Define sales process. How do you communicate who you are to
 clients?
 Define the users. Who is the site for?
 Define the end user goal (for each class if more than one). What
 is the desired action?
 Define the look and feel. Confirmation of client brief (theme,
 colourway, risk factor)




                                                                   11
idea brief
“An idea brief is a sentence, or
two, that sums up the project and
frames it as a problem statement.
A question that needs an answer.”
                   - Mark Boulton




                                    Source http://www.alistapart.com/articles/savingthespark/


                                                                                                12
idea brief
Actual examples of our previous brief briefs include:
   This client needs to distinguish themselves from the competition
   by making a complex process easy for customers to understand.
   This client needs the site to reflect the innovation in their
   technology, communicate how they are ahead of the curve in their
   industry, and highlight their credibility.
   This client needs a site design that better reflects their reputation
   and attract high-end clientele.




                                                                          13
co-design
Co-Design is a brainstorming session where the project team
collaborates and share their perspective on the common goals.
   Use the idea brief to springboard into the co-design workshop.


Co-Design can happen:
   You and a client
   You and another designer
   You and UX
   You and UX and marketing and PM
   You and all of the above

                                          The concept was adopted from Leah Buley, formerly of Adaptive Path.


                                                                                                                14
co-design
The benefits of co-design sessions
include:
   No one comes in empty
   handed.
   Helps to prioritize elements
   and features.
   We identify/solve the layout
   through ideation.
   Everyone has a voice, because
   all ideas are good ideas.
   Bada-bing: Wireframe!



                                    15
style board
Itʼs like if a style guide and a mood board had a baby!
Have you ever had a client:
   Be surprised by your design choices?
   Ever point out that you used the wrong kind of camo for the
   background of their military equipment catalog site?


To prevent these surprises and potentially embarrassing mistakes,
we start with style boards to help the client visualize our direction
before we begin designing.




                                                                        16
17
18
style board
The key benefits of a style board include:
   Eliminates surprises.
   Designers are better prepared.
   Avoids designing in a vacuum.




                                            19
sharing is caring




                    20
THank You




            21
Photo Credits
http://designingfortheweb.co.uk/
http://manpacks.com/blog/wp-content/uploads/2011/01/underwear_icon-200x150.png
http://tinawatkins.files.wordpress.com/2010/09/care-bears.jpg




                                                                                 22

Contenu connexe

Tendances

Design studio: A team alignment secret weapon - Modev MVP Conference
Design studio: A team alignment secret weapon - Modev MVP ConferenceDesign studio: A team alignment secret weapon - Modev MVP Conference
Design studio: A team alignment secret weapon - Modev MVP Conference
John Whalen
 
IBM Design Thinking_fin
IBM Design Thinking_finIBM Design Thinking_fin
IBM Design Thinking_fin
tadams76
 
Digital trends 2013
Digital trends 2013Digital trends 2013
Digital trends 2013
Adam Hassan
 
UX Capabilities Presentation
UX Capabilities PresentationUX Capabilities Presentation
UX Capabilities Presentation
Laurel Tripp
 

Tendances (20)

Class22
Class22Class22
Class22
 
Donna Marchand Designs
Donna Marchand DesignsDonna Marchand Designs
Donna Marchand Designs
 
Design studio: A team alignment secret weapon - Modev MVP Conference
Design studio: A team alignment secret weapon - Modev MVP ConferenceDesign studio: A team alignment secret weapon - Modev MVP Conference
Design studio: A team alignment secret weapon - Modev MVP Conference
 
4 MISCONCEPTIONS ABOUT UX DESIGN AND ONE HARD-TO-IGNORE TRUTH
4 MISCONCEPTIONS ABOUT UX DESIGN AND ONE HARD-TO-IGNORE TRUTH4 MISCONCEPTIONS ABOUT UX DESIGN AND ONE HARD-TO-IGNORE TRUTH
4 MISCONCEPTIONS ABOUT UX DESIGN AND ONE HARD-TO-IGNORE TRUTH
 
IBM Design Thinking - nano - Workshop @Sprint Collaboration Day
 IBM Design Thinking - nano - Workshop  @Sprint Collaboration Day IBM Design Thinking - nano - Workshop  @Sprint Collaboration Day
IBM Design Thinking - nano - Workshop @Sprint Collaboration Day
 
Product Management Class for Digital Startups
Product Management Class for Digital StartupsProduct Management Class for Digital Startups
Product Management Class for Digital Startups
 
How to be a good web designer
How to be a good web designerHow to be a good web designer
How to be a good web designer
 
Innovation Games Overview
Innovation Games OverviewInnovation Games Overview
Innovation Games Overview
 
IBM Design Thinking_fin
IBM Design Thinking_finIBM Design Thinking_fin
IBM Design Thinking_fin
 
Khalid Gaffer | UI/UX Designer Portfolio
Khalid Gaffer | UI/UX Designer PortfolioKhalid Gaffer | UI/UX Designer Portfolio
Khalid Gaffer | UI/UX Designer Portfolio
 
Designing a Digital Product at a Startup
Designing a Digital Product at a Startup Designing a Digital Product at a Startup
Designing a Digital Product at a Startup
 
It's a startup life: from idea to execution.
It's a startup life: from idea to execution.It's a startup life: from idea to execution.
It's a startup life: from idea to execution.
 
Digital trends 2013
Digital trends 2013Digital trends 2013
Digital trends 2013
 
UX Capabilities Presentation
UX Capabilities PresentationUX Capabilities Presentation
UX Capabilities Presentation
 
What is Importance of Storyboarding
What is Importance of StoryboardingWhat is Importance of Storyboarding
What is Importance of Storyboarding
 
Creative Workshop Bonus Challenges
Creative Workshop Bonus ChallengesCreative Workshop Bonus Challenges
Creative Workshop Bonus Challenges
 
Aaron Batalion, LivingSocial, Lean Startup SXSW
Aaron Batalion, LivingSocial, Lean Startup SXSWAaron Batalion, LivingSocial, Lean Startup SXSW
Aaron Batalion, LivingSocial, Lean Startup SXSW
 
Build a Product From Vision To Destiny
Build a Product From Vision To Destiny Build a Product From Vision To Destiny
Build a Product From Vision To Destiny
 
Using IBM Design Thinking in Everyday Job 2017
Using IBM Design Thinking in Everyday Job 2017Using IBM Design Thinking in Everyday Job 2017
Using IBM Design Thinking in Everyday Job 2017
 
Building Buy-In: 
Internally Positioning UX 
for Executive Impact. BigDesign...
Building Buy-In: 
Internally Positioning UX 
for Executive Impact.  BigDesign...Building Buy-In: 
Internally Positioning UX 
for Executive Impact.  BigDesign...
Building Buy-In: 
Internally Positioning UX 
for Executive Impact. BigDesign...
 

Similaire à Design that Scales: Methods and best practices to grow gracefully

Design Thinking (Workshop Guide)
Design Thinking (Workshop Guide)Design Thinking (Workshop Guide)
Design Thinking (Workshop Guide)
Operational Excellence Consulting
 
Introduction to Design Thinking
Introduction to Design ThinkingIntroduction to Design Thinking
Introduction to Design Thinking
Operational Excellence Consulting
 
16 Practical Insights from Designing Software
16 Practical Insights from Designing Software16 Practical Insights from Designing Software
16 Practical Insights from Designing Software
Kok Chiann
 
Getting Sign Off Larissa Meek
Getting Sign Off Larissa MeekGetting Sign Off Larissa Meek
Getting Sign Off Larissa Meek
Carsonified Team
 

Similaire à Design that Scales: Methods and best practices to grow gracefully (20)

Growth Patterns: Building a foundation for expansion — Driving, or being driv...
Growth Patterns: Building a foundation for expansion — Driving, or being driv...Growth Patterns: Building a foundation for expansion — Driving, or being driv...
Growth Patterns: Building a foundation for expansion — Driving, or being driv...
 
Design Thinking (Workshop Guide)
Design Thinking (Workshop Guide)Design Thinking (Workshop Guide)
Design Thinking (Workshop Guide)
 
Introduction to Design Thinking
Introduction to Design ThinkingIntroduction to Design Thinking
Introduction to Design Thinking
 
A Developer’s Guide to Interaction and Interface Design
A Developer’s Guide to Interaction and Interface DesignA Developer’s Guide to Interaction and Interface Design
A Developer’s Guide to Interaction and Interface Design
 
16 Practical Insights from Designing Software
16 Practical Insights from Designing Software16 Practical Insights from Designing Software
16 Practical Insights from Designing Software
 
The Design Mind: Design Thinking Strategies for Facilitating Growth and Perfo...
The Design Mind: Design Thinking Strategies for Facilitating Growth and Perfo...The Design Mind: Design Thinking Strategies for Facilitating Growth and Perfo...
The Design Mind: Design Thinking Strategies for Facilitating Growth and Perfo...
 
Evolving the Creative Process
Evolving the Creative ProcessEvolving the Creative Process
Evolving the Creative Process
 
DMI Views - Bridging The Designer/Client Relationship
DMI Views - Bridging The Designer/Client RelationshipDMI Views - Bridging The Designer/Client Relationship
DMI Views - Bridging The Designer/Client Relationship
 
DMI Views: Bridging the designer/client relationship—It's not them. It's us.
DMI Views: Bridging the designer/client relationship—It's not them. It's us. DMI Views: Bridging the designer/client relationship—It's not them. It's us.
DMI Views: Bridging the designer/client relationship—It's not them. It's us.
 
VDIS10022 Advanced Graphic Design Studio - Lecture 3 - Selling Ideas
VDIS10022 Advanced Graphic Design Studio - Lecture 3 - Selling IdeasVDIS10022 Advanced Graphic Design Studio - Lecture 3 - Selling Ideas
VDIS10022 Advanced Graphic Design Studio - Lecture 3 - Selling Ideas
 
Client centric web design
Client centric web designClient centric web design
Client centric web design
 
005_190112 Bookclub-In House Design chapter 02
005_190112 Bookclub-In House Design chapter 02005_190112 Bookclub-In House Design chapter 02
005_190112 Bookclub-In House Design chapter 02
 
The Professional Design Process
The Professional Design ProcessThe Professional Design Process
The Professional Design Process
 
The Minimum Loveable Product: Go Beyond the Minimum Viable Product
The Minimum Loveable Product: Go Beyond the Minimum Viable ProductThe Minimum Loveable Product: Go Beyond the Minimum Viable Product
The Minimum Loveable Product: Go Beyond the Minimum Viable Product
 
Getting Sign Off Larissa Meek
Getting Sign Off Larissa MeekGetting Sign Off Larissa Meek
Getting Sign Off Larissa Meek
 
Power of define, ideate power of prototyping
Power of define, ideate power of prototypingPower of define, ideate power of prototyping
Power of define, ideate power of prototyping
 
Design Thinking: A Common Sense Process
Design Thinking: A Common Sense ProcessDesign Thinking: A Common Sense Process
Design Thinking: A Common Sense Process
 
150811pbdesignthinking 150811053102-lva1-app6892
150811pbdesignthinking 150811053102-lva1-app6892150811pbdesignthinking 150811053102-lva1-app6892
150811pbdesignthinking 150811053102-lva1-app6892
 
150811pbdesignthinking 150811053102 lva1 app6892
150811pbdesignthinking 150811053102 lva1 app6892150811pbdesignthinking 150811053102 lva1 app6892
150811pbdesignthinking 150811053102 lva1 app6892
 
designthinking
designthinkingdesignthinking
designthinking
 

Dernier

Mckinsey foundation level Handbook for Viewing
Mckinsey foundation level Handbook for ViewingMckinsey foundation level Handbook for Viewing
Mckinsey foundation level Handbook for Viewing
Nauman Safdar
 
Challenges and Opportunities: A Qualitative Study on Tax Compliance in Pakistan
Challenges and Opportunities: A Qualitative Study on Tax Compliance in PakistanChallenges and Opportunities: A Qualitative Study on Tax Compliance in Pakistan
Challenges and Opportunities: A Qualitative Study on Tax Compliance in Pakistan
vineshkumarsajnani12
 

Dernier (20)

PARK STREET 💋 Call Girl 9827461493 Call Girls in Escort service book now
PARK STREET 💋 Call Girl 9827461493 Call Girls in  Escort service book nowPARK STREET 💋 Call Girl 9827461493 Call Girls in  Escort service book now
PARK STREET 💋 Call Girl 9827461493 Call Girls in Escort service book now
 
New 2024 Cannabis Edibles Investor Pitch Deck Template
New 2024 Cannabis Edibles Investor Pitch Deck TemplateNew 2024 Cannabis Edibles Investor Pitch Deck Template
New 2024 Cannabis Edibles Investor Pitch Deck Template
 
Lucknow Housewife Escorts by Sexy Bhabhi Service 8250092165
Lucknow Housewife Escorts  by Sexy Bhabhi Service 8250092165Lucknow Housewife Escorts  by Sexy Bhabhi Service 8250092165
Lucknow Housewife Escorts by Sexy Bhabhi Service 8250092165
 
Mckinsey foundation level Handbook for Viewing
Mckinsey foundation level Handbook for ViewingMckinsey foundation level Handbook for Viewing
Mckinsey foundation level Handbook for Viewing
 
HomeRoots Pitch Deck | Investor Insights | April 2024
HomeRoots Pitch Deck | Investor Insights | April 2024HomeRoots Pitch Deck | Investor Insights | April 2024
HomeRoots Pitch Deck | Investor Insights | April 2024
 
Escorts in Nungambakkam Phone 8250092165 Enjoy 24/7 Escort Service Enjoy Your...
Escorts in Nungambakkam Phone 8250092165 Enjoy 24/7 Escort Service Enjoy Your...Escorts in Nungambakkam Phone 8250092165 Enjoy 24/7 Escort Service Enjoy Your...
Escorts in Nungambakkam Phone 8250092165 Enjoy 24/7 Escort Service Enjoy Your...
 
Uneak White's Personal Brand Exploration Presentation
Uneak White's Personal Brand Exploration PresentationUneak White's Personal Brand Exploration Presentation
Uneak White's Personal Brand Exploration Presentation
 
Buy gmail accounts.pdf buy Old Gmail Accounts
Buy gmail accounts.pdf buy Old Gmail AccountsBuy gmail accounts.pdf buy Old Gmail Accounts
Buy gmail accounts.pdf buy Old Gmail Accounts
 
Berhampur Call Girl Just Call 8084732287 Top Class Call Girl Service Available
Berhampur Call Girl Just Call 8084732287 Top Class Call Girl Service AvailableBerhampur Call Girl Just Call 8084732287 Top Class Call Girl Service Available
Berhampur Call Girl Just Call 8084732287 Top Class Call Girl Service Available
 
Unveiling Falcon Invoice Discounting: Leading the Way as India's Premier Bill...
Unveiling Falcon Invoice Discounting: Leading the Way as India's Premier Bill...Unveiling Falcon Invoice Discounting: Leading the Way as India's Premier Bill...
Unveiling Falcon Invoice Discounting: Leading the Way as India's Premier Bill...
 
Phases of Negotiation .pptx
 Phases of Negotiation .pptx Phases of Negotiation .pptx
Phases of Negotiation .pptx
 
Nashik Call Girl Just Call 7091819311 Top Class Call Girl Service Available
Nashik Call Girl Just Call 7091819311 Top Class Call Girl Service AvailableNashik Call Girl Just Call 7091819311 Top Class Call Girl Service Available
Nashik Call Girl Just Call 7091819311 Top Class Call Girl Service Available
 
JAJPUR CALL GIRL ❤ 82729*64427❤ CALL GIRLS IN JAJPUR ESCORTS
JAJPUR CALL GIRL ❤ 82729*64427❤ CALL GIRLS IN JAJPUR  ESCORTSJAJPUR CALL GIRL ❤ 82729*64427❤ CALL GIRLS IN JAJPUR  ESCORTS
JAJPUR CALL GIRL ❤ 82729*64427❤ CALL GIRLS IN JAJPUR ESCORTS
 
joint cost.pptx COST ACCOUNTING Sixteenth Edition ...
joint cost.pptx  COST ACCOUNTING  Sixteenth Edition                          ...joint cost.pptx  COST ACCOUNTING  Sixteenth Edition                          ...
joint cost.pptx COST ACCOUNTING Sixteenth Edition ...
 
Arti Languages Pre Seed Teaser Deck 2024.pdf
Arti Languages Pre Seed Teaser Deck 2024.pdfArti Languages Pre Seed Teaser Deck 2024.pdf
Arti Languages Pre Seed Teaser Deck 2024.pdf
 
GUWAHATI 💋 Call Girl 9827461493 Call Girls in Escort service book now
GUWAHATI 💋 Call Girl 9827461493 Call Girls in  Escort service book nowGUWAHATI 💋 Call Girl 9827461493 Call Girls in  Escort service book now
GUWAHATI 💋 Call Girl 9827461493 Call Girls in Escort service book now
 
Ooty Call Gril 80022//12248 Only For Sex And High Profile Best Gril Sex Avail...
Ooty Call Gril 80022//12248 Only For Sex And High Profile Best Gril Sex Avail...Ooty Call Gril 80022//12248 Only For Sex And High Profile Best Gril Sex Avail...
Ooty Call Gril 80022//12248 Only For Sex And High Profile Best Gril Sex Avail...
 
Dr. Admir Softic_ presentation_Green Club_ENG.pdf
Dr. Admir Softic_ presentation_Green Club_ENG.pdfDr. Admir Softic_ presentation_Green Club_ENG.pdf
Dr. Admir Softic_ presentation_Green Club_ENG.pdf
 
Challenges and Opportunities: A Qualitative Study on Tax Compliance in Pakistan
Challenges and Opportunities: A Qualitative Study on Tax Compliance in PakistanChallenges and Opportunities: A Qualitative Study on Tax Compliance in Pakistan
Challenges and Opportunities: A Qualitative Study on Tax Compliance in Pakistan
 
PHX May 2024 Corporate Presentation Final
PHX May 2024 Corporate Presentation FinalPHX May 2024 Corporate Presentation Final
PHX May 2024 Corporate Presentation Final
 

Design that Scales: Methods and best practices to grow gracefully

  • 1. Design that scales Methods and best practices to grow gracefully. 1
  • 2. I am Eileen Allen Super Mom, Photographer, Designer & Creative Director @ AtlanticBT @eileenallen 2
  • 3. 3
  • 4. 4
  • 5. Drink the kool aid Process... Weʼre talking about process?! (Allen Iversonʼs voice) You have to buy into your process, but donʼt let it handcuff you. BRIEF research ideas solution production product 5
  • 6. the setup The days of starting your project on a blank Photoshop canvas are done. It requires too much wasted time and energy. BRIEF research ideas 6
  • 7. Our creative arsenal Whether you are a team of one, a small shop looking to expand, or a massive force, you can benefit from thorough planning. Client Brief / Worksheet Creative Brief Idea Brief Co-Design Styleboard This collection of “setup” methods is meant to help us do one thing... Think Before We Do. 7
  • 8. Client Brief This is usually the first interaction a client has with our design team. It allows clients to share their hopes and dreams. The worksheet is meant to help clients self-evaluate, organize their thoughts, and share their preferences.    8
  • 9. Example Question How involved do you want to be in the design process of your site? I trust your expertise and leave the design decisions up to you. I would like to have a say in the design of my site. I know exactly what I want and would like you to follow my instructions. Visit Atlantic BTʼs Actual Worksheet http://www.atlanticbt.com/client-worksheet.php 9
  • 10. creative brief This is NOT your grandmaʼs brief. Instead, we ask a series of five questions during the client kick off meeting. 10
  • 11. creative brief Define purpose. Why do you feel like you need a site? Define sales process. How do you communicate who you are to clients? Define the users. Who is the site for? Define the end user goal (for each class if more than one). What is the desired action? Define the look and feel. Confirmation of client brief (theme, colourway, risk factor) 11
  • 12. idea brief “An idea brief is a sentence, or two, that sums up the project and frames it as a problem statement. A question that needs an answer.” - Mark Boulton Source http://www.alistapart.com/articles/savingthespark/ 12
  • 13. idea brief Actual examples of our previous brief briefs include: This client needs to distinguish themselves from the competition by making a complex process easy for customers to understand. This client needs the site to reflect the innovation in their technology, communicate how they are ahead of the curve in their industry, and highlight their credibility. This client needs a site design that better reflects their reputation and attract high-end clientele. 13
  • 14. co-design Co-Design is a brainstorming session where the project team collaborates and share their perspective on the common goals. Use the idea brief to springboard into the co-design workshop. Co-Design can happen: You and a client You and another designer You and UX You and UX and marketing and PM You and all of the above The concept was adopted from Leah Buley, formerly of Adaptive Path. 14
  • 15. co-design The benefits of co-design sessions include: No one comes in empty handed. Helps to prioritize elements and features. We identify/solve the layout through ideation. Everyone has a voice, because all ideas are good ideas. Bada-bing: Wireframe! 15
  • 16. style board Itʼs like if a style guide and a mood board had a baby! Have you ever had a client: Be surprised by your design choices? Ever point out that you used the wrong kind of camo for the background of their military equipment catalog site? To prevent these surprises and potentially embarrassing mistakes, we start with style boards to help the client visualize our direction before we begin designing. 16
  • 17. 17
  • 18. 18
  • 19. style board The key benefits of a style board include: Eliminates surprises. Designers are better prepared. Avoids designing in a vacuum. 19
  • 21. THank You 21