ux design for non profit websites

19
UX Design for Non-Profit Websites (Animal Rescue Groups) Bruce Sklar Designer/Developer – Promises Animal Rescue Designer/Developer – Human Society Grand Bahama Designer/Developer – Training Rescue Dogs

Upload: bruce-sklar

Post on 28-Jan-2018

464 views

Category:

Government & Nonprofit


0 download

TRANSCRIPT

Page 1: UX design for non profit websites

UX Design for Non-Profit Websites(Animal Rescue Groups)

Bruce Sklar

Designer/Developer – Promises Animal Rescue

Designer/Developer – Human Society Grand Bahama

Designer/Developer – Training Rescue Dogs

Page 2: UX design for non profit websites

Questions

• Who has adopted a pet from a rescue?

• Who is thinking about adopting a pet?

• Who has donated to a rescue?

• Who has volunteered for a rescue or is thinking about volunteering with a rescue?

Page 3: UX design for non profit websites

The Audience

• People who are looking to adopt

• Available Pets

• Adoption Process

• People who are looking to donate

• How will my money be used?

• How much should I give?

• People who want to volunteer

• Volunteer Process

• What can I do?

• Where can I do it?

Page 4: UX design for non profit websites

Goals

• Get Donations

• Find Adopters

• Find Volunteers

Page 5: UX design for non profit websites

Design Guidelines Categories Donation Usability, Nielsen Norman Group

• https://www.nngroup.com/reports/attracting-donors-and-volunteers-non-profit/

58 Design Guidelines for Improving the Donation Process and the Usability of Essential Information on Charity and Non-Profit Websites

Category (Number of Guidelines)

• Home Page (5)

• About The Charity (9)

• Asking for Donations (4)

• Leadership, Sponsors, and Endorsements (5)

• News and Events (2)

• Local Chapters (5)

• Social Media and Interaction (1)

• The Donation Process (16)

• General, Data Collection, Information Verification, Confirmation Page

• Site-Wide Guidelines (4)

Page 6: UX design for non profit websites

Guidelines• Home Page (5) /(3)

• About The Charity (9)/(3)

• Asking for Donations (4)/(4)

• Leadership, Sponsors, and Endorsements (5)/(1)

• News and Events (2)/(2)

• Local Chapters (5)/(0)

• Social Media and Interaction (1)/(1)

• The Donation Process (16)/(8)

• General, Data Collection, Information Verification, Confirmation Page

• Site-Wide Guidelines (4)/(4)

In total, the sites apply 26 of the 58 guidelines

Additional Guidelines• Make the site accessible, including forms and donation pages• Make the site responsive so that it works on all platforms• Allow people to be notified about a new pet being added to the site• Provide acknowledgement of sponsorship

Page 7: UX design for non profit websites

The Sites that I have Designed and Developed

• Promises Animal Rescue

• Mission of rescuing and rehoming German Shepherds and Labs and educating on Mega-Esophagus.

• Humane Society of Grand Bahama

• Mission of rescuing dogs and cats for the Grand Bahama Island

• Training Rescue Dogs

• Mission of rescuing, rehabilitation, and rehoming of otherwise unadoptable dogs.

Page 8: UX design for non profit websites

View the Sites

• Available Dogs

• Mission

• Volunteer

• Events

• Donate

Page 9: UX design for non profit websites

Responsive

Page 10: UX design for non profit websites

Technology• BootStrap 3

• HTML 5

• CSS 3

• JavaScript

• Jquery

• Datatables 1.10

• AngularJS 1.4.9

• PHP

• MySQL

• SEO

Page 11: UX design for non profit websites

Email of New Dog

Page 12: UX design for non profit websites

Email to Administrator of a Foster Application

Page 13: UX design for non profit websites

Administrative Site

• Review Applications – Adoption, Volunteers, and Fosters

• CRUD Animals

• CRUD Events

• CRUD Blog

• State Reports

• Where the Dogs Are

*CRUD – Create, Review, Update & Delete

Page 14: UX design for non profit websites

Summary

Raise Money, Get Adopters, Get Volunteers

Please contact me if you would like to help

Please volunteer if you are a Designer, Developer,

or a Tester

[email protected]

Thank You

Page 15: UX design for non profit websites

Links For Non-Profit Design

• 5 Tips For Visually Enhancing Nonprofit websites

• Nonprofit Website Design: Examples and Best Practices

• 25 Powerful Nonprofit Logos, Deconstructed

• Tips for Designing (or Redesigning) a Nonprofit Website

• 10 Things Your Nonprofit Home Page Must Have

• 25 Great Nonprofit Websites and Tips for Your Inspiration

• Tips for Nonprofit Website Success

• 21 Ways Volunteers Can Help with Your Website

• Nonprofit Video Production Tips

• 10 Things Your Nonprofit Home Page Must Have

• Five "Don'ts" of Nonprofit Website Design

• Four Guidelines for ImprovingYour Nonprofit Website

• How to Ask for Donations onYour Website

• Nonprofit Home Page Tips

• 40 of the Best Websites of Non-Profit Organizations

• 40 Effectively Designed Non-Profit & Charity Websites

Page 16: UX design for non profit websites

Getting Started

• 4 Website Tweaks to Increase Donations

• 5 Tips for Choosing Your Nonprofit URL

• 5 Tips For Increasing Traffic to Your Nonprofit’s Website

• A Nonprofit’s Guide to Building Simple, Low-Cost Websites

• Acquiring New Donors Online

• Connecting Metrics to Action

• Create an Online Fundraising Plan - Step 1: Work Your Website

• Does Your Web Site Suck?

• Four Guidelines for Improving Your Nonprofit Website

• How to Drive Traffic to Your Nonprofit Website

• How to Run an Online Advocacy Campaign

• How to Serve Two Audiences with Your Nonprofit Website

• How to Start a Website for Your Organization

• How to Use Google AdWords to Attract Donors

• Nonprofit Home Page Tips

• The Art of Easy

• Transform Your Organization with Pro Bono Technology Resources – The Community Corps Product Spotlight

• Write for Fundraising123!

• Your Google Analytics Questions Answered!

Links For Non-Profit Design

Page 17: UX design for non profit websites

Best Practices

• 10 Principles Of Effective Web Design

• 10 Steps to Being Found on Search Engines

• 10 Tips to Improve Your Nonprofit Website

• 8 Tips for a Mobile-Friendly Nonprofit Website

• Align Your Website with Your Strategic Plan

• Donation Usability: Increasing Online Giving to Non-Profits and Charities

• Extreme Website Makeover: From Ick to Slick!

• Five Deadly Sins of Website Design

• Google's Search Engine Optimization Starter Guide

• One Fool-Proof Way to Make Donating Easier for Donors

• Our Website Stinks! Tips & Secrets for a Successful Redesign

• The Art of the Online "Ask"

• The Right Way to Use Stock Images

• Tips for an Effective Contact Us Page

• Tips from the Worst Websites

Donor Stewardship

• How to Cultivate Donors Online: The “Field of Dreams” Problem and How to Fix It

Inspiration

• How Improving the Experience Can Make Donors Want to Give

• Make Your Nonprofit Website a Positive Experience -- Even When Things Go Wrong

Links For Non-Profit Design

Page 18: UX design for non profit websites

Quick Tips

• 10 Things Your Nonprofit Home Page Must Have

• 10 Tips to Make your Nonprofit Website Search Engine Friendly

• 13 Secrets of Holiday Fundraising Online

• 3 Steps for a Better Nonprofit Website

• 3 Tests to Improve Your Website and Donation Process

• 5 Principles for a More Effective Nonprofit Website

• 8 Tips for a Mobile-Friendly Nonprofit Website

• Are You a Crate & Barrel Nonprofit?

• Connecting Metrics to Action

• Does Your Web Site Suck?

• Extreme Website Makeover: From Ick to Slick!

• Five "Don'ts" of Nonprofit Website Design

• Four Guidelines for Improving Your Nonprofit Website

• Four Questions to Answer in Every Appeal

• Four Steps to More Donations

• Google AdWords for Nonprofits: 10 Tips About Keywords

• Help Donors Find You Through Search Engine Marketing

• How to Ask for Donations on Your Website

• How to Choose a Web Designer for Your Nonprofit Website

• How to Cultivate Donors Online: The “Field of Dreams” Problem and How to Fix It

• How to Use Google AdWords to Attract Donors

• Optimize Your Nonprofit Landing Pages: Improving the Odds You Get What You Want from Your Supporters

• Our Website Stinks! Tips & Secrets for a Successful Redesign

• The Art of Easy

• Tips from the Worst Websites

• Website Words to Live By

Page 19: UX design for non profit websites

Attracting New Donors

• Acquiring New Donors Online

Donation Pages

• How Donation Page Optimization Can Boost Online Giving

Fundraising Appeals

• Four Questions to Answer in Every Appeal

Nonprofit Communications

• Web Writing for Nonprofits: 4 Dos and Don’ts

Events

• Our Website Stinks! Tips & Secrets for a Successful Redesign

• Tips for Taking Your Website from Blah to Amazing

• What Should a Website Cost?

Case Studies & White Papers

• How Donation Page Optimization Can Boost Online Giving