Case Study
World Vision Microsites
One site to rule all sites. Together on a mission.
The Problem
Over the years individual sites were created for internal teams at their request. Sometimes these sites were created by external agencies. This led to a lot of unique and sometimes disjointed websites that didn’t make sense together. We needed some unity.
Research
Our research shows that when sponsors interact with with their sponsored children. We conducted testing on the experience starting with subject line in the email app, then to the two eMail and lastly we tested 2 land page options. We tested two pools, moderated test of World Vision donors and an unmoderated testers on UserTesting.com.
Together on a mission
World Vision is a multinational non-governmental organization with over $1B in annual revenues. The US office has created a variety of web properties for the different teams within the organization.
My role was to create a digital place for the teams within the primary .ORG site where we could best communicate with their unique stakeholders and best represent the larger organization.
Microsite
A microsite is an individual web page or a small cluster of pages which are meant to function as a discrete entity within an existing website or to complement an offline activity. The microsite’s main landing page can have its own domain name or subdomain.
Everything is different
Over the years individual sites were created for internal teams at their request. Sometimes these sites were created by external agencies. This led to a lot of unique and sometimes disjointed websites that didn’t make sense together. We needed some unity.
Designing for scale
The solution had to be templated websites with flexibility, but not too much flexibility, for the individual teams – large and small. By using one system for all teams we were able to pre-decide a lot of important design decisions. This freed us to create consistent quality with a higher velocity. We developed quality MVPs with room to iterate. Embracing that we would all learn along the journey.
Since we were now designing for multiple teams at a time, it represented the start of an entirely fresh approach to our product, it was also an opportunity to establish some newer design patterns that we could then roll out to the rest of the org over time. Patterns such as cards, image treatments, animation, and accessibility were created for this project and later absorbed into the design system.
Designing the details
I didn’t just want to give our teams templated websites. Taking on a super collaborative approach, I involved the partners at every turn. I pushed them to truly put the needs of their unique stakeholders first. We helped our partners to craft individual visions and then produced their websites.
What I found the most interesting was the deviation of end users for our unique teams. Where some teams serve individual donors, others serve churches and others still others serve PHDs from a variety of philanthropic foundations. So my solution was to design a “standard” World Vision site that included delightful details that made the work of each team unique.
The Evidence site showcases impact numbers and case studies for their audience of grantmakers
Plays well with others
Whilst wrangling legacy web properties and figuring out what content and programs to cut isn’t glamorous — this project required a deep understanding of the existing products/programs. This included the interplay between teams to position them appropriately on the web and within the larger website.
Wireframes
Universal media card design and filtering
Design
I developed 2 designs for review. 1) minimalist clean design with emoji’s and 2) compact design with illustrative elements from the printed storybook. Both designs had to clearly articulate the 3 offers.
Testers loved the “discover” section that included testimonials from children that have received similar cards/storybooks.
Testing
We wanted to great a seamless experience from eMail, to web to direct mail, but stop the press! Most users said they wouldn’t click on the eMails based on the subject line.
This insight
Final Product
Donec tempor tortor sit amet sodales blandit. Suspendisse potenti. Proin at commodo lectus. Integer interdum interdum purus non lobortis. Ut felis velit, sollicitudin.
Outcomes
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Lorem Ipsum Dolor
Donec tempor tortor sit amet sodales blandit. Suspendisse potenti. Proin at commodo lectus. Integer interdum interdum purus non lobortis. Ut felis velit, sollicitudin a libero ultricies, gravida scelerisque elit. Integer euismod vitae magna bibendum feugiat.
Sed tempor magna quis feugiat elementum. Interdum et malesuada fames ac ante ipsum primis in faucibus.
Lorem Ipsum Dolor
Donec tempor tortor sit amet sodales blandit. Suspendisse potenti. Proin at commodo lectus. Integer interdum interdum purus non lobortis.