Irdc n W o m?n out — t  io  ha I                Michael Flint                Owner, Metropolis Creative in Boston         ...
Irdc nn out t  io         Metropolis Creative has been helping         companies build brands through web, print         a...
T dy G a: oa’s ols• Website design is process-based• Most site improvements can be  made through simple coding and  conten...
T in A ot h k bu :• How old is your website design?• Have you been involved in a website  design process?• How well do you...
Poes a e g rcs Mr t    : k in A good website design needs a good   process • Brand rediscovery/definition • Define your ta...
Poes it Acit t e D sn rcs Se r e u & eig    :    h crSite MappingThe legend we follow from start to finishWire FramingPlac...
U it f a a Eoo y we a e ne o Fir cnm — ir r 1    d r           fm
U it f a a Eoo y we a e ne o Fir cnm — ir r 2    d r           fm
U it f a a Eoo y we a e 2 ne o Fir cnm — ir r r    d r           fm
U it f a a Eoo y fadsn ne o Fir cnm — inleig    d r
BnfiaI uac G op Se hs ee l sr e ru - kt e   ic n n         c
BnfiaI uac G op D sn ee l sr e ru – eig 1   ic n n
BnfiaI uac G op D sn ee l sr e ru – eig 2   ic n n
BnfiaI uac G op F aD sn ee l sr e ru - inl eig   ic n n
Poes oin & ee p et rcs C d g D vl mn    :         o• Content Management  System  • How often and who will be  updating the...
Poes oin & ee p et rcs C d g D vl mn    :         oTypes of Social MediaIntegration•   See my content (direct link to    c...
Poes oin & ee p et rcs C d g D vl mn    :         oS.E.O.•   What does Google want?    Google wants what you want.•   Keyw...
Poes oin & ee p et rcs C d g D vl mn    :         oS.E.O. — technical notes•   Domain name•   File names•   Page titles•  ...
Poes oin & ee p et  rcs C d g D vl mn     :         oResponsive Website Design
Poes ot anh rcs PsLuc    :  -Put your URL on everythingUse every tool to drivetraffic to your site• E-blasts & landing pag...
Poes ot anh rcs PsLuc    :  -
C s S d — Srgors agae osl g a t y pinb a Lnug C nuin  e u         d         t
C s S d — C ra- ir r e a ty  e u      a lW e a            Tk    fm
C s S d — C ra -Er D sn a ty  e u      a l ay eig            Tk   l
C s S d — C ra -F aD sn a ty  e u      a l inl eig            Tk
Tka as aewy:         Follow a process!         •   Define your goals for your website.         •   Review your online bran...
Website Design for 2012: Customer Focused Websites
Website Design for 2012: Customer Focused Websites
Upcoming SlideShare
Loading in …5
×

Website Design for 2012: Customer Focused Websites

1,495 views

Published on

Website design is all about the process. From branding, to target audiences, to choosing the right calls-to-action. Also discuss S.E.O., social integration, and promoting your site once it goes live.

Published in: Design, Technology, Business
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,495
On SlideShare
0
From Embeds
0
Number of Embeds
10
Actions
Shares
0
Downloads
0
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide
  • Imagine audience in their underwear.
  • Audience poll: • Verticals? (Tech, nonprofit, EDU, service, marketing, creative, B2C) Size of business? (<5, 5-25, 25-100, 100+) Job titles? Goals?
  • Take a moment and do this with a couple of audience members’ companies.
  • 1.Interview - Through interactions with your key people, we learn about your business and customers and explore your current challenges. 3.Plan - Through research of your industry, we build our knowledge in order to provide you with a plan that goes beyond that of your competitors. Good work begins with good planning. We evaluate project needs - people, technologies, time - and allocate them to ensure a smooth schedule and successful project. 4.Design - You have constant involvement in samples, demos, and revisions, so you get what you want - no surprises. 5.Build - The plans are set, decisions are made, and we know our direction. Now for the heavy lifting as 3000k does its thing. 6.Test - We test, re-test, and then test one more time. We triple check because we want to make you look your best to your customers. 7.Launch - Once you've approved it and we've prepared it, we launch your project, starting your business on the path to growth and greater success.
  • 1.Interview - Through interactions with your key people, we learn about your business and customers and explore your current challenges. 3.Plan - Through research of your industry, we build our knowledge in order to provide you with a plan that goes beyond that of your competitors. Good work begins with good planning. We evaluate project needs - people, technologies, time - and allocate them to ensure a smooth schedule and successful project. 4.Design - You have constant involvement in samples, demos, and revisions, so you get what you want - no surprises. 5.Build - The plans are set, decisions are made, and we know our direction. Now for the heavy lifting as 3000k does its thing. 6.Test - We test, re-test, and then test one more time. We triple check because we want to make you look your best to your customers. 7.Launch - Once you've approved it and we've prepared it, we launch your project, starting your business on the path to growth and greater success.
  • 1.Interview - Through interactions with your key people, we learn about your business and customers and explore your current challenges. 3.Plan - Through research of your industry, we build our knowledge in order to provide you with a plan that goes beyond that of your competitors. Good work begins with good planning. We evaluate project needs - people, technologies, time - and allocate them to ensure a smooth schedule and successful project. 4.Design - You have constant involvement in samples, demos, and revisions, so you get what you want - no surprises. 5.Build - The plans are set, decisions are made, and we know our direction. Now for the heavy lifting as 3000k does its thing. 6.Test - We test, re-test, and then test one more time. We triple check because we want to make you look your best to your customers. 7.Launch - Once you've approved it and we've prepared it, we launch your project, starting your business on the path to growth and greater success.
  • 1.Interview - Through interactions with your key people, we learn about your business and customers and explore your current challenges. 3.Plan - Through research of your industry, we build our knowledge in order to provide you with a plan that goes beyond that of your competitors. Good work begins with good planning. We evaluate project needs - people, technologies, time - and allocate them to ensure a smooth schedule and successful project. 4.Design - You have constant involvement in samples, demos, and revisions, so you get what you want - no surprises. 5.Build - The plans are set, decisions are made, and we know our direction. Now for the heavy lifting as 3000k does its thing. 6.Test - We test, re-test, and then test one more time. We triple check because we want to make you look your best to your customers. 7.Launch - Once you've approved it and we've prepared it, we launch your project, starting your business on the path to growth and greater success.
  • 1.Interview - Through interactions with your key people, we learn about your business and customers and explore your current challenges. 3.Plan - Through research of your industry, we build our knowledge in order to provide you with a plan that goes beyond that of your competitors. Good work begins with good planning. We evaluate project needs - people, technologies, time - and allocate them to ensure a smooth schedule and successful project. 4.Design - You have constant involvement in samples, demos, and revisions, so you get what you want - no surprises. 5.Build - The plans are set, decisions are made, and we know our direction. Now for the heavy lifting as 3000k does its thing. 6.Test - We test, re-test, and then test one more time. We triple check because we want to make you look your best to your customers. 7.Launch - Once you've approved it and we've prepared it, we launch your project, starting your business on the path to growth and greater success.
  • 1.Interview - Through interactions with your key people, we learn about your business and customers and explore your current challenges. 3.Plan - Through research of your industry, we build our knowledge in order to provide you with a plan that goes beyond that of your competitors. Good work begins with good planning. We evaluate project needs - people, technologies, time - and allocate them to ensure a smooth schedule and successful project. 4.Design - You have constant involvement in samples, demos, and revisions, so you get what you want - no surprises. 5.Build - The plans are set, decisions are made, and we know our direction. Now for the heavy lifting as 3000k does its thing. 6.Test - We test, re-test, and then test one more time. We triple check because we want to make you look your best to your customers. 7.Launch - Once you've approved it and we've prepared it, we launch your project, starting your business on the path to growth and greater success.
  • - Accurate good succinct content. Feature and media rich. Viewed often.
  • - Accurate good succinct content. Feature and media rich. Viewed often.
  • Optimize user experience on any device/ screen size.
  • Brand, Target audiences, funnels! SEO - worked!! Image choices Social semi-integration
  • Now for a much more complex wireframe process. This design was made around existing site functionality What is the brand? The CTA? The Target audiences?
  • - Tons of rotating content. Very updatable More upscale cleaner
  • Redesigned around the concept of lots of content. A daily news site. Tons of content. From multiple sources. Landing pages for search play into the Ad model Target audiences? CTAs?
  • Website Design for 2012: Customer Focused Websites

    1. 1. Irdc n W o m?n out — t io ha I Michael Flint Owner, Metropolis Creative in Boston B.A. in Graphic Design from R.I.T. I have 3 kids I like to brew beer and play hockey
    2. 2. Irdc nn out t io Metropolis Creative has been helping companies build brands through web, print and graphic design for over a decade. www.metropoliscreative.com
    3. 3. T dy G a: oa’s ols• Website design is process-based• Most site improvements can be made through simple coding and content changes• Messaging is key• We will discuss post-launch marketing www.apple.com 2012
    4. 4. T in A ot h k bu :• How old is your website design?• Have you been involved in a website design process?• How well do you understand Social Engagement?• Search Engine Optimization (S.E.O)?• Responsive Website Design? www.apple.com 1997 Via http://www.archive.org
    5. 5. Poes a e g rcs Mr t : k in A good website design needs a good process • Brand rediscovery/definition • Define your target audience(s) • Define your messaging (UVP), and prioritize • Define your CTAs (and prioritize them)
    6. 6. Poes it Acit t e D sn rcs Se r e u & eig : h crSite MappingThe legend we follow from start to finishWire FramingPlacement of elements defining the hierarchy.Visual designTransforming the rough wireframes into sleek designs.
    7. 7. U it f a a Eoo y we a e ne o Fir cnm — ir r 1 d r fm
    8. 8. U it f a a Eoo y we a e ne o Fir cnm — ir r 2 d r fm
    9. 9. U it f a a Eoo y we a e 2 ne o Fir cnm — ir r r d r fm
    10. 10. U it f a a Eoo y fadsn ne o Fir cnm — inleig d r
    11. 11. BnfiaI uac G op Se hs ee l sr e ru - kt e ic n n c
    12. 12. BnfiaI uac G op D sn ee l sr e ru – eig 1 ic n n
    13. 13. BnfiaI uac G op D sn ee l sr e ru – eig 2 ic n n
    14. 14. BnfiaI uac G op F aD sn ee l sr e ru - inl eig ic n n
    15. 15. Poes oin & ee p et rcs C d g D vl mn : o• Content Management System • How often and who will be updating the site? • Content types• Social• S.E.O.• Responsive / devices and screen sizes
    16. 16. Poes oin & ee p et rcs C d g D vl mn : oTypes of Social MediaIntegration• See my content (direct link to channel)• Subscribe to my channel (FB Like, Twitter follow, RSS subscribe)• Engage with me (Retweet, post a comment)• List Twitter, Facebook, maybe a trendy site, and “more”• Blogs, RSS, and commenting• Other social tools (Amazon, google maps, yelp)
    17. 17. Poes oin & ee p et rcs C d g D vl mn : oS.E.O.• What does Google want? Google wants what you want.• Keywords are key phrases• Use them: • in context • consistently • repetitively • unique per page
    18. 18. Poes oin & ee p et rcs C d g D vl mn : oS.E.O. — technical notes• Domain name• File names• Page titles• Headers• Page content (and alt-tags)• Meta Description -->• Links (in and out) with keywords
    19. 19. Poes oin & ee p et rcs C d g D vl mn : oResponsive Website Design
    20. 20. Poes ot anh rcs PsLuc : -Put your URL on everythingUse every tool to drivetraffic to your site• E-blasts & landing pages• Blogging!• Social traffic (Yelp, Facebook, Youtube, Twitter)• Other places: Partners, paid placement, etc.• Use Keywords!
    21. 21. Poes ot anh rcs PsLuc : -
    22. 22. C s S d — Srgors agae osl g a t y pinb a Lnug C nuin e u d t
    23. 23. C s S d — C ra- ir r e a ty e u a lW e a Tk fm
    24. 24. C s S d — C ra -Er D sn a ty e u a l ay eig Tk l
    25. 25. C s S d — C ra -F aD sn a ty e u a l inl eig Tk
    26. 26. Tka as aewy: Follow a process! • Define your goals for your website. • Review your online brand messaging. Is it accurate for your targets? • Do you have a prominent CTA? • Evaluate your S.E.O. • Do you have social tools? • Can you capture leads?

    ×