EPLEDGE REDESIGN DOCUMENT

2014 CAMPAIGN ePLEDGE REDESIGN
UNITED WAY OF THE BAY AREA
“Intuitive design is how we give the user new superpowers.” Jared Spool

e-Pledge Redesign 2
EPLEDGE FLOW CHART
LOG IN
FUM GIFT
TO UWBA
SPLIT TO 3
KEY AREAS
PROFILE
(PREFERENCES)
STEP 1:
THANK YOU PAGE
REDIRECT
(GOAL COMPLETE)
STEP 2:
THANK YOU
EMAIL SENT
DESIGNATE
UWBA
AGENCY (S)
CHOOSE
FROM LIST
DESIGNATE
WRITE IN
CREDIT
PAYROLL
Choose amount
x number of
paychecks & number
of pay periods
Choose amount
x 12 monhly payments
or 1 time payment
(minimum $120 per year)
Choose date/amount
x 12 monhly payments
or 1 time payment
provide rounting info
E-CHECK
WELCOME
1. Contribution Details 2. My Profile 3. Review and Approve
REVIEW &
CONFIRM
GIFT DETAILS
UP-SELL
DONATION
TIME
SENSITIVE

e-Pledge Redesign 3
EPLEDGE LOG IN SCREEN
Suggestion for new design: Create a modal
window to allow a speedy log in to get started.
Donor can see a hint of the experience behind
the darkened screen and can close the
window if desired.
Add Logo of Company to
Modal Window using a parameter in the url.

e-Pledge Redesign 4
Personalized greeting in the header.
Get employee started with entering an amount
which will pre-populate the screens following.
Prepopulate amount with donation from last
year plus 5%
The employee can input donation amount-
keep value to populate future screens (session
cookie?)
After the next patch we can include the radio
buttons here but for Phase One
Image can be swapped out for each company.
By default, include a thank you letter from Anne
immediately under the donation area. Can
be swapped out with letter from CEO of the
workplace company
Custom company logo will be defined.
Include static (or possibly dynamic) pie chart
showing information about United Way’s 3 key
areas. (Artwork to come)
Footer includes secure seal at all times to provide
assurance of safety for the donor’s data. Make
sure the customer service phone number is also
present at all time.
Possibly include mission statement.
EPLEDGE WELCOME SCREEN

ePledge Redesign 5
CHOOSE PLEDGE METHOD
STEP ONE: CHOOSE PAYMENT METHOD WIREFRAME FOR RADIO BUTTONS
“Grateful for the help to find a safe haven for my family.” Carrie M., Emergency Food & Shelter
PREVIOUS CONTINUEMY TOTAL PLEDGE: $1200
Payroll Deduction
Credit Card
e-Check
YES, I’D LIKE TO PLEDGE BY:
Notes to Developer:
Display Donor’s first
name in header
Top Menu items:
Hide menu bar unless
required by company
Display buttons in
consistent place
Add “article” to swap out
quotes
Display pledge amount
from welcome page
Pick up styles from
website, this is a
wireframe only. Look at
the donation page:
http://uwba.org/donate

ePledge Redesign 6
I authorize my employer to deduct my total annual contribution from my paycheck as specified below.
Deduction per Pay Period
Number of Pay Periods
Number of Deductions to Make
Total Annual Pledge
PAYROLL DEDUCTION
STEP ONE-A: CHOOSE PAYMENT METHOD WIREFRAME
“Thank you for helping me to provide for my children.” Jose Alvarez, SparkPoint Client
SUCCESS STORY
Sem lacinia quam venenatis
vestibulum. ultricies vehicula
ut id elit. Vestibulum id ligula
porta felis euismod semper.
ultricies vehicula ut id elit.
Vestibulum id ligula porta felis
euismod semper.
Note: If your contribution is $1000 or more per year,
you are eligible to join one of United Way of the
Bay Area affinity groups. If you would like to join a
leadership group check one of the boxes below.
Emerging Leaders
Womens Leadership Circle
12 Pay Periods
$1200.00
$100.00
12 Deductions
CONTINUE
PREVIOUS CONTINUEMY TOTAL PLEDGE: $1200
Notes to Developer:
Display Donor’s first name
in header
Hide menu bar unless
required by company
Display buttons in
consistent place
quotes
Display pledge amount
from welcome page
success stories
Add “article” to display
affinity groups (question
for Eric on where this
information can be stored
in Andar)
Pick up styles from
website, this is a wireframe
only. Look at the donation
page:
http://uwba.org/donate
If the split gift option has
to be on this page make
it small and insignificant.
It will go to page 7 or skip
to the prefeences if not
clicked.
In that case the
contribution details
part of the progress
bar will not show.
Split your gift?

ePledge Redesign 7
“This year, we kept all of our tax return. Thank you!” Shelley Chen, Earn It! Keep It! Save It! Client
Your gift to United Way Community Fund will go where the need is the greatest to help hundreds of Bay
Area families in your neighborhood to get jobs, go to school, find affordable housing, and put food on the
table. Thank you for supporting critical programs in the Bay Area.
United Way Community Fund: Give my gift where the need is the greatest $1000
Education: Level the playing field Financial: Making ends meet Basic Needs: Critical services
STEP ONE-B: ASSIGN GIFT AND SPLIT IF DESIRED
1 2 3
Contribution Details My Profile Review and Approve
√
Split your gift to more agencies?
? ? ?
CONTRIBUTION DETAILS PREVIOUS CONTINUEMY TOTAL PLEDGE: $1200
$200
Notes to Developer:
Large radio button is
checked by default and
total amount populates
UW community fund
field.
Photos and text below
do not have fields
showing until checked.
When check box is
checked below the
image a field will appear
to enter a dollar amount.
Change the button
“Agency Search” to
a text link that says
“Split your gift to more
agencies?”

ePledge Redesign 8
STEP ONE-B: AGENCY SEARCH
1 2 3
CONTRIBUTION DETAILS PREVIOUS CANCEL CONTINUEMY TOTAL PLEDGE: $1200
Search by keyword, city and/or state for a non-profit
currently listed with United Way. Once the search
results are populated, enter the annual amount for
each of your selected agencies. Click “Cancel” to
return to the main page.

Search for an agency
Please enter amounts below to the agencies of your
choice. Minimum amount per agency is $100.
If your agency is not listed, select the “write-in”
option. Or try to search again using different
keywords. Click “Finished” to add your choices.
You will have a chance to review the result and
return to the main page after confirmation.
KEYWORD
CITY
* Any State
SEARCHWrite in

ePledge Redesign 9
1 2 3
STEP ONE-B CLICKED: AGENCY SEARCH RESULTS
Showing Agencies 1-20 of 4486 | 21-40 | < > | 150-430
Name of agency
826 Valencia
Guide Dogs for the Blind
Red Cross
Oceana
Habitat for Humanity
$100
0
0
0
$100
Amount
Agency search results
Please enter the amounts below for the
agencies of your choice, $100 minimum per
agency.
If your agency is not located, choose the
write-in option.
CONTRIBUTION DETAILS PREVIOUS CANCEL ADDMY TOTAL PLEDGE: $1200
KEYWORD
CITY
* Any State
SEARCHWrite in

ePledge Redesign 10
Your gift to United Way Community Fund will go where the need is the greatest to help hundreds of Bay
Area families in your neighborhood to get jobs, go to school, find affordable housing, and put food on the
table. Thank you for supporting critical programs in the Bay Area.
United Way Community Fund: Give my gift where the need is the greatest
211 Bay Area
$800
$200
Education: Level the playing field Financial: Making ends meet Basic Needs: Critical services
1 2 3
√
Split your gift to more agencies?
? ? ?
CONTRIBUTION DETAILS PREVIOUS CONTINUEMY TOTAL PLEDGE: $1200
$200
Notes to Developer:
Cancel will take them
back to this page.
If they add then the
designation will show
up above the text link
and the amount will be
deducted from the UW
Community Fund.
If they want to do a write
in they can choose split
a gift again and then the
new amount will show
below the other fields
but above the “split your
gift”. The little text link
will move further down
the page and will be
as inconspicuous as
possible.

ePledge Redesign 11
“I have confidence that I can achieve my dream.” Terek Turner, Matchbridge Client
Please review your information below and confirm that it is correct. Let us know how you would like your gift
confirmed. Your information is not released to any parties without your permission and will be used o send you a
confidential tax receipt.
First name
Last name
Personal email
Home address
Line 2
City
State
Zip
John
Donor
johndonor@gmail.com
1352 Halibut Street
Foster City
94404
CA
Apartment #201
STEP TWO: PREFERENCES
Your email is used to
send a confirmation of
your gift or important tax
information.
CANCELPREVIOUS CONTINUE
1 3
2
?
?
MY PROFILE MY TOTAL PLEDGE: $1200

ePledge Redesign 12
“I found I was eligible for CalFresh. So grateful for the help!” Vanessa Grove, Caller to 211
Review and Approve
If you have no changes, please press “Confirm”. If you would like to make a change use the “Previous” button.
“Cancel” will take you back to the welcome page.
Gift split
United Way of the Bay Area: $1000
826 Valencia: $100
Habitat for Humanity: $100
Total: $1200
edit
Pledge Type: Payroll Deduction
Number of Pay Periods: 12
Number of Deductions: 12
Deduction per pay period: $172
edit
John Donor
1352 Halibut Street
Foster City, CA 94404
lshum@uwba.org
415-808-4268
edit
STEP THREE: REVIEW AND APPROVE (TOP BAR)
1 3
2
Great news! For a limited time if you add $100 per year to your contribution to United Way
Community Fund your company will match it 100%! Click the button now and enter this
code MATCH100 when prompted.
ADD $100 PER YEAR TO UNITED WAY COMMUNITY FUND
X

ePledge Redesign 13
Review and Approve
Gift split
826 Valencia: $100
Total: $1200
edit
edit
John Donor
1352 Halibut Street
lshum@uwba.org
415-808-4268
edit
STEP THREE: REVIEW AND APPROVE (POP UP MODAL TO ADD FUNDS RIGHT HERE)
1 3
2
Great news! For a limited time if you add $10 per pay period to your contribution to United
Way Community Fund your company will match it 100%! Click the button now and enter this
code MATCH100 when prompted.
ADD $10 PER PAY PERIOD TO UNITED WAY COMMUNITY FUND
X
Yes! I want to make a bigger impact!
For a limited time you may add $100 per year
and Dodge & Cox will match 100%.
Enter your promo code
X
ADDMATCH100

ePledge Redesign 14
Review and Approve
Gift split
Matched gift: $100
826 Valencia: $100
Total: $1300
edit
edit
John Donor
1352 Halibut Street
lshum@uwba.org
415-808-4268
edit
STEP THREE: REVIEW AND APPROVE (TOP BAR)
1 3
2
CANCELPREVIOUS CONFIRM
___

ePledge Redesign 15
Pledge Confirmation
Print using the “Print” button below and save a copy for your records.
Thank you for making an impact in the lives of many, many Bay Area families! Your support of poverty cutting
programs in your neighborhood is appreciated by donors, volunteers and the working families who benefit.
Please email me an acknowledgment of my contribution.
Release my address to my designated nonprofit.
Please email a confirmation of the pledge to the email address above.
FINAL PLEDGE CONFIRMATION TO PRINT
LOG OFFPRINT
Gift split:
Matched amount: $100
826 Valencia: $100
Total: $1100
Reference Number: 45379872
John Donor
1352 Halibut Street
lshum@uwba.org
415-808-4268
Communication Preferences
“Thanks to donors like you, my child will have a better life.” Susan Hall, Community Schools

e-Pledge Redesign 16
EMAIL CONFIRMATION
Suggestion:
Use HTML in our brand template with an
appropriate image.
Display name, can it be Gift Processing?
The subject line could say something
like: “Thank you for your United Way
pledge” open for review.
Email confirmation is sent to the donor in
plain text. It is possible to use HTML for
this.
We should consider styling the thank you
and perhaps adding text that confirms
that the donor’s money will be put to
really good programs if they donated to
United Way.
Also the gifts should be listed with
United Way Community Fund at the
top, then the key areas, then any other
designations.
Thank you for your 2014 United Way ePledge Donation
Dear John Donor,
Thank you for your commitment and support by making your gift
to the 2014 United Way Campaign. You are helping people like
Angel Plascencia who recently had his taxes done at Earn It! Keep
It! Save It! for free.
Your pledge is summarized below for your 06/19/2014 transaction.
Gift split:
Matched amount: $100
826 Valencia: $100
Gift Processing

Thank you page after logging off.
Consider option to not log off yet but instead
review history or other task associated with
account.
EPLEDGE THANK YOU SCREEN

ePledge Redesign 18
CURRENT APPLICATION SCREENS

CHOOSING METHOD OF DONATION
Payroll DeductionSelect the type from radio button set Credit Card
e-Check Paper Check
Combine both steps on the
home page or simply have
the user enter an amount
that they want to donate
per year and then start the
process? The amount they
chose will pre-populate
step two and they can use
the calculator to change it.
(2013 campaign results:
average payroll gift is
$800.)
Payroll Deduction
Credit Card
e-Check
I want to donate _________________ per year
DONATE >
$800
Note: Cannot click next until you add an amount
Note:
These radio buttons will
show up again later in
the process if the donor
wishes to change.
Form from home page
Possible to use this but is not offered as
a choice to most companies
Per Sonali:
Delete
designation
checkbox

STEP TWO: CHOOSE TYPE OF DESIGNATION
United Way Community Fund and Key Areas Agency Search of Known Listed Non-profits Write-in Your Own on-profit
Agency search is the starting place
for search and will show the search
results on another screen or modal
window.
Default to checking the United Way option. Offer split my donation. Drop un-designated and unrestricted terms as they are unfamiliar to donors. Could be
interpreted as they haven’t designated so they SHOULD do it.

STEP ONE-B: DEFAULT TO UNITED WAY’S COMMUNITY FUND
NOTE TO DEVELOPER: Maureen added the option “do you want to
designate your gift” so you can see this behavior. Leaving this check box
blank will take you to the final screen to complete your gift bypassing
the agency search. This would be the same experience if the setting was
added “repeat same gift as last year”.
NOTE: Confused as to why populating the key areas doesn’t populate
Community Fund. Are the key areas part of Community Fund?
Suggestion: Have the field “United Way Community Fund” populated with full
gift until designated to one of the three areas.
Suggestion: Keep the Pledge amount/designation and the navigation
buttons consistent on the screen so that the donor does not need to look for
the them on each screen.

STEP TWO: IF “SEARCH FOR AGENCIES” IS CLICKED
Agency search is the
starting place for search
and will show the search
results on another screen
or modal window.
Suggestion: Paginate both top and bottom of the displayed search results
list. Keep search fields present and populated with the donor’s search terms
throughout the search process and allow the donor to change the search
parameters at any time. Style the pop up window when the magnifying glass is
clicked so that it matches our branding.

STEP THREE: PREFERENCES SCREEN

STEP THREE: VERIFICATION SCREEN
NOTE TO DEVELOPER: Screen with confirm button
(which was not there before in the demo). Maureen
has enabled live transaction (please use the check
option --use any number for the check -- not
payroll) but we must use carefully as it costs .45
per transaction and involved Steve cancelling the
transaction immediately afterwards.

Step Five: FINISHED
Thoughts: Wonder if we can change the language,
Finished doesn’t seem like the best word for this step.
Maybe a word like Complete would sound better. Wonder
if it can be changed?
Best practice state that the final step does not show
up in the progress bar.
The only options are Log Off or Print but suggestion is
that when you Log Off that you land on the home page
or a specific Thank You page that will complete the
experience.

CURRENT EMAIL CONFIRMATION
Display name, can it be Gift Processing?
The subject line could say something
like: “Thank you for your United Way
pledge” open for review.
Email confirmation is sent to the donor in
plain text. It is possible to use HTML for
this.
We should consider styling the thank you
and perhaps adding text that confirms
that the donor’s money will be put to
really good programs if they donated to
United Way.
Also the gifts should be listed with
United Way Community Fund at the
top, then the key areas, then any other
designations.

CURRENT PRINT CONFIRMATION
Observation: Print brings up print dialog screen inside
the browser window. This is not expected behavior
but it does work. Perhaps it is an aspect of the secure
website behavior?

CURRENT LOG OFF
This is how the LOG
OFF screen looks.
Definitely an opportunity
to improve the ending!!
Noticed this link error on the Give button, we will
fix the error when we do the updates. Should
probably go to the donate page on uwba.org or
to the landing page where we talk about giving.
http://uwba.org/volunteerhttp://uwba.org/advocate
In progress

EPLEDGE REDESIGN DOCUMENT

Recommended

Recommended

More Related Content

Similar to EPLEDGE REDESIGN DOCUMENT

Similar to EPLEDGE REDESIGN DOCUMENT (20)

More from Linda Shum

More from Linda Shum (13)

Recently uploaded

Recently uploaded (20)

EPLEDGE REDESIGN DOCUMENT