Connect Humanity is a holistic fund with the mission to bring online the 3.6 billion people that lack access to the internet.
My role
UX design
Duration
1.5 months
Team
Project lead: Melissa Huerta Writing strategy: John Stith Identity design: Guille Lasarte Development: Zitec Software
Visit the live website →
Intro
The recent pandemic has only accelerated the need to get vital services online, like jobs, healthcare, and education. Unfortunately, not everyone has the key ingredient that makes this possible: a home internet connection. In places where telecom corporations have not provided even the bare minimum, communities themselves are figuring out how to get connected. Our partners founded Connect Humanity in 2021 to become a bridge between major funders and grassroots organizations so that communities could get online.
Problem: Establishing trust as a newcomer
Relationship-building is integral to Connect Humanity’s mission. The organization requires funder support and community alliance. As a newly-formed organization, Connect Humanity is in the process of building a trustworthy reputation. Since we cannot speed up time as a way to gain long-term trust, Connect Humanity focused on building an identity that communicated their expertise, dedication, and compelling vision. As part of this identity, Connect Humanity needed a professional website where funders could learn about their strategy and communities could feel welcome.
Goal: Develop an trustworthy website that resonates with various groups
Our goal was to utilize consistent and strategic design to establish trust. My organization, Simply Secure, brought together a group of experts in branding, writing, and design to help Connect Humanity tell its story and form partnerships. I worked with all stakeholders to design a website that brings the storytelling together, with a practical user experience for all audiences. The website needed to demonstrate professionalism and stability to acquire funding, while also being helpful, adaptive, and equitable to encourage collaboration with grassroots organizations.
Process
Connect Humanity was a new fund that needed to establish itself amongst a variety of audiences. I worked to bring their new visual identity and storytelling together into a cohesive website.
The process that I followed:
1. Design foundation
2. Lo-fi design
3. Testing with users
4. Visual storytelling
5. UI design system
1. Design foundation - establishing alignment and trust in our partnership
Gathering the vision and the context of Connect Humanity helped us establish design requirements. To get started, I carried out background research and comparison analysis. Then in collaboration with our partners, I facilitated a personality mapping and personas workshop.
Building the user personas gave us a clear indication that the most important requirements were guidance and storytelling.
2. Lo-fi design - facilitating conversation to diverge and converge effectively
Once everyone understood the context and needs of the communities served by Connect Humanity, we worked to build a blueprint of the website structure. These wireframes served as a prompt to aid in visualization, experimentation, and to support decision-making. Lo-fi design is a key tool to spark conversation with stakeholders. It was also essential for our next phase in the design process - testing with users.
3. Testing with users - sharing early, learning fast
We used a wireframe prototype to test the website structure and messaging to understand if users could navigate and connect with the mission. The testing protocol was a mix of comprehension and task-based questions, like “What does Connect Humanity do?” and “Apply for a grant”. This helped us check our assumptions and we learned that some of our design choices were not clear to the user, like applying for a grant and understanding how they work. With these insights, we worked on the visual storytelling.
4. Visual storytelling - getting the message across
In a co-design session, the partners and I converged on ideas for how to concisely and visually communicate Connect Humanity’s five approaches to the digital equity problem: Infrastructure, affordability, digital skills, content, and policy. These areas are intersecting, feeding into each other; and together, they complete the puzzle of digital equity. This graphic has served our partners as they are able to more quickly explain the extent of their model.
5. UI design system - bringing the values and brand into reality
Keeping the website consistent was key to gain trust with the communities and funders that Connect Humanity works with. I built a UI design system based on the visual identity that our brand designer, Guille Lasarte, created. The design system served to bring the wireframes into high-fi mockups and as a communication tool with developers.
Result
I collaborated with the development team to support them during the implementation of the new website for Connect Humanity.
Visit the live website →
To close out the project and support the Connect Humanity team in future, I provided all the learnings and design documentation that got us to this point.
This identity-building effort has helped Connect Humanity increase their grant partners, receive significant funding, and grow their team.
Learnings
This project showcased the power of cross-functional collaboration between developers, writing specialist, brand designer, and importantly, our partners.
Due to the frequent interaction and work with various stakeholders, clear communication about status, progress, and next steps was a key element. I saw the value of timely updates on the design process I was leading so that the stakeholders knew where we were at and where we were heading.
Read more
← Previous Project PhishDetect
Next Project → Mailvelope: Documentation