It’s winter of 2004, and the most devastating tsunami in history just occurred halfway around the world. Spontaneously, you pack up and head to Thailand, intending to volunteer for a week. More than a month later, with the help of over 200 other devoted volunteers, you’ve rebuilt five fishing villages and co-founded HandsOnThailand, the seed from which All Hands Volunteers (AHV) will spring years later. This is David Campbell’s story, and over the next ten years, he and other founders worked to form a nonprofit organization that would easily allow unpaid volunteers to profoundly impact the lives of people reeling in the wake of natural disasters. As he says, “There is no replacement for the immeasurable power of simply being there.”


Defining goals

While AHV as an organization is nimble, flexible, and quick to adapt, its former website was quite the opposite and failed to exhibit both the breadth and depth of its nearly 60 completed relief projects.  This means that, despite AHV constantly producing video, uploading photos, and writing poignant project updates and articles, the content would slip off the front page almost instantly and be buried in a blog-style structure.

So, we completely rethought the entire user experience, information architecture, and site taxonomy—building it all on a flexible content management system (CMS) capable of handling a large number of admins producing content simultaneously.

Beyond showcasing projects and providing a versatile CMS, AHV left it up to us to design a website that effectively drives engagement and communicates the maximum impact (and minimum bureaucracy) that AHV provides to survivors of natural disasters.


Telling a Story

Occasionally, we struggle to find a client story that will engage users. Be it a new business that may not yet grasp its identity or simply too many marketers or departments involved—each has his or her own goals and messaging. However, this couldn’t be further from the truth for AHV. In fact, the challenge wasn’t finding a story to guide users—it was the question of how we effectively communicate and prioritize everything AHV has to say (which is a lot) while expanding to reach a broader audience.


Information Architecture

To avoid the information overload problem AHV’s former site suffered from and begin to expand its target audiences, we had to consider each persona’s motivations, interactions, and eventual journey to a conversion point. We worked to capture and engage each persona from the second he or she landed on the site and then help AHV effectively tell its stories. From the intuitive information architecture and navigation structures to extremely refined user flows, we took great care to build an easily navigable hub for AHV’s disaster response projects, both past and present.


Put Those Icons to Work

Icon designs in web design or any other medium serve as cognitive waypoints for areas of interest and interaction. While iconography could never replace the written word, it provides a universal communication system. We developed a custom icon set to supplement AHV’s robust map and project statistics. The thin lines and simplified forms reflect modern aesthetics while remaining relevant to the message, adding an extra level of intuitive way-finding for the user.


Building with Content Blocks

Not all content management systems (CMS) are created equal. AHV’s previous website was built on WordPress, which was cumbersome and difficult to keep up to date. AHV required an intuitive, user-friendly admin solution to add, edit, and remove all types of content. We build websites using our proprietary content block system within WordPress (Gravitate Blocks), which allows clients to build extremely flexible, stylish pages without worrying about the code, layout, or design. So, when volunteers want to add a progress update video to the Pagatpat Typhoon Response project while taking a breather from mixing concrete, they can—quickly and easily.

Maximizing a Nonprofit Budget

AHV was founded on the idea of volunteers making a real difference with maximum impact and minimum bureaucracy. AHV goes to great lengths to reduce budgets and be frugal with every investment to ensure that more funds are allocated to support volunteers and devastated communities. With this (and AHV’s 95/100 rating on in mind, we worked to keep the website budget as tight as possible.

The Result

Teaming up with the do-gooders at AHV to produce a responsive, easy to manage website was empowering. Now they can tell inspiring stories of individual disaster relief efforts and engage potential volunteers and donors to learn more about AHV’s backstory and initiatives.

Our Thoughts

Communicating the amazing work All Hands does was important for us. Their disaster recovery support isn’t a one-time visit, but an ongoing effort. Because of this we needed a way to continue sharing the progress. Social integration, volunteer blog portals and crowd-sourced photography via Instagram were all factors in making this such an effective website.

Matt Malone, VP of Growth

This is one of the projects I’m proudest to have been a part of. From our first conversation, I intellectually understood All Hands does great work around the world, but the depth of their story didn’t hit home until after their site was live during the Nepal earthquake. Dissatisfied with news outlets’ standard disaster coverage, I checked out the All Hands site and saw a completely different story—one told from ground level. That story continued to evolve as the situation changed, up to today, with All Hands volunteers still on the ground nearly 8 months later.

Flynt Johnson, VP of Sales & Marketing
Clay Woodward headshot

I loved working on this project and with the All Hands team! Their mission and dedication to helping others really hits home for me. They are doing great work around the world and helping to tell their story is very rewarding. The solution we created easily informs visitors about their global disaster relief and rebuild efforts while making donating or volunteering a breeze.

Clay Woodward, VP of Operations