Donor Profiles

We had an idea: a Donor Profile. A quick summarry of a donor's important information to help our clients quickly assess their donor without having to scan through a hundred database fields. But to implement this, without a significant overhaul to the ancient tech behind the screen, would take some work.

‍

Our starting point was a rather dated looking tabbed menu that contained a submenu, a save button, and various fields for record keeping. At a glance it was hard to tell which donor you were even on, and to find useful information you would need to do a bit of work scanning and clicking around.

‍

‍

‍

As you can see, there was a fairly drastic change with my styling alone. Donor information that was accessible elsewhere on the record, but scattered and hard to find, was brought up top along with the donor picture and various status indicators. Client feedback let us know which particular information was the most important to see - such as donor status if active or inactive, email address, phone number, and a short customizeable description.

I also worked with product management to establish which sorts of metrics would be useful as well, such as their last gift amount and date, and soon. I had fun adding in badges so our clients could quickly see if they were looking at a new donor, a major donor, a monthly donor or volunteer. This profile area is also responsive, with the right panel stacking at different breakpoints. Oh, and I updated the tabbed navigation as well to try and bring it all together while matching the existing table styling.

Speaking of responsive, I was also tasked with coming up with a design that accounted for our mobile companion app. How could I fit all of that information on a smartphone?

‍

‍

After a few different attempts at stacking methods, I landed on this one.

Overall this was a good project for me to really wrap my hands around designing not just for different displays but also showing detailed information in a card system that need to be able to be dynamic and responsive.