Branding alone cannot support the user experience in SharePoint. The successful redesign of an existing SharePoint site is dependent on multiple factors that are often overlooked. This session is designed for Architects, Designers, and IT Pros and includes the following: -Common Causes of Branding Problems in SharePoint -Demonstration of "crappy content" and impact on branding Overview of the elements of User Experience (UX) -Methods to improve user experience and overall look and feel without touching a master page

1. Branding And User Experience Discussion
December 5, 2009
Prepared for SharePoint Saturday DC
by Marcy Kellar

2. Branding Lead at CDW
responsible for branding, web
content management, and
usability
Diverse background in life
sciences, psychology, data
management and technology
Over four years experience in
SharePoint architecture design,
branding & implementation
Marcy Kellar
Over twenty years experience in
fine art and visual design

4. Crappy content What Is It? What does that
mean to you?
Examples of branding issues that lead to “crappy
content”
The User experience (UX) elements
Mapping UX elements back to SharePoint

5. Photo by marcykellar, flickr

6. SharePoint Branding
We’ll Call This
“Content”

7. What is asked for
What
Keeps
Me
Up
At
Night

9. “Brand the site to get users “Take this home page
excited about using design and apply it to the
SharePoint” new intranet.
“We are pretty sure that we “Make the site really
are only using publishing pop now and we’ll
templates for our intranet” figure out the content
later”
“No, we don’t have any
customizations or embedded
styling”

10. Why this is a problem:
 Content is required for functional tests
 Impacts information design
Let’s work out a schedule
“Make the site really pop for functional testing with
now and we’ll figure out the real content.
content later”
What you can do:
 No Lorem Ipsum – Use real content in mockup
 Show examples
 Help client understand risk
 Document risk
 Build a bounds test environment

11. Why this is a problem:
 Home Page does not address all areas of SharePoint
 Undiscovered design decisions
Let’s walk through a
SharePoint site and
“Take this home page discuss how your design
design and apply it to the in areas besides the
new intranet. home page.
What you can do:
• Walk through areas not covered
• Document visual requirements

12. Why this is a problem:
 Users come to site for content, not dazzle.
 Content often drives visual design requirements.
“Brand the site to get
users excited about using I need a better
SharePoint” understanding of the
business requirements
driving your redesign
What you can do:
 Walk through inspirational & competitor sites
 Understand project goals
 Be prepared with examples of sites that work
 Be prepared with examples of content conundrums

13. Why this is a problem:
 Branding won’t fix a site’s credibility, search, usability, etc
“Brand the site to get Let’s review all of the areas
users excited about using that seem to be impacting
SharePoint” user adoption and see what
we can fix with visual
design.
What you can do:
 Review project objectives
 Understand site goals
 Set realistic expectations
 Become a user advocate
 Educate yourself on elements of user experience

14. Why this is a problem:
 Overrides custom branding
 Hard-coded table widths
 Misuse of Test/bugfix hours
“No, we don’t have SharePoint will actually tell us
any customizations or everything we will get a report
embedded styling” of any customizations.
generated by this cool tool,
SharePoint Spider.
What you can do:
 Task client with reviewing content
 Proactively include MS Word overrides
 Use SharePoint Spider tool to ID customized pages

15. Why this is a problem:
 Current state of site is undefined or unclear
 Not all site templates handle branding the same
“We are pretty sure Let’s get an accurate picture
that we are only using of your environment’s
publishing templates landscape with the report
for our intranet” generated by this cool tool,
SharePoint Spider.
What you can do:
 Generate a site map using Visio
 Generate site report by using SharePoint Spider

16. • Created by: Tom Dietz, Sr. SharePoint Architect
• Reports: information that impacts branding
• Format: portable format (csv)
• Scope: Web App
DOWNLOAD SPIDER

17. 1. Download Spider
2. Unzip contents to c directory
3. Review readme.txt for more info
4. Open command prompt
5. c: spider http://yoursitename.com >yourdesiredfilename.csv

18. To SharePoint Branding Success

19.  Site Templates
 Site Collections
 Other designs
 Site Definitions
Photo by monicAl, flickr

20.  Untested features
 Testing branding
 Hard-coded widths
 Train content authors
Photo Courtesy of Tarja_, flickr

21.  First, Content
 Organize content into
taxonomies and hierarchies
 Design Navigation

22.  Clear visual hierarchy
 Rule of Thirds
 Design Elements and
Principles
 Gestalt Principles
Photo by Liz Bartlett, flickr

23. Proximity Similarity Continuity Closure
Common Fate Symmetry

24. • Follow Web Conventions
• Site Actions Menu
Photo Courtesy of Mike Owens, flickr

25. Users spend most of their
time on other sites
Jakob's Law of the Web User Experience

26. Eye Tracking Studies

28. Photo Courtesy of noamgaala, flickr

30. User Experience (UX) is the
quality of experience a person
has when interacting with a
specific design. ~www.uxnet.org

32. Become a
user advocate

33. “Over the last year online banking has attracted 6.3
million users, but a massive 3.1 million of those have
closed their accounts already due to poor website design
and inefficient service. ” (Internet Money Issue 4)
“World-wide productivity loss due to bad
intranet usability is about one trillion
dollars per year.” (Coyne et al)
“The cost to business of poor user experience and
satisfaction is equivalent to $40,000 per person in lost
business each year, based on one hour a day being spent
sorting out software usability problems (Marketing
Opinion Research International/MORI)”

34. Jesse James Garrett, 2000

39. UXNet Podcast
UIE
Slimwiki
Adaptive Path Podcast
Boxes and Arrows

40. Doing a Content Inventory (Or, a Mind-Numbingly Detailed
Odyssey Through Your Web Site)”
“The Content Inventory Is Your Friend”
Eye-tracking studies by the Poynter Institute
Eye-tracking studies by Jakob Nielsen
Where users expect to find standard web page components
Introduction to Good Usability – Downloadable ebook
Elements of User Experience

41. Resources and epiphanies in
140 characters or less.
http://thesharepointmuse.com