
Target Software offers a leading software application for high-volume fund-raising organizations who need complex constituent and donor management tools. Companies such as WGBH, American Red Cross and the Lincoln Center rely on it to make the most of their members and donors. In 2006 they realized that the application desperately needed an overhaul to be more user-friendly. They also wanted to move it from its awkward java platform to the browser.
I lead this project along with an interaction designer and developer at RDVO. The major components to this project were:
We began the project by researching the existing product. I wanted to learn how the product works, how their customers use it, and see if I could identify key gaps and pinch-points in workflows. The interaction designer and I conducting more than a dozen on-site and virtual (via web and phone) site visits with about fifteen major customers. We asked the users to complete a survey and then show us how they used the screens and the other tools they used to get their jobs done. This was vital because it showed us how well the current application worked for the black-diamond (advanced) users – even though it was a terribly difficult learning curve. It seems the more that people used the app, the more satisfied with it. Our challenge was to develop a new UX that would not harm these advanced users but would open the door to wider, more casual audience.

Cover of our UI Strategy doc

We segmented the users into user-types to help focus the UX on the users and interactions that mattered most.

After outlining the needs of a user-type, we laid out core changes to the application to better meet those needs.

Knowing that we probably couldnt get it all done, either due to time or budget, we rated the value of each change to that user.
After we settled on the strategy for the new Team Approach, I set out to sketch out the new screen flow and the hundreds of interactions that the application would have to handle in its new design. This was by far my most complex product and there were a dozen rounds of feedback with our client to get each screen right.

We focused on just a portion of the screens in the new application, this map shows those screens and how they flow from one to another.

The dashboard was a vital screen and the one that we spent the most time on. It needed to offer a peek into a lot of information and would be highly customizable.

The account overview screen - shows the individuals within that account and needed to provide both a broad and deep look at the records and activity in the account.

Adding a new contact or phone to an account was handled in a pop-up.

Here is a great example of how a simple task, adding a phone number, was actually quite complex. Considering all the functional requirements, I think we handled it well.
The design of the new application was done by an interaction designer and as you will see they had to adhere precisely to the wireframes. These shots are actually screen grabs of fully-built HTML pages that we created at the end of the project.

The login screen of the application

The Dashboard of the application, where the user landed after logging in.

The main account overview screen.