What is User Experience? A Presentation by Richard Smallbone and Karen Maxwell May 19, 2011
Who we are <ul><li>Richard Smallbone </li></ul>Karen Maxwell
Objectives <ul><li>A good understanding of a successful User Experience </li></ul><ul><li>How to develop a persona </li></...
What is User Experience? <ul><li>UX Design is how it works </li></ul>
What is User Experience? Good UX design is problem solving
What is User Experience? <ul><li>Great design is where  beauty ,  functionality , and  ease-of-use  all come together. </l...
What is User Experience? <ul><li>Who are your users, and how do you ensure you're reaching them with content that's releva...
What we do
User Experience Specialists design across multiple channels <ul><li>Skillset includes: </li></ul><ul><li>Digital Strategy ...
How we do it
<ul><li>IBMi’s five-stage process builds comprehensive user knowledge and uses the results to build solutions that deliver...
Why good User Experience is important <ul><li>Good design and usability is good for business </li></ul><ul><li>Addressing ...
Persona development
What is a Persona? <ul><li>A composite description of a real person who represents a primary customer segment. These descr...
Understanding Your Audiences <ul><li>To successfully create engagement and cut through the noise, you have to have a deep ...
Name:  John Adams What is your admin fee: How much of my $$ go to charity  Role: Traditional Donor   <ul><li>Wary of shari...
Persona development - exercise
Examples
Very clear communications for specific target audiences News and blog updated with timely, relevant information Easy-to-fi...
Easy-to-find donation link (could be higher in the page) Very clear communications for specific target audiences Regional ...
Quicklinks to sub-sites Animated slideshow with messages directed at specific audiences Navigation organized by audience t...
How this applies to you <ul><li>Make the focus of your organization clear to your audience </li></ul><ul><li>Make it easy ...
Tools
Wordpress <ul><li>Plugins for: </li></ul><ul><li>Surveys </li></ul><ul><li>Polls </li></ul><ul><li>Slideshows </li></ul><u...
<ul><li>Design based on an existing template with minor modifications: </li></ul><ul><li>Custom header graphic </li></ul><...
Flickr/Creative Commons <ul><li>Flickr is a photo-sharing website with millions of users worldwide. </li></ul><ul><li>Crea...
Photo by ageing accozzaglia Photo by Ronald Wong Photo by Allan Chow
Photo by Rosie O'Beirne
Photo by John Gevers Photo by Charles Pieters
iStockphoto.com <ul><li>Low-cost stock photography. Usually $5-$10/image for web use, $20+ for print use. </li></ul><ul><l...
 
Keep it simple. Make it easy. Focus on user needs. Use available tools.
Questions? <ul><li>Thank you </li></ul>
Helpful Links A List Apart Smashing Magazine Ideas on Ideas Mashable Flickr iStockphoto Persona creation http://www.alista...
Upcoming SlideShare
Loading in...5
×

Ux for nonprofits_5-19-11

1,416

Published on

User Experience for Non-Profits

Published in: Design, Technology
0 Comments
4 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,416
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
34
Comments
0
Likes
4
Embeds 0
No embeds

No notes for slide
  • Design is the visualization of information in order to communicate with an audience
  • It is finding unique ways to present the client’s message to their audience
  • It is the overall experience and satisfaction a user has when using a product or system
  • Understanding your users is key to a successful user experience. When you strike a balance of your business goals, user needs and technology you will have a successful user experience.
  • There are many roles in a UX design process.
  • Often companies start from the top down, however IBMi approaches it from the bottom up. In this 5 stage process there are many work products that can come out of it. However each project and budget varies, and that determines what the best work products are. The bare minimum you should expect to do in your UX engagement is: Requirements Gathering Persona Development Information Architecture Visual Design Development Maintenance
  • Studies by Forrester Research estimate that approximately 50% of potential sales are lost from a site as users can&apos;t find data and that 40% of users do not return to a site when their first visit is a negative experience.
  • Successful UX solutions require a comprehensive understanding of user behaviour to address current needs and anticipate future demands
  • This persona was created for a non-profit…
  • Why do we develop personas when designing a site or application? Helps define target audiences – by understanding the users we can build the features and functions that they will need when on your site or app If your largest audience is volunteers and donors, customize the experience for them If they are more affluent, use social media/mobile to point them to targeted messaging If your target audience is older, ensure that you’re using larger fonts and/or that fonts sizes are adjustable Younger – smartphones (texting) and twitter Baby boomers – facebook
  • Transcript of "Ux for nonprofits_5-19-11"

    1. 2. What is User Experience? A Presentation by Richard Smallbone and Karen Maxwell May 19, 2011
    2. 3. Who we are <ul><li>Richard Smallbone </li></ul>Karen Maxwell
    3. 4. Objectives <ul><li>A good understanding of a successful User Experience </li></ul><ul><li>How to develop a persona </li></ul><ul><li>Examples </li></ul><ul><li>How this applies to you </li></ul><ul><li>Tools to help you </li></ul>
    4. 5. What is User Experience? <ul><li>UX Design is how it works </li></ul>
    5. 6. What is User Experience? Good UX design is problem solving
    6. 7. What is User Experience? <ul><li>Great design is where beauty , functionality , and ease-of-use all come together. </li></ul>
    7. 8. What is User Experience? <ul><li>Who are your users, and how do you ensure you're reaching them with content that's relevant to their needs and interests? </li></ul>technology business objectives users
    8. 9. What we do
    9. 10. User Experience Specialists design across multiple channels <ul><li>Skillset includes: </li></ul><ul><li>Digital Strategy </li></ul><ul><li>Visioning Consultation & Workshops </li></ul><ul><li>Persona Development </li></ul><ul><li>Social Media Consultation & Workshops </li></ul>Web Kiosk Mobile Requirements Gathering Information Architecture Visual/Interactive Design Development Accessibility Testing Maintenance <ul><li>Usability and Accessibility Testing </li></ul><ul><li>Information Architecture </li></ul><ul><li>Visual and Interaction Design </li></ul><ul><li>Front-end Development </li></ul>
    10. 11. How we do it
    11. 12. <ul><li>IBMi’s five-stage process builds comprehensive user knowledge and uses the results to build solutions that deliver on user needs and business objectives. </li></ul>IBM’s five-stage process Visual Design Interaction Design Usability Accessibility Information Architecture Functional Specs & Content Requirements User Needs & Site Objectives user research, stakeholder interviews, persona development, ethno/techno/psychographics detailed description of required site functionality to meet user needs develops the application flows to facilitate user tasks establishes a mental model for the user to interact with a system or application Brand alignment, page layout, page elements, text, imagery and navigational components
    12. 13. Why good User Experience is important <ul><li>Good design and usability is good for business </li></ul><ul><li>Addressing the user’s real goals mean lower percentage of site abandonment </li></ul><ul><li>Better UX means fewer customers move to the competition </li></ul><ul><li>The better the experience translates to more sales </li></ul><ul><li>A useable design is a key to building on-line trust with your audience </li></ul><ul><li>A good (user) experience correlates with a willingness to repurchase a product or service, a reluctance to switch and a likelihood to spread a positive word-of-mouth endorsement </li></ul>
    13. 14. Persona development
    14. 15. What is a Persona? <ul><li>A composite description of a real person who represents a primary customer segment. These descriptions contain detailed information on the motivations, goals, and preferences of a representative customer. </li></ul><ul><li>Why are personas valuable? They help to make informed, fast decisions. By creating a shared, vivid picture of target customers’ behaviors, project teams can better evaluate how to satisfy customer needs resulting in less scope creep from unwanted and unnecessary features, faster consensus across the team, and none of the pitfalls from self-referential design. </li></ul>
    15. 16. Understanding Your Audiences <ul><li>To successfully create engagement and cut through the noise, you have to have a deep understanding of your target audience </li></ul><ul><li>who they are </li></ul><ul><li>what they want/need/expect </li></ul><ul><li>unique characteristics about them </li></ul><ul><li>needs and scenarios about how they will interact with the site or application </li></ul><ul><li>features on the site that address this </li></ul>
    16. 17. Name: John Adams What is your admin fee: How much of my $$ go to charity Role: Traditional Donor <ul><li>Wary of sharing personal matters over social sites </li></ul><ul><li>Blackberry for work and computer at work/home. Follows industry websites through Google Reader </li></ul><ul><li>Values his reputation at work and perception of his community involvement </li></ul><ul><li>Gives to other causes outside of work </li></ul><ul><li>Quick info </li></ul><ul><li>Recognition </li></ul><ul><li>Location: Toronto, Ontario </li></ul><ul><li>Age : 52 </li></ul><ul><li>VP, Corporate Finance </li></ul><ul><li>Create interest for John to join Non-profit Xs Facebook page </li></ul><ul><li>Communicate the value of becoming involved with “Non-profit X” </li></ul>what would their message to us be? Organization’s Key goals Characteristics Wants/needs
    17. 18. Persona development - exercise
    18. 19. Examples
    19. 20. Very clear communications for specific target audiences News and blog updated with timely, relevant information Easy-to-find donation link
    20. 21. Easy-to-find donation link (could be higher in the page) Very clear communications for specific target audiences Regional information
    21. 22. Quicklinks to sub-sites Animated slideshow with messages directed at specific audiences Navigation organized by audience type
    22. 23. How this applies to you <ul><li>Make the focus of your organization clear to your audience </li></ul><ul><li>Make it easy to donate/volunteer </li></ul><ul><li>Provide targeted information for different audiences (based on role/region etc.) </li></ul><ul><li>Make it easy for the to get information from you </li></ul><ul><li>If you have the resources to keep it up-to-date (VERY IMPORTANT) maintain a news section/blog </li></ul>
    23. 24. Tools
    24. 25. Wordpress <ul><li>Plugins for: </li></ul><ul><li>Surveys </li></ul><ul><li>Polls </li></ul><ul><li>Slideshows </li></ul><ul><li>Galleries </li></ul><ul><li>Social Networking (add to Facebook, Twitter etc.) </li></ul><ul><li>Traffic Stats </li></ul><ul><li>Contact Forms </li></ul><ul><li>Calendars </li></ul><ul><li>Initially started as a blogging platform, Wordpress is now a capable tool for building fully-featured websites </li></ul><ul><li>Wordpress.org will host your website for free, or you can install the Wordpress on your own server. </li></ul>
    25. 26. <ul><li>Design based on an existing template with minor modifications: </li></ul><ul><li>Custom header graphic </li></ul><ul><li>Minor CSS changes </li></ul><ul><li>Widgets </li></ul><ul><li>An RSS feed allows students, teachers and parents to receive updates in their RSS readers </li></ul><ul><li>The calendar is updated by office staff through an easy-to-use interface </li></ul>
    26. 27. Flickr/Creative Commons <ul><li>Flickr is a photo-sharing website with millions of users worldwide. </li></ul><ul><li>Creative Commons licensing allows Flickr users to make their photographs available, without cost, usually with the requirement that they are credited for the photograph. </li></ul><ul><li>Be aware that model releases may be required in cases where a person’s face is clear and identifiable. </li></ul>
    27. 28. Photo by ageing accozzaglia Photo by Ronald Wong Photo by Allan Chow
    28. 29. Photo by Rosie O'Beirne
    29. 30. Photo by John Gevers Photo by Charles Pieters
    30. 31. iStockphoto.com <ul><li>Low-cost stock photography. Usually $5-$10/image for web use, $20+ for print use. </li></ul><ul><li>Also includes Video, Audio, Illustration, and Flash Animation. </li></ul><ul><li>All iStockphoto photographs with clear and identifiable faces are model-released, meaning that you are free to use them without concern. </li></ul>
    31. 33. Keep it simple. Make it easy. Focus on user needs. Use available tools.
    32. 34. Questions? <ul><li>Thank you </li></ul>
    33. 35. Helpful Links A List Apart Smashing Magazine Ideas on Ideas Mashable Flickr iStockphoto Persona creation http://www.alistapart.com/ http://www.smashingmagazine.com http://www.ideasonideas.com/ http://mashable.com http:// www.flickr.com/creativecommons / http:// www.istockphoto.com / http:// www.deyalexander.com.au/resources/uxd/personas.html
    1. A particular slide catching your eye?

      Clipping is a handy way to collect important slides you want to go back to later.

    ×