Digital Design

1
Digital Design
2
Digital Design

• Users surf the Web at amazing rates, you only
  have a few precious seconds to entice them to
  stop, look around, and with minimal effort find
  what they are looking for and make a purchase.

3
Digital Design

• How a site is designed -- typography, color, page
  layout, site hierarchy, to name just a few
  elements -- can have an immediate and lasting
  impression on visitors.
• According to a study conducted by Forrester
  Research, three of four factors most likely to
  drive repeat visitors to a web site were design
  related
• ease of use
• download time
• freshness
• Eight of nine other factors tested came no where
  close in influencing repeat visitors.

4
Digital Design

• Fabulous design cant mask a lack of content, but
  there are some standards of style and structure
  that appear to work and that users expect to see.
• http//www.webpagesthatsuck.com/biggest-web-design
  -mistakes-in-2004.html

5
Digital Design

• Best Campaign Web sites
• Worst Campaign Web sites

6
Digital Design

• The Customer Experience
• The interpretation of a users complete encounter
  with the site, from the initial look at the
  homepage through the purchase/acquisition
  experience.

7
Stages of Customer Experience

• Stage 1 Experiencing Functionality
• Usability and Ease of Navigation
• Speed
• Reliability
• Security
• Media Accessibility (multiple platforms)

8
Stages of Customer Experience

• Stage 2 Experiencing Intimacy
• Customization
• Communication
• Org to user, user to org, two-way (IMing)
• Consistency
• Trustworthiness (develops over time)
• Exceptional Value (creating the loyal customer)
• From task to pleasure
• Ebay is fun!
• Window shopping in the offline world

9
Stages of Customer Experience

• Stage 3 Experiencing Evangelism
• Integrating the brand into their lives
• Taking the word to the market
• Active Community Membership
• The organization cares about me and my opinions
• Defender of the experience!

10
Stages of Customer Experience
Evangelist
Intimate
General Personal Voice of Experience
Customer Reactions
Functional
Time to Develop Relationship
11
Digital Design

• Its not about YOU!
• You are designing your customers experience!
• What do your users actually want to accomplish
  when they interact with you via something like a
  web site? 
• What is it that theyre there to do? 
• Why is it that they come? 
• What are they trying to accomplish? 
• Based on that understanding, what kinds of
  business processes are you attempting to walk
  them through?

12
Digital Design

• Five basic things users are generally looking
  for on Web site
• Evaluate competing businesses and products
  (Research)
• Select a product and make a transaction
• Get help/answers (customer service)
  -backcountry.com
• Feedback
• Stay informed
• Customer Effective Web sites by Jodie Dalgleish
• I would add
• Be entertained.
• Interact with each other. (Community)

13
Digital Design

• Possible Site Objectives
• Establish expertise
• Build awareness of your organization
• Build awareness of a particular brand or service
• Distribute informationTo supporters, customers,
  stakeholders on products or issues. Think about
  the information needs of different audiences you
  could provide online news releases plus
  searchable audio and video resources for the
  media.
• E-commerceSell your products or services online
  24/7 to existing and new customers.
• Build relationshipsYour site can be designed to
  build profiles on the people that use it, so that
  when they come back it already knows what they're
  interested in and can tailor the sites
  accordingly. This is a very powerful tool for
  creating loyalty, you are providing exactly what
  your customers want.

14
Digital Design

• Possible Site Objectives
• Develop a new marketing strategy/reinforce a
  current strategyYou may want to use your site to
  build up a database of email contacts for a
  Permission Marketing strategy - very
  cost-effective if carried out effectively.
• Manage an eventEnable potential participants of
  an event to register online. Enable you to manage
  bookings, payments, requests for seminars and
  distribute timely information.
• Gather market researchInformation on your
  customers, either through analysis of site usage
  statistics, or by online surveys.
• Provide information and services to internal
  customers (Intranet)

15
Digital Design

• http//www.google.com/corporate/tenthings.html

16
Digital Design

• User Oriented
• Who will be using your site?
• Demographics/Psychographics
• Computer experience
• Connection, equipment, browser
• Design for browsers and platforms
• Consumer behavior of your target
• Do they shop online?
• How do they search for information?
• What features do they want?
• How much time do they spend online?
• What other Web sites do they access?
• How do they find the product or service?
• Do they purchase based on price, service,
  quality?

17
Digital Design

• Once you know what your users are coming
  forgroup your content logically. You may have
  more than one audience to address.
• Who are a colleges Web site users?
• Dont think in terms of your infrastructure!
• Instead think about how do your visitors want
  business with you
• what is their lingo/understanding?
• how they will navigate?

18
Digital Design

• Designing to Web standards means the Web site
  should ideally be
• Lean
• Clean
• CSS-based
• Accessible
• Usable
• and search engine friendly.

19
Digital Design

• CSS-based?
• Cascading Style Sheets
• Separates design from content
• Eases management of large sophisticated sites.
• ZenGarden
• Learn more Adobe article Why use CSS?

20
Digital Design

• Accessibility
• Accessible" means usable to a wide range of
  people with disabilities, including blindness and
  low vision, deafness and hearing loss, learning
  difficulties, cognitive limitations, limited
  movement, speech difficulties, photosensitivity
  and combinations of these.
• It enables people to access Web content using
  many different devices - including a wide variety
  of assistive technologies.
• Section 508 of the Rehabilitation Act requires
  access to electronic and information technology
  procured by Federal agencies.
• W3 Consortium Checklist for accessible design
• Target is being sued by the National Federation
  of the Blind for accessibility issues

21
Top Ten Guidelines for Homepage Usability
Jakob Nielsen

• Make the Site's Purpose ClearExplain Who You
  Are and What You Do
• Include a One-Sentence Tagline
• Write a Window Title with Good Visibility in
  Search Engines and Bookmark Lists
• Group all Corporate Information in One Distinct
  Area About ltcompany namegt

22
Top Ten Guidelines for Homepage Usability

• Help Users Find What They Need
• 4. Emphasize the Site's Top High-Priority Tasks
• 5. Include a Search Input Box

23
Top Ten Guidelines for Homepage Usability

• Reveal Site Content
• 6. Show Examples of Real Site Content
• 7. Begin Link Names with the Most Important
  Keyword
• 8. Offer Easy Access to Recent Homepage Features

24
Top Ten Guidelines for Homepage Usability

• Use Visual Design to Enhance, not Define,
  Interaction Design
• 9. Don't Over-Format Critical Content, Such as
  Navigation Areas
• 10. Use Meaningful Graphics

25
Digital Design

• More best practices
• Important content above the fold
• Design for all monitor sizes
• Avoid horizontal scrolling
• Dont require visitors to register in order to
  browse information
• Keep content skim-able
• Bullets
• Chunks
• More white space than print

26
Digital Design

• More best practices
• Easy access to the full cost of product
  (shipping, handling, tax, discounts)
• Service help online chat, 800 number, email.
• Include a site map
• Printer friendly option
• Helpful error pages
• Indicate out-of-stock or sold-out as early as
  possible
• Use only widely recognized icons shopping cart
  for example
• E-mail this page to encourage evangelism!
• Include a privacy policy

27
Digital Design

• Fundamental Errors
• Internally focused design, management and content
  rather than external focus
• Flashy cool designs that load quickly on a
  corporate network but are slow to load on dial-up
  or slower connections
• Not implementing a consistent style in writing
  and design not everyone enters through your
  front door.

28
Digital Design

• Keep up-to-date (useit.com)
• All time Mistakes in Web Design
• 2005 Design Mistakes

29
Digital Design

• Consistency is one of the most powerful usability
  principles when things always behave the same,
  users don't have to worry about what will happen.
  Instead, they know what will happen based on
  earlier experience. The more users' expectations
  prove right, the more they will feel in control
  of the system and the more they will like it. And
  the more the system breaks users' expectations,
  the more they will feel insecure.

30
Digital Design

• Jakob's Law of the Web User Experience states
  that "users spend most of their time on other
  websites."
• This means that they form their expectations for
  your site based on what's commonly done on most
  other site. If you deviate, your site will be
  harder to use and users will leave.
• Content management systems can help with this by
  separating design from content and allowing
  multiple authors to contribute content but with
  editorial control.

31
Digital Design

• While the key to good brochure design is good
  graphic design and visual appeal, a good Web site
  is one with relevant content for its audience.
• On the Web, content is king.
• Customers visit Web sites for information,
  entertainment, and to buy products.
• Content attracts users and keeps them returning.
• 5 tips for screaming content
• Stay fresh. Update the site every day and at
  least once on the weekend. That takes a huge
  commitment!
• Be relevant and unique. Deliver highly focused
  content that is differentiated from competitive
  site content.
• Make it easy to find. Users want to find
  information or products immediately. Also, dont
  include hyperlinks to other sites for content
  because users dont often return after they
  leave.
• Serve a smorgasbord of content. Integrate current
  news and facts with longer features and
  commentary. Include interactive material relevant
  to the site, such as quizzes, calculators,
  searches, and so forth. Vary the format to
  include multimedia.
• Deliver content everywhere. This includes Web
  sites, wireless devices, and special networks.

32
Digital Design

• Content Anywhere, Anytime
• Cell phones
• PDAs
• Laptops
• iPods/MP3 players
• Must consider WAP Wireless Application Protocol
  when designing Web sites.

33
Digital Design
34
Digital Design
Standards
Awards
35
Digital Design

• Books and Web sites
• http//www.useit.com/ - Jacob Neilsen
• Dont Make Me Think - Steve Krug
• Designing with Web Standards - Jeffrey Zeldman
• Unusually Useful Web Book - June Cohen

36
(No Transcript)
37
Problems with a Static Web site

• They are often boring. People can only read so
  much, then they often leave.
• They don't get as much information. People can't
  register, buy, submit surveys, add their
  comments, or sign up for a newsletter on a static
  web site.
• They are difficult to update. Unless you have an
  interactive web site, paying someone else to
  update your site often takes longer and cost
  more.

38
Key Benefits Of An Interactive Web Site

• research your target market with surveys
• get people to register for your online store
• get emails to market to later on
• get your visitors to add content to your site
• build a stronger relationship with your customers
  
• update and grow your site instantly

39
Interactive Web Brainstorming

• 6 Groups
• You have 10-15 minutes
• Brainstorm a list of interactive features that
  would be appropriate for your target audience.
• Each group will share their list.

40
Simple Ways to Make a Web site More
Interactive(not in order)

• Add a Google Map
• Blog and/or include RSS feeds from relevant sites
• Communication- allow visitors to contact you or
  provide feedback (Skype)
• Opinion polls or surveys
• Viral Marketing remember Bazooka! and the
  Barbie version)
• Competitions
• Games
• Discussion Forums (bulletin boards/chat/IM)
• Let users submit content
• Subscribe/unsubscribe to an email newsletter
• Password protected areas
• Self-selected FAQs
• Referral services (recommend your site)
• Site search engine
• Add Mashups
• Do at least ONE thing on this list!

41
Interactive works
42
Digital Design

• Interactive Web sites
• Education
• Sesame Street
• News
• BBC Radio Making Tracks
• TV
• PBSs Frontier HouseHBOs Autopsy
• Science
• NASA
• Interactive Services Web Award winner
• http//www.itsawonderfulinternet.com/