Redesigning Crea´s website to accept donations
In 2018, I was hired by the Mexican Foundation Crea as a Product Manager & Content Designer to redesign their website. I worked on the project from problem definition to the final integration with Paypal, Just Giving and ComproPago along with Wordpress developer Alejandra Cano.
June 2018 to October 2018
Role
Product Manager & Content Designer
Tools
Wordpress
Methodology
Mixture of Waterfall and Agile
Delivery
Business Requirements
Customer Personas
E-commerce Wordpress Site
A TRANSFORMATIONAL PROJECT
Crea is a Mexican foundation with over 10 years of experience empowering female entrepreneurs from low income communities. They design educational programmes and implement them at scale with their network of partners including Facebook, UN Women and the World Bank. To date, they have educated 100,000 women with presential and online courses.
For the first time, the foundation wanted to enable donations from their website to increase their revenue streams. This meant they needed to explain their methodologies and showcase their success stories to gather support from new patrons while still inform about their educational opportunities to potential entrepreneurs. This required a complete redesign of their website.
My Role
During the summer of 2018, I carried out three requirement gathering sessions with the foundation’s director and a team of stakeholders. I had the chance to understand their non-profit business model, needs of end users, and body of knowledge the foundation produced with impactful results.
From the start, I owned the vision of the product, from the definition of customer personas and choice of payment methods.
I hired a Alejandra Cano, a talented Wordpress developer to translate business requirments, user stories and functionalities into a new e-commerce site with a polished UX and UI.
In October 2018, four months after the project kick-off, the website we envisioned was launched to the public.
Problem area
On the first day of work, the foundation’s director gave me these problem areas:
“We are really good at what we do but nobody knows about it. Our website is difficult to navigate for our beneficiaries and it has an outdated look. We also need to accept donations in all forms: credit, debit and a bank account deposit.”
She asked me to come back with a proposal and some examples of what the new website could look like.
Customer Personas
As a user centric product manager I wanted to make sure we identified all our personas and offered them solutions to their challenges in line with the needs of the business. The first step I took was to identify the customer personas:
María, Beneficiary
María, 42 years old, from Oaxaca, she has six children and three grandchildren living with her. She owns a launderette in the centre of the town. Her husband is out of work so all the income comes from her business. Her goal is to learn how to do online marketing so she can offer her services to the incresing number of tourists visitng the city of Oaxaca. She wants to take a course at a local organisation to help her learn the basics on Facebook.
Luis, Patron
Luis, 62 years old, from the estate of Mérida. He is a successful business owner in the hospitality industry who is about to retire and let his three sons take over the chain of hotels and restaurants he owns. His retirement plans include travelling with his wife and do charity work, especially mentoring young ambitious entrepreneurs. Luis collaborates generously with organisations from Mexico lifting people from poverty. He regularly searches online for news on organisations doing this type of work to have an impact in their success.
Natalia, Collaborator
Natalia, 19, from Mexico City. She is an communications student at the Autonomous University of Mexico. She shares a flat with three other students in the middle-class neighborhood of Condesa. During her free time, she enjoys cooking and posting her recipies on social media where she has a solid follower base, hiking and travelling with friends. She also engages in volunteering opportunities at local organisations where she can feel she’s having an impact on improving people’s lives.
What they look for
In order to engage our personas throughout their journey on the website and help them make a decision, we needed to offer the following relationship builders:
Clarity
Our personas asked for ease of use and clarity. Maria is not that technically savvy and needs to find the courses she is after without much interaction. Luis is busy and needs clear facts and figures to make an investment decision quickly. Natalia is young and technically savvy. She will not have patience for an unclear UX or unsightly UI. This relationship builder guided the information architecture.
Trust
It was key for Crea to build trust with potential donors like Luis. We needed to include information that proved they are an experienced actor with a solid track record of impactful results and a network of partners and stakeholders that support their transformational work. In practice, this relationship builder drove the creation of content: an About Us page, thorough descriptions of the methodologies used, impact figures, and partner support.
Inspiration — Volunteers
Inspiration comes before action and Natalia needs to feel inspired to volunteer her time to Crea. Showing success stories on video and talking about the foundation news on the blog was necessary to onboard young people onto Crea´s mission. Again, this relationship builder called for the creation of content we asked the customer for.
Website Architecture and User Flow
Ease of Use and Clarity were the two key components guiding the website architecture.
I created the first information architecture using using a Miro as mind mapping tool and worked with Alejandra to propose user flows.
Since it was very important that the three personas found the information they wanted as fast as possible, we included three content boxes right after the Value Proposition on the homepage with action verbs reflecting each persona´s thoughts:
María: “I want to be an entrepreneur”
Natalia: “I want to have an impact”
Luis “I want to invest”
When users clicks on the box relevant to them, they are taken directly to the information they are after: Courses, Volunteering Opportunities, Shopping Cart.
Here is what they look like now:
What we also included in the design of the architecture and user flow was stickiness. We did this by providing paths for each hero to explore educational and inspiring information from every page.
User Interface and Content
The frontend engineer and I looked for a Wordpress template that satisfied the business, technical and user requirements.
Once we had it all, Alejandra created wireframes for each section and assembled everything into one single product flow. Meanwhile, I created the brand and content guidelines (typography, colour palette, images, tone of voice) and guided the customer throughout the content creation process for every web page. After it was approved, we set off to build the functionalities.
Key Functionalities
All payments accepted
From their website, Crea accepts payments via Compropago (a Mexican bank deposit service working with convenience stores Oxo), Paypal, Credit Card and Debit Card. For those wishing to donate to specific projects, there is a Just Giving integration.
The courses you need
It is very easy for entrepreneurs to find the courses they need straight from the Homepage and Navigation Bar. We simplified the request for information on presential courses and integrated with the online courses application seamlessly.
Inspiring news delivered
Once a month, users can receive a newsletter from Crea thanks to an integration with Mailchimp. We also built a dynamic site with inspiring success stories told by the female entrepreneurs.
In retrospect
During this project, I had the chance to lead the product management and creative process by translating the business requirements and user needs into a beautiful, functional website. I worked with the customer using a Waterfall approach to project delivery, and with the Wordpress engineer in sprints. It took us several iterations to get the execution of our ideas to the point where it delivered business value. Once the website was up it generated new revenue streams for the company. I was also happy to train the editors to get content production just right for the web content and the blog!
