Just this week, I delivered a series of wireframes (flat, visual blueprint of screens that represent a mobile site when completed). It shows the screen layout, content priorities, and relationship of content, buttons, and navigational elements. It deliberately lacks design, color, and imagery at this point.
I’m guessing some people may say flat blueprints are boring so let’s go to the purpose of wireframing. And the importance of wireframing to a non-profit (or any client really). Before a project begins in earnestness, we need to understand the goals and motivation of the non-profit and its base of donors and volunteers. Is the mobile site needed for fundraising? Or rallying volunteers around an issue being debated in legislature? Or maybe both.
Let’s say both for this example. Starting with raising money, we need to lay out the content and flow of screen #1. Items on this screen lead to the copy and order of what is contained on screen #2, then screen #3 and so on. For example, in the fundraising space, users generally enter in the amount of the gift before entering their contact info. After contact info, then the person enters his credit card information. It’s the order, a shopping cart, of how Internet users enter information that needs to be mapped (and efficiently optimized to avoid users abandoning the shopping cart).
Then onto rallying volunteers. The non-profit needs to help us understand what the rallying means to their organization, how they do it, and for us to identify a path via mobile screens. Does the organization want its volunteer base to act on a specific legislative bill? Or attend (and RSVP) to attend a rally on a specific date? Or call or write to a public official like a state legislator or a member of a state’s federal delegation? If yes to any of these items, we need to map out the screens to help the user to act, RSVP, or complete the forms (which then help the non-profit to rally the troops and act on a specific issue).
I hope that you are getting the idea that a little time investment on the front-end produces a really usable tool that yields user generated information that the non-profit can easily use (and maybe earns some dough). So how much time does all of this work take? Well, that depends upon how the non-profit wants to use the Donorfull portal? In the Alpha phase, I would say that 2-3 meetings are needed to understand the non-profit and its goals, and we convey the power and flexibility of Donorfull. There is a little give-and-take to review and tweak the blueprints (e.g. wireframes), secure the non-profits logo (and brand standards), plus images, and other special nuances.
So back to the wireframes. Building wireframes is like building the foundation of a house. It’s the base, from which then design is added, and then the magic of mobile designer comes into play to build the site. It is an important step that is sometimes overlooked, especially in start-up ventures. Well … we are on it.
Let’s get to my non-profit partner. Well-established and trustworthy (aren’t they all? – we love our non-profit partners). Its mission is to educate and stimulate the minds and bodies of children and adolescents. It has a fantastic leadership team and staff and enjoys good support from the people and businesses in the greater community in which it is housed.
With the non-profit’s audience kiddos who attend school, there is an opportunity to reach into generous pockets of parents, grandparents, and perhaps even child care providers to give a little this holiday season during the holiday break (from school when children have more free time and parents and care givers look for activities). We are designing this Alpha’s portal exclusively for fundraising, $5 at a time (though we are programing such that the giver could give anything from $5-$1,000) plus the giver could decide to give the amount one-time, monthly, or quarterly. We are integrating the non-profit credit care gateway on the back-end allowing donations to be effortlessly received in its merchant account.
How does a non-profit get the dough? Well, more than half of us has a Smartphone and with a Smartphone, one can scan a QR code to reach a custom giving page, making it super easy for the Smartphone user to enter a little info, credit card number, and feel good about making a donation on-the-go. You may ask: why not use my existing Web site? Think about the screen size of a Smartphone—it’s considerably smaller than your computer screen. Viewing a regular ol’ Web site on a Smartphone is often frustrating and that is a recipe for a user to abandon the site and not make a donation.
Enter the Donorfull mobile solution: a mobile site that complements the non-profit’s Web site with easy-to-read screens presenting the best opportunity for a user to make a donation (in the case of my non-profit and/or rallying the troops as we illustrated above).
Because the specific non-profit I’m working with has significant square footage and many exhibits and other juicy locales to place signage, we will place separate QR codes on each of the signs to learn the best donation-converting locations throughout the facility. How’s that for measuring the effectiveness of a marketing campaign?!
So now I’m waiting (a little impatient I admit) for the non-profit to get back to me with feedback on the wireframes and those locations for signage, plus what copy they want to include on the signs.
If you want to join us and learn more about raising more money (and making it easier on the development staff), fill out our short Start Now form.
I’ll be sure to write more once I have feedback from the non-profit. And I’ll share a few of the wireframes once they are approved too! |