SlideShare a Scribd company logo
1 of 16
Download to read offline
Strategic Web Design:
Visual Strategy
Ben Wong, Interactive Design Manager
Kelley Jarrett, Market Manager
Why is Visual Strategy Important?
YOUR WEBSITE MAY SAY SO MUCH IT SAYS NOTHING AT ALL

PROVIDES AUDIENCE-CENTRIC CONTENT AND NAVIGATION

PROMOTES CLARITY AND FOCUS
Kill The Noise: The Importance of Prioritizing
Your Content
Prepare to Reduce the Noise:
REVIEW YOUR WEBSITE AND ASK YOURSELF:

What three user tasks are the highest priority for your organization?

Are you giving that user task the loudest voice?

Are less important tasks competing with your critical tasks?
Visual Prioritization

     YOUR WEBSITE       YOUR AUDIENCE
Wireframes Help Prioritize
SHOULD BE COMPLETED AFTER AUDIENCE ANALYSIS AND BEFORE
VISUAL DESIGN

HELP TAKE YOUR WEBSITE FROM SUBJECTIVE TO OBJECTIVE.
Wireframes Help Prioritize
IDENTIFY THE TOP
10 TASKS AND PRIORITIZE
IMPORTANCE

WHEN CREATING A
WIREFRAME, CONSIDER:
   –  Position
   –  Size
   –  Contrast
   –  Calls to Action
DOCUMENT WHY DECISIONS
WERE MADE. PREVENTS
COMPETITION AND “CONTENT
CREEP”
Audience-Centric Navigation

     YOUR WEBSITE         YOUR AUDIENCE
Online Card Sorting
                      Online Card Sorting gives your team the ability to determine the
                      ideal structure of your new navigation by grouping pages and
                      tasks into common categories and sorted by importance. This
                      data can be used to create a new sitemap and to drive the
                      visual design of the new interface of your site.
Onsite Card Sorting
                      The Onsite Card Sorting allows us to
                      work side by side with your team in
                      developing the navigation and
                      interface of your site. Unlike the
                      Online Card Sort, conducting the
                      exercise in person can lead to
                      revealing conversations about the
                      nature of your audience and the
                      deficiencies of your current
                      navigation scheme that can be
                      solved by a effective card sort.
Site map




From the Onsite Card Sorting exercise, a new Site Map is generated. This site
map takes all the data gathered during the card sort and compiles it into a
diagram of your site’s new navigation scheme, allowing you to visualize how
the user will navigate through your content. This site map also acts as a guide
for the interface that is developed during the Visual Design process.
Content

    YOUR WEBSITE   YOUR AUDIENCE
Analyze Your Content
ANALYZE CURRENT CONTENT
   –  Active Pages
   –  Broken Links
   –  # of pages
   –  Most commonly accessed
   –  Least accessed
   –  2 Clicks to Key tasks

DETERMINE KEEPERS AND TRASH
   –  What can you leave behind?
   –  What should you optimize with Calls to Action?
Plan Your Content Strategy
ANALYZE CURRENT STATE

DETERMINE WEAKNESSES
Recap
ANALYZE YOUR AUDIENCE

PRIORITIZE TASKS

CREATE A VISUAL HIERARCHY THROUGH WIREFRAMES

FORM AN AUDIENCE-CENTRIC NAVIGATION

ANALYZE YOUR CONTENT

DEFINE YOUR CONTENT STRATEGY
Next Steps

THE ART AND THE MAGIC

BEAUTIFUL DESIGN BASED ON SOLID STRATEGY

More Related Content

What's hot

How to Increase Your Site Usability to Drive Leads
How to Increase Your Site Usability to Drive LeadsHow to Increase Your Site Usability to Drive Leads
How to Increase Your Site Usability to Drive LeadsDigital Reach
 
The Purpose-Driven Website
The Purpose-Driven WebsiteThe Purpose-Driven Website
The Purpose-Driven WebsiteChristopher Ash
 
Website Proposal for Demure Dental Clinic
Website Proposal for Demure Dental ClinicWebsite Proposal for Demure Dental Clinic
Website Proposal for Demure Dental ClinicPakStockPhoto
 
Harlem Arts Alliance
Harlem Arts AllianceHarlem Arts Alliance
Harlem Arts AllianceHans Hageman
 
Hotel Digital Marketing Snapshot and How to Budget for 2016 Webinar
Hotel Digital Marketing Snapshot and How to Budget for 2016 WebinarHotel Digital Marketing Snapshot and How to Budget for 2016 Webinar
Hotel Digital Marketing Snapshot and How to Budget for 2016 WebinarMilestone Internet Marketing
 
Gumtree website evaluation group c
Gumtree website evaluation   group cGumtree website evaluation   group c
Gumtree website evaluation group ceviebe
 
How to Increase Web Site Conversions with Persuasive Design
How to Increase Web Site Conversions with Persuasive DesignHow to Increase Web Site Conversions with Persuasive Design
How to Increase Web Site Conversions with Persuasive DesignKimberly Krause Berg
 
Fort Walton Beach Chamber of Commerce Search Engine Marketing Symposium Oct 2011
Fort Walton Beach Chamber of Commerce Search Engine Marketing Symposium Oct 2011Fort Walton Beach Chamber of Commerce Search Engine Marketing Symposium Oct 2011
Fort Walton Beach Chamber of Commerce Search Engine Marketing Symposium Oct 2011pmahone
 
Nonprofit fundraising - Harlem Arts Alliance
Nonprofit fundraising - Harlem Arts AllianceNonprofit fundraising - Harlem Arts Alliance
Nonprofit fundraising - Harlem Arts AllianceHans Hageman
 
WordCamp Atlanta 2015: Planning your website from concept to launch
WordCamp Atlanta 2015: Planning your website from concept to launchWordCamp Atlanta 2015: Planning your website from concept to launch
WordCamp Atlanta 2015: Planning your website from concept to launchMickey Mellen
 
local_search_optimization-justin_sanger.ppt
local_search_optimization-justin_sanger.pptlocal_search_optimization-justin_sanger.ppt
local_search_optimization-justin_sanger.pptzachbrowne
 
Customer engagement and analytics
Customer engagement and analyticsCustomer engagement and analytics
Customer engagement and analyticsPaul Mulzoff
 
Evolution Of Search And Its Impact On Marketing
Evolution Of Search And Its Impact On MarketingEvolution Of Search And Its Impact On Marketing
Evolution Of Search And Its Impact On Marketingmahdaviani
 
Fa 102 b customer journey map
Fa 102 b customer journey mapFa 102 b customer journey map
Fa 102 b customer journey mapNicholas Boyer
 
Media strategy proposal
Media strategy proposalMedia strategy proposal
Media strategy proposalSofia Chalkidi
 

What's hot (18)

Web design
Web designWeb design
Web design
 
How to Increase Your Site Usability to Drive Leads
How to Increase Your Site Usability to Drive LeadsHow to Increase Your Site Usability to Drive Leads
How to Increase Your Site Usability to Drive Leads
 
The Purpose-Driven Website
The Purpose-Driven WebsiteThe Purpose-Driven Website
The Purpose-Driven Website
 
Website Proposal for Demure Dental Clinic
Website Proposal for Demure Dental ClinicWebsite Proposal for Demure Dental Clinic
Website Proposal for Demure Dental Clinic
 
Harlem Arts Alliance
Harlem Arts AllianceHarlem Arts Alliance
Harlem Arts Alliance
 
Hotel Digital Marketing Snapshot and How to Budget for 2016 Webinar
Hotel Digital Marketing Snapshot and How to Budget for 2016 WebinarHotel Digital Marketing Snapshot and How to Budget for 2016 Webinar
Hotel Digital Marketing Snapshot and How to Budget for 2016 Webinar
 
Gumtree website evaluation group c
Gumtree website evaluation   group cGumtree website evaluation   group c
Gumtree website evaluation group c
 
How to Increase Web Site Conversions with Persuasive Design
How to Increase Web Site Conversions with Persuasive DesignHow to Increase Web Site Conversions with Persuasive Design
How to Increase Web Site Conversions with Persuasive Design
 
Fort Walton Beach Chamber of Commerce Search Engine Marketing Symposium Oct 2011
Fort Walton Beach Chamber of Commerce Search Engine Marketing Symposium Oct 2011Fort Walton Beach Chamber of Commerce Search Engine Marketing Symposium Oct 2011
Fort Walton Beach Chamber of Commerce Search Engine Marketing Symposium Oct 2011
 
Nonprofit fundraising - Harlem Arts Alliance
Nonprofit fundraising - Harlem Arts AllianceNonprofit fundraising - Harlem Arts Alliance
Nonprofit fundraising - Harlem Arts Alliance
 
Local Search Is a Buzz
Local Search Is a BuzzLocal Search Is a Buzz
Local Search Is a Buzz
 
WordCamp Atlanta 2015: Planning your website from concept to launch
WordCamp Atlanta 2015: Planning your website from concept to launchWordCamp Atlanta 2015: Planning your website from concept to launch
WordCamp Atlanta 2015: Planning your website from concept to launch
 
local_search_optimization-justin_sanger.ppt
local_search_optimization-justin_sanger.pptlocal_search_optimization-justin_sanger.ppt
local_search_optimization-justin_sanger.ppt
 
Customer engagement and analytics
Customer engagement and analyticsCustomer engagement and analytics
Customer engagement and analytics
 
Evolution Of Search And Its Impact On Marketing
Evolution Of Search And Its Impact On MarketingEvolution Of Search And Its Impact On Marketing
Evolution Of Search And Its Impact On Marketing
 
Proposed solutions
Proposed solutionsProposed solutions
Proposed solutions
 
Fa 102 b customer journey map
Fa 102 b customer journey mapFa 102 b customer journey map
Fa 102 b customer journey map
 
Media strategy proposal
Media strategy proposalMedia strategy proposal
Media strategy proposal
 

Viewers also liked

Socialize Your Nonprofit
Socialize Your NonprofitSocialize Your Nonprofit
Socialize Your Nonprofitguidecreative
 
Guide Creative - Tour of Sites
Guide Creative - Tour of SitesGuide Creative - Tour of Sites
Guide Creative - Tour of Sitesguidecreative
 
Strategic_Web_Design-TestingYourVisualStory
Strategic_Web_Design-TestingYourVisualStoryStrategic_Web_Design-TestingYourVisualStory
Strategic_Web_Design-TestingYourVisualStoryguidecreative
 
Living Your Nonprofit's Brand
Living Your Nonprofit's BrandLiving Your Nonprofit's Brand
Living Your Nonprofit's Brandguidecreative
 
Guide Series Interactive Design_PastPresentAndFuture
Guide Series Interactive Design_PastPresentAndFutureGuide Series Interactive Design_PastPresentAndFuture
Guide Series Interactive Design_PastPresentAndFutureguidecreative
 
Guide series creating the ultimate interactive experience through social media
Guide series creating the ultimate interactive experience through social mediaGuide series creating the ultimate interactive experience through social media
Guide series creating the ultimate interactive experience through social mediaguidecreative
 
The Top Ten Elements Every School's Website Should Have
The Top Ten Elements Every School's Website Should HaveThe Top Ten Elements Every School's Website Should Have
The Top Ten Elements Every School's Website Should Haveguidecreative
 
TopTenWebTricksForYourSchool
TopTenWebTricksForYourSchoolTopTenWebTricksForYourSchool
TopTenWebTricksForYourSchoolguidecreative
 
Kill The Noise - Prioritizing Content for Strategic Nonprofit Websites
Kill The Noise - Prioritizing Content for Strategic Nonprofit WebsitesKill The Noise - Prioritizing Content for Strategic Nonprofit Websites
Kill The Noise - Prioritizing Content for Strategic Nonprofit Websitesguidecreative
 
The Top Ten Elements Your Noprofit's Strategic Website Should Have
The Top Ten Elements Your Noprofit's Strategic Website Should HaveThe Top Ten Elements Your Noprofit's Strategic Website Should Have
The Top Ten Elements Your Noprofit's Strategic Website Should Haveguidecreative
 
GUIDE_Series_Mobilize_Your_Nonprofit
GUIDE_Series_Mobilize_Your_NonprofitGUIDE_Series_Mobilize_Your_Nonprofit
GUIDE_Series_Mobilize_Your_Nonprofitguidecreative
 
Defining Your Nonprofit's Brand: Strategy_pdf
Defining Your Nonprofit's Brand: Strategy_pdfDefining Your Nonprofit's Brand: Strategy_pdf
Defining Your Nonprofit's Brand: Strategy_pdfguidecreative
 

Viewers also liked (13)

Socialize Your Nonprofit
Socialize Your NonprofitSocialize Your Nonprofit
Socialize Your Nonprofit
 
Bag of Tricks
Bag of TricksBag of Tricks
Bag of Tricks
 
Guide Creative - Tour of Sites
Guide Creative - Tour of SitesGuide Creative - Tour of Sites
Guide Creative - Tour of Sites
 
Strategic_Web_Design-TestingYourVisualStory
Strategic_Web_Design-TestingYourVisualStoryStrategic_Web_Design-TestingYourVisualStory
Strategic_Web_Design-TestingYourVisualStory
 
Living Your Nonprofit's Brand
Living Your Nonprofit's BrandLiving Your Nonprofit's Brand
Living Your Nonprofit's Brand
 
Guide Series Interactive Design_PastPresentAndFuture
Guide Series Interactive Design_PastPresentAndFutureGuide Series Interactive Design_PastPresentAndFuture
Guide Series Interactive Design_PastPresentAndFuture
 
Guide series creating the ultimate interactive experience through social media
Guide series creating the ultimate interactive experience through social mediaGuide series creating the ultimate interactive experience through social media
Guide series creating the ultimate interactive experience through social media
 
The Top Ten Elements Every School's Website Should Have
The Top Ten Elements Every School's Website Should HaveThe Top Ten Elements Every School's Website Should Have
The Top Ten Elements Every School's Website Should Have
 
TopTenWebTricksForYourSchool
TopTenWebTricksForYourSchoolTopTenWebTricksForYourSchool
TopTenWebTricksForYourSchool
 
Kill The Noise - Prioritizing Content for Strategic Nonprofit Websites
Kill The Noise - Prioritizing Content for Strategic Nonprofit WebsitesKill The Noise - Prioritizing Content for Strategic Nonprofit Websites
Kill The Noise - Prioritizing Content for Strategic Nonprofit Websites
 
The Top Ten Elements Your Noprofit's Strategic Website Should Have
The Top Ten Elements Your Noprofit's Strategic Website Should HaveThe Top Ten Elements Your Noprofit's Strategic Website Should Have
The Top Ten Elements Your Noprofit's Strategic Website Should Have
 
GUIDE_Series_Mobilize_Your_Nonprofit
GUIDE_Series_Mobilize_Your_NonprofitGUIDE_Series_Mobilize_Your_Nonprofit
GUIDE_Series_Mobilize_Your_Nonprofit
 
Defining Your Nonprofit's Brand: Strategy_pdf
Defining Your Nonprofit's Brand: Strategy_pdfDefining Your Nonprofit's Brand: Strategy_pdf
Defining Your Nonprofit's Brand: Strategy_pdf
 

Similar to Strategic_Web_Design-VisualStrategy

Introducing Communication Sites for Communicators #spfestchi #CM101
Introducing Communication Sites for Communicators #spfestchi #CM101Introducing Communication Sites for Communicators #spfestchi #CM101
Introducing Communication Sites for Communicators #spfestchi #CM101Kanwal Khipple
 
Building a Best-in-Class Economic Development Website
Building a Best-in-Class Economic Development WebsiteBuilding a Best-in-Class Economic Development Website
Building a Best-in-Class Economic Development WebsiteAtlas Integrated
 
Building a Best-in-Class Economic Development Website.
Building a Best-in-Class Economic Development Website.Building a Best-in-Class Economic Development Website.
Building a Best-in-Class Economic Development Website.Dan St. Peter
 
Information Architecture by Chris Farnum - LA2M 9/9/09
Information Architecture by Chris Farnum - LA2M 9/9/09Information Architecture by Chris Farnum - LA2M 9/9/09
Information Architecture by Chris Farnum - LA2M 9/9/09Lunch Ann Arbor Marketing
 
Storyboarding and planning_your_website
Storyboarding and planning_your_websiteStoryboarding and planning_your_website
Storyboarding and planning_your_websiteDr. TJ Wolfe
 
Substance151 Best Web Practices
Substance151 Best Web PracticesSubstance151 Best Web Practices
Substance151 Best Web Practicessubstance151
 
Purpose of the Website
Purpose of the WebsitePurpose of the Website
Purpose of the WebsitePatty Baraibar
 
SBDC Digital Bootcamp Website Review
SBDC Digital Bootcamp Website ReviewSBDC Digital Bootcamp Website Review
SBDC Digital Bootcamp Website ReviewVisionary Marketing
 
Empowerment Technology - Basic Web Design Principles and Elements
Empowerment Technology - Basic Web Design Principles and ElementsEmpowerment Technology - Basic Web Design Principles and Elements
Empowerment Technology - Basic Web Design Principles and ElementsLany Lyn Magdaraog
 
Intro to IA/IxD/UXD in the agency world
Intro to IA/IxD/UXD in the agency worldIntro to IA/IxD/UXD in the agency world
Intro to IA/IxD/UXD in the agency worldKarri Ojanen
 
Information Architecture for Drupal
Information Architecture for DrupalInformation Architecture for Drupal
Information Architecture for DrupalVanessa Turke
 
new UID module one(1) in the ppt format.
new UID module one(1) in the ppt format.new UID module one(1) in the ppt format.
new UID module one(1) in the ppt format.abhishek106899
 
UX Lesson 6: Visual Hierarchy
UX Lesson 6: Visual HierarchyUX Lesson 6: Visual Hierarchy
UX Lesson 6: Visual HierarchyJoan Lumanauw
 
Why hire an information architect consultant for your business by emanuel bai...
Why hire an information architect consultant for your business by emanuel bai...Why hire an information architect consultant for your business by emanuel bai...
Why hire an information architect consultant for your business by emanuel bai...Emanuel Baisire
 
Top 7 Ways To Improve Teams And SharePoint Navigation In Your Digital Workplace
Top 7 Ways To Improve Teams And SharePoint Navigation In Your Digital WorkplaceTop 7 Ways To Improve Teams And SharePoint Navigation In Your Digital Workplace
Top 7 Ways To Improve Teams And SharePoint Navigation In Your Digital WorkplaceRichard Harbridge
 

Similar to Strategic_Web_Design-VisualStrategy (20)

Introducing Communication Sites for Communicators #spfestchi #CM101
Introducing Communication Sites for Communicators #spfestchi #CM101Introducing Communication Sites for Communicators #spfestchi #CM101
Introducing Communication Sites for Communicators #spfestchi #CM101
 
Building a Best-in-Class Economic Development Website
Building a Best-in-Class Economic Development WebsiteBuilding a Best-in-Class Economic Development Website
Building a Best-in-Class Economic Development Website
 
Building a Best-in-Class Economic Development Website.
Building a Best-in-Class Economic Development Website.Building a Best-in-Class Economic Development Website.
Building a Best-in-Class Economic Development Website.
 
Information Architecture by Chris Farnum - LA2M 9/9/09
Information Architecture by Chris Farnum - LA2M 9/9/09Information Architecture by Chris Farnum - LA2M 9/9/09
Information Architecture by Chris Farnum - LA2M 9/9/09
 
Storyboarding and planning_your_website
Storyboarding and planning_your_websiteStoryboarding and planning_your_website
Storyboarding and planning_your_website
 
Web Design Phase
Web Design PhaseWeb Design Phase
Web Design Phase
 
Substance151 Best Web Practices
Substance151 Best Web PracticesSubstance151 Best Web Practices
Substance151 Best Web Practices
 
Web Design
Web DesignWeb Design
Web Design
 
Purpose of the Website
Purpose of the WebsitePurpose of the Website
Purpose of the Website
 
SBDC Digital Bootcamp Website Review
SBDC Digital Bootcamp Website ReviewSBDC Digital Bootcamp Website Review
SBDC Digital Bootcamp Website Review
 
Empowerment Technology - Basic Web Design Principles and Elements
Empowerment Technology - Basic Web Design Principles and ElementsEmpowerment Technology - Basic Web Design Principles and Elements
Empowerment Technology - Basic Web Design Principles and Elements
 
Principles of good website design
Principles of good website designPrinciples of good website design
Principles of good website design
 
Intro to IA/IxD/UXD in the agency world
Intro to IA/IxD/UXD in the agency worldIntro to IA/IxD/UXD in the agency world
Intro to IA/IxD/UXD in the agency world
 
Information Architecture for Drupal
Information Architecture for DrupalInformation Architecture for Drupal
Information Architecture for Drupal
 
new UID module one(1) in the ppt format.
new UID module one(1) in the ppt format.new UID module one(1) in the ppt format.
new UID module one(1) in the ppt format.
 
IA workshop
IA workshopIA workshop
IA workshop
 
UX Lesson 6: Visual Hierarchy
UX Lesson 6: Visual HierarchyUX Lesson 6: Visual Hierarchy
UX Lesson 6: Visual Hierarchy
 
Why hire an information architect consultant for your business by emanuel bai...
Why hire an information architect consultant for your business by emanuel bai...Why hire an information architect consultant for your business by emanuel bai...
Why hire an information architect consultant for your business by emanuel bai...
 
Top 7 Ways To Improve Teams And SharePoint Navigation In Your Digital Workplace
Top 7 Ways To Improve Teams And SharePoint Navigation In Your Digital WorkplaceTop 7 Ways To Improve Teams And SharePoint Navigation In Your Digital Workplace
Top 7 Ways To Improve Teams And SharePoint Navigation In Your Digital Workplace
 
Presentation1
Presentation1Presentation1
Presentation1
 

More from guidecreative

2013 Web Design Trends for Nonprofits
2013 Web Design Trends for Nonprofits2013 Web Design Trends for Nonprofits
2013 Web Design Trends for Nonprofitsguidecreative
 
WordPress for NonProfits: Top Ten Elements Every Website Should Have
WordPress for NonProfits: Top Ten Elements Every Website Should HaveWordPress for NonProfits: Top Ten Elements Every Website Should Have
WordPress for NonProfits: Top Ten Elements Every Website Should Haveguidecreative
 
GUIDE_Series_WordPressForNonprofits
GUIDE_Series_WordPressForNonprofitsGUIDE_Series_WordPressForNonprofits
GUIDE_Series_WordPressForNonprofitsguidecreative
 
Top Ten Elements Your School's Website Should Employ
Top Ten Elements Your School's Website Should EmployTop Ten Elements Your School's Website Should Employ
Top Ten Elements Your School's Website Should Employguidecreative
 
Expanding Your Nonprofit's Brand: Milestone Logos
Expanding Your Nonprofit's Brand: Milestone LogosExpanding Your Nonprofit's Brand: Milestone Logos
Expanding Your Nonprofit's Brand: Milestone Logosguidecreative
 
Communicating Your Nonprofit's Brand
Communicating Your Nonprofit's BrandCommunicating Your Nonprofit's Brand
Communicating Your Nonprofit's Brandguidecreative
 

More from guidecreative (6)

2013 Web Design Trends for Nonprofits
2013 Web Design Trends for Nonprofits2013 Web Design Trends for Nonprofits
2013 Web Design Trends for Nonprofits
 
WordPress for NonProfits: Top Ten Elements Every Website Should Have
WordPress for NonProfits: Top Ten Elements Every Website Should HaveWordPress for NonProfits: Top Ten Elements Every Website Should Have
WordPress for NonProfits: Top Ten Elements Every Website Should Have
 
GUIDE_Series_WordPressForNonprofits
GUIDE_Series_WordPressForNonprofitsGUIDE_Series_WordPressForNonprofits
GUIDE_Series_WordPressForNonprofits
 
Top Ten Elements Your School's Website Should Employ
Top Ten Elements Your School's Website Should EmployTop Ten Elements Your School's Website Should Employ
Top Ten Elements Your School's Website Should Employ
 
Expanding Your Nonprofit's Brand: Milestone Logos
Expanding Your Nonprofit's Brand: Milestone LogosExpanding Your Nonprofit's Brand: Milestone Logos
Expanding Your Nonprofit's Brand: Milestone Logos
 
Communicating Your Nonprofit's Brand
Communicating Your Nonprofit's BrandCommunicating Your Nonprofit's Brand
Communicating Your Nonprofit's Brand
 

Recently uploaded

Call Girls Aslali 7397865700 Ridhima Hire Me Full Night
Call Girls Aslali 7397865700 Ridhima Hire Me Full NightCall Girls Aslali 7397865700 Ridhima Hire Me Full Night
Call Girls Aslali 7397865700 Ridhima Hire Me Full Nightssuser7cb4ff
 
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Service
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts ServiceCall Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Service
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Servicejennyeacort
 
办理学位证(SFU证书)西蒙菲莎大学毕业证成绩单原版一比一
办理学位证(SFU证书)西蒙菲莎大学毕业证成绩单原版一比一办理学位证(SFU证书)西蒙菲莎大学毕业证成绩单原版一比一
办理学位证(SFU证书)西蒙菲莎大学毕业证成绩单原版一比一F dds
 
FiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdfFiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdfShivakumar Viswanathan
 
306MTAMount UCLA University Bachelor's Diploma in Social Media
306MTAMount UCLA University Bachelor's Diploma in Social Media306MTAMount UCLA University Bachelor's Diploma in Social Media
306MTAMount UCLA University Bachelor's Diploma in Social MediaD SSS
 
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degreeyuu sss
 
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证nhjeo1gg
 
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Rndexperts
 
办理(USYD毕业证书)澳洲悉尼大学毕业证成绩单原版一比一
办理(USYD毕业证书)澳洲悉尼大学毕业证成绩单原版一比一办理(USYD毕业证书)澳洲悉尼大学毕业证成绩单原版一比一
办理(USYD毕业证书)澳洲悉尼大学毕业证成绩单原版一比一diploma 1
 
Unveiling the Future: Columbus, Ohio Condominiums Through the Lens of 3D Arch...
Unveiling the Future: Columbus, Ohio Condominiums Through the Lens of 3D Arch...Unveiling the Future: Columbus, Ohio Condominiums Through the Lens of 3D Arch...
Unveiling the Future: Columbus, Ohio Condominiums Through the Lens of 3D Arch...Yantram Animation Studio Corporation
 
shot list for my tv series two steps back
shot list for my tv series two steps backshot list for my tv series two steps back
shot list for my tv series two steps back17lcow074
 
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一z xss
 
Design Portfolio - 2024 - William Vickery
Design Portfolio - 2024 - William VickeryDesign Portfolio - 2024 - William Vickery
Design Portfolio - 2024 - William VickeryWilliamVickery6
 
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Rndexperts
 
韩国SKKU学位证,成均馆大学毕业证书1:1制作
韩国SKKU学位证,成均馆大学毕业证书1:1制作韩国SKKU学位证,成均馆大学毕业证书1:1制作
韩国SKKU学位证,成均馆大学毕业证书1:1制作7tz4rjpd
 
8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR
8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR
8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCRdollysharma2066
 
ARt app | UX Case Study
ARt app | UX Case StudyARt app | UX Case Study
ARt app | UX Case StudySophia Viganò
 
PORTFOLIO DE ARQUITECTURA CRISTOBAL HERAUD 2024
PORTFOLIO DE ARQUITECTURA CRISTOBAL HERAUD 2024PORTFOLIO DE ARQUITECTURA CRISTOBAL HERAUD 2024
PORTFOLIO DE ARQUITECTURA CRISTOBAL HERAUD 2024CristobalHeraud
 
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一Fi sss
 

Recently uploaded (20)

Call Girls in Pratap Nagar, 9953056974 Escort Service
Call Girls in Pratap Nagar,  9953056974 Escort ServiceCall Girls in Pratap Nagar,  9953056974 Escort Service
Call Girls in Pratap Nagar, 9953056974 Escort Service
 
Call Girls Aslali 7397865700 Ridhima Hire Me Full Night
Call Girls Aslali 7397865700 Ridhima Hire Me Full NightCall Girls Aslali 7397865700 Ridhima Hire Me Full Night
Call Girls Aslali 7397865700 Ridhima Hire Me Full Night
 
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Service
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts ServiceCall Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Service
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Service
 
办理学位证(SFU证书)西蒙菲莎大学毕业证成绩单原版一比一
办理学位证(SFU证书)西蒙菲莎大学毕业证成绩单原版一比一办理学位证(SFU证书)西蒙菲莎大学毕业证成绩单原版一比一
办理学位证(SFU证书)西蒙菲莎大学毕业证成绩单原版一比一
 
FiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdfFiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdf
 
306MTAMount UCLA University Bachelor's Diploma in Social Media
306MTAMount UCLA University Bachelor's Diploma in Social Media306MTAMount UCLA University Bachelor's Diploma in Social Media
306MTAMount UCLA University Bachelor's Diploma in Social Media
 
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
 
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证
 
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025
 
办理(USYD毕业证书)澳洲悉尼大学毕业证成绩单原版一比一
办理(USYD毕业证书)澳洲悉尼大学毕业证成绩单原版一比一办理(USYD毕业证书)澳洲悉尼大学毕业证成绩单原版一比一
办理(USYD毕业证书)澳洲悉尼大学毕业证成绩单原版一比一
 
Unveiling the Future: Columbus, Ohio Condominiums Through the Lens of 3D Arch...
Unveiling the Future: Columbus, Ohio Condominiums Through the Lens of 3D Arch...Unveiling the Future: Columbus, Ohio Condominiums Through the Lens of 3D Arch...
Unveiling the Future: Columbus, Ohio Condominiums Through the Lens of 3D Arch...
 
shot list for my tv series two steps back
shot list for my tv series two steps backshot list for my tv series two steps back
shot list for my tv series two steps back
 
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一
 
Design Portfolio - 2024 - William Vickery
Design Portfolio - 2024 - William VickeryDesign Portfolio - 2024 - William Vickery
Design Portfolio - 2024 - William Vickery
 
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025
 
韩国SKKU学位证,成均馆大学毕业证书1:1制作
韩国SKKU学位证,成均馆大学毕业证书1:1制作韩国SKKU学位证,成均馆大学毕业证书1:1制作
韩国SKKU学位证,成均馆大学毕业证书1:1制作
 
8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR
8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR
8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR
 
ARt app | UX Case Study
ARt app | UX Case StudyARt app | UX Case Study
ARt app | UX Case Study
 
PORTFOLIO DE ARQUITECTURA CRISTOBAL HERAUD 2024
PORTFOLIO DE ARQUITECTURA CRISTOBAL HERAUD 2024PORTFOLIO DE ARQUITECTURA CRISTOBAL HERAUD 2024
PORTFOLIO DE ARQUITECTURA CRISTOBAL HERAUD 2024
 
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
 

Strategic_Web_Design-VisualStrategy

  • 1. Strategic Web Design: Visual Strategy Ben Wong, Interactive Design Manager Kelley Jarrett, Market Manager
  • 2. Why is Visual Strategy Important? YOUR WEBSITE MAY SAY SO MUCH IT SAYS NOTHING AT ALL PROVIDES AUDIENCE-CENTRIC CONTENT AND NAVIGATION PROMOTES CLARITY AND FOCUS
  • 3. Kill The Noise: The Importance of Prioritizing Your Content
  • 4. Prepare to Reduce the Noise: REVIEW YOUR WEBSITE AND ASK YOURSELF: What three user tasks are the highest priority for your organization? Are you giving that user task the loudest voice? Are less important tasks competing with your critical tasks?
  • 5. Visual Prioritization YOUR WEBSITE YOUR AUDIENCE
  • 6. Wireframes Help Prioritize SHOULD BE COMPLETED AFTER AUDIENCE ANALYSIS AND BEFORE VISUAL DESIGN HELP TAKE YOUR WEBSITE FROM SUBJECTIVE TO OBJECTIVE.
  • 7. Wireframes Help Prioritize IDENTIFY THE TOP 10 TASKS AND PRIORITIZE IMPORTANCE WHEN CREATING A WIREFRAME, CONSIDER: –  Position –  Size –  Contrast –  Calls to Action DOCUMENT WHY DECISIONS WERE MADE. PREVENTS COMPETITION AND “CONTENT CREEP”
  • 8. Audience-Centric Navigation YOUR WEBSITE YOUR AUDIENCE
  • 9. Online Card Sorting Online Card Sorting gives your team the ability to determine the ideal structure of your new navigation by grouping pages and tasks into common categories and sorted by importance. This data can be used to create a new sitemap and to drive the visual design of the new interface of your site.
  • 10. Onsite Card Sorting The Onsite Card Sorting allows us to work side by side with your team in developing the navigation and interface of your site. Unlike the Online Card Sort, conducting the exercise in person can lead to revealing conversations about the nature of your audience and the deficiencies of your current navigation scheme that can be solved by a effective card sort.
  • 11. Site map From the Onsite Card Sorting exercise, a new Site Map is generated. This site map takes all the data gathered during the card sort and compiles it into a diagram of your site’s new navigation scheme, allowing you to visualize how the user will navigate through your content. This site map also acts as a guide for the interface that is developed during the Visual Design process.
  • 12. Content YOUR WEBSITE YOUR AUDIENCE
  • 13. Analyze Your Content ANALYZE CURRENT CONTENT –  Active Pages –  Broken Links –  # of pages –  Most commonly accessed –  Least accessed –  2 Clicks to Key tasks DETERMINE KEEPERS AND TRASH –  What can you leave behind? –  What should you optimize with Calls to Action?
  • 14. Plan Your Content Strategy ANALYZE CURRENT STATE DETERMINE WEAKNESSES
  • 15. Recap ANALYZE YOUR AUDIENCE PRIORITIZE TASKS CREATE A VISUAL HIERARCHY THROUGH WIREFRAMES FORM AN AUDIENCE-CENTRIC NAVIGATION ANALYZE YOUR CONTENT DEFINE YOUR CONTENT STRATEGY
  • 16. Next Steps THE ART AND THE MAGIC BEAUTIFUL DESIGN BASED ON SOLID STRATEGY