MInistry 2 Pensacola: A User-Centered Approach to Web Design

1,002 views

Published on

It is our responsibility as Christians to harness the power of the Web to spread Christ’s message throughout the world. While the Great Commission makes clear our marching orders, it is Christ’s example that nudges us to the edge of the pier and encourages each of us to cast a broad net.

During this workshop, Matt will share with you his user-centered approach to church website design — a process that you can easily implement when designing, redesigning or simply managing your website.

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

No Downloads
Views
Total views
1,002
On SlideShare
0
From Embeds
0
Number of Embeds
7
Actions
Shares
0
Downloads
22
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide
  • Which button do you push? Shouldn’t it be green and red?How could we make it better?
  • UnpluggedPaper towels on top
  • Something very unsanitary about thisPeople seem to opt to use the other soapReally sends a message about your business
  • No handoutsLong URLStay tuned … am I supposed to come back to sign to get more information?
  • No handoutsLong URLStay tuned … am I supposed to come back to sign to get more information?
  • Example: Lowes carpet buying experience
  • Describe my qualificationsDescribe BHD and our services for local churches: Website assessments, Project Coaching, and Visual Design for all platforms
  • Describe my qualificationsDescribe BHD and our services for local churches: Website assessments, Project Coaching, and Visual Design for all platforms
  • Sure, if you want to be rebuilding the website in a few years.
  • Remind people that my workshop today will cover this indepth.
  • Remind people that my workshop today will cover this indepth.
  • Remind people that my workshop today will cover this indepth.
  • Remind people that my workshop today will cover this indepth.
  • Remind people that my workshop today will cover this indepth.
  • User-Interview Scenario: We are redesigning the Full Life Church website; Participant plays church member, I will interview.
  • User-Interview Scenario: We are redesigning the Full Life Church website; Participant plays church member, I will interview.
  • HandoutHold up JJG book
  • Remind people that this is important so that technology and research are moving ahead together; one is not driving the other.
  • Personas are fictitious characters that are created to represent the different user types within a targeted demographic that might use a site or product. A user persona is a representation of the goals and behavior of a real group of users. In most cases, personas are synthesized from data collected from interviews with users.
  • MInistry 2 Pensacola: A User-Centered Approach to Web Design

    1. 1. Welcome!<br />
    2. 2. What’s wrong?<br />
    3. 3. What’s wrong?<br />
    4. 4. What’s wrong?<br />
    5. 5. What’s wrong?<br />
    6. 6. What’s wrong?<br />
    7. 7. What’s wrong?<br />
    8. 8. What’s wrong?<br />
    9. 9. Do you have any examples?<br />
    10. 10. Matt Carlisle version 1.0<br />
    11. 11. I help non-profits and faith groups better understand their constituents, members and stakeholders to create achievable Web&social media strategies.<br />Twitter.com/mattcarlisle<br />MattCarlisle.com<br />
    12. 12. You “can” do it!<br />Church web development isn’t done in a vacuum.<br />
    13. 13. User-Centered Design<br />A design process in which the needs, wants and limitations of the Web user and organization are given extensive attention at each stage of development.<br />
    14. 14. So, why all the work? Can’t we just start building?<br />
    15. 15. The Benefits<br /><ul><li> Based upon and informed by research
    16. 16. A focus on user needs leads to more effective</li></ul>websites<br /><ul><li> Helps unify decision-makers with diverse opinions
    17. 17. It’s cost-effective: minimize the risk of having to</li></ul>fix poor design decisions<br />
    18. 18. User-Centered Design Process<br />Discovery: conversations with staff, members & visitors<br />
    19. 19. User-Centered Design Process<br />Analysis: choose best technology based on need<br />
    20. 20. User-Centered Design Process<br />Strategy: create framework based on research<br />
    21. 21. User-Centered Design Process<br />Design: create visual design of website<br />
    22. 22. User-Centered Design Process<br />Build: program and implement design<br />
    23. 23. Discovery<br />Gather the research needed to establish a solid foundation for your website.<br />
    24. 24. Steps of Discovery<br /><ul><li> Stakeholder interviews
    25. 25. User interviews (see handout)</li></li></ul><li>Steps of Discovery<br />Stakeholders: <br /><ul><li>Pastors
    26. 26. Church staff
    27. 27. Committee leaders</li></ul>Users: <br /><ul><li> New members
    28. 28. Parents of young families
    29. 29. Singles</li></li></ul><li>Learn More<br /><ul><li> “The Elements of User Experience” – Jesse James Garrett
    30. 30. User interview script (handout)
    31. 31. www.USABILITY.gov(U.S. usability resource)</li></li></ul><li>Analysis<br />Now that you understand the needs of your stakeholders and users, determine which support system will support the outlined needs.<br />
    32. 32. Steps of Analysis<br /><ul><li> Gather technical requirements
    33. 33. Review what you can afford!
    34. 34. Research solutions and interview vendors
    35. 35. Determine optimal Web platform/software </li></li></ul><li>Learn More<br /><ul><li> Vendor questionnaire (see handout)
    36. 36. Common Knowledge: Selecting a Content</li></ul>Management System (see handout)<br /><ul><li> Web Hosting Tutorials (see handout)</li></li></ul><li>Strategy<br />The architecture and design principlesofyour new website are created. <br />
    37. 37. Steps of Strategy<br /><ul><li> Develop personas and scenariosof users
    38. 38. Content needs analysis (card sort)
    39. 39. Create site map (example)
    40. 40. Create page wireframes (example)</li></li></ul><li>Learn More<br /><ul><li> How to conduct a card sort (see handout)
    41. 41. Free “Card Sort” software (see handout)
    42. 42. Article: An Introduction to Personas (see handout)</li></li></ul><li>Design<br />The visual branding and design ofyour new website are created<br />
    43. 43. Steps of Design<br /><ul><li> Conduct visual design workshop
    44. 44. Create page comprehensives or “comp” (example)</li></li></ul><li>Learn More<br /><ul><li> Article: The Principles of Design (see handout)
    45. 45. Book: “Transcending CSS: The fine art of web design”
    46. 46. Godbit.com, Featured church website designs
    47. 47. MinistryCSS.com, Featured church website designs</li></li></ul><li>Build<br /><ul><li> Visual page comps are coded
    48. 48. Templates are implemented
    49. 49. Content , media and images are populated</li></li></ul><li>Tips to Keep in Mind<br /><ul><li> Develop in phases
    50. 50. Hire local talent
    51. 51. Soft launch is the only way to go
    52. 52. Start planning for phase 2 before site launch
    53. 53. Don’t stop researching the needs of your audience</li></li></ul><li>Questions?<br />View presentation at http://slideshare.net/mcarlisle<br />

    ×