Case Study

Rethinking the Sign-Up and Donation Process

UX StrategyUX Design

Intent

This project was completed for a research focused Foundation in an effort to increase their membership and online fundraising. The goal was to design the framework for a user-friendly system that allowed members to create a new account or login to an existing account. Through their account, members were to be able to make an online donation to the Foundation. Many members of the Foundation were visually impaired and so accessibility considerations for the system were a high priority. For our teams part, we conducted analysis into the new system and designed user flows and low-fidelity prototypes.

Role

This project was completed while an employee of the Foundation Fighting Blindness and a student in the Human-Centered Computing Graduate Program at the University of Maryland, Baltimore County (UMBC).

Process

Interviews & Surveys

To begin our analysis of what a new system might require, we interviewed staff at the Foundation, including members from the Database Department and Events Department (who work closely with Foundation members). Similarly we interviewed members who had donated to the Foundation in the past.

In addition to interviews, we developed a short questionnaire that was posted in an unobtrusive way to the Foundations existing website with questions about their experience interacting with the current website and the existing online sign-up, login and donation process.

Determining Functional and Non Functional Requirements

Determining requirements was essential for us to complete as the list of requirements were to be used to guide decision-making for the duration of the project and to create standards that the system must meet in order for it to be deemed successful.

With an understanding of the Foundation's goals for the new system and an understanding of their audience and their needs, we set about putting down on paper, in detail, what the new system would require. Functional requirements tied back to tangible actions taken by the user. For example, the user must have supporting instructions noted as they run through the sign-up process. Another example is that during the donation process, the system must be able to accept major credit cards.

Non-functional requirements tied back to the non-tangible needs of the user. These requirements included that the system must be secure, accessible, and operate with exceptional performance.

Use Cases and Data flow diagrams

With requirements in mind, we created use cases to help us understand how users might run through the high level tasks provided by this new system. Creating use cases ensured that we had an understanding of the actors of the task, what brought the task about, and what came about after the task was completed. Use cases helped us to identify problem areas, dead ends and potential errors. It also helped use to begin to map out data flows and input/outputs of information.

As a supplement to use cases we also created data flow diagrams (DFD) to document user interactions and the flow of information as the high level tasks are completed. Use case documents and DFD’s serve to give us a better understanding of how a task will be completed by the users and can also serve as technical road maps for when the system is implemented.

Example Use Case Documents
Example Data Flow Diagrams

Wireframe Mockups

Using prototyping tool, Balsamiq, we created low-fidelity mock-ups to determine the layout of elements and interaction points for the final product. By doing this and making space for the important features needed for each step along the way, we ensured that the requirements were being met and that the whole system was constructed in a way for the overall goals to be met.

Example Wireframes for the Donation Process

Interface Design Standards

While not a full fledged style guide or style library, we also created a document outlining recommendations for the visual designers of this system, mostly to accommodate visually impaired users who would be expecting this system to be accessible to them.

This document included recommendations such as using large fonts, high contrast colors, and large chunky buttons when needed.

Conclusion

By developing the assets we created and researching what this new system required and how it might be used, we were able to develop a well researched plan for implementing a successful system that meets the goals of the Foundation and provides their members and donors with a user-friendly experience.