Develop for Good: Website Redesign to better enable user engagement and flow

2021

Background

Develop for Good (DFG) is a 501(c)(3) nonprofit corporation that conducts mobile and web app development for nonprofit organizations including UNICEF, World Health Organization, World Bank, and many more. It strives to create social impact by connecting volunteers & mentors to technical projects at nonprofit organizations. As an organization, it aims to empower the next generation of leaders in tech to commit their skills for social good early on in their careers and accelerate the digital transformation of the nonprofit sector.

DFG’s goal is to become the largest intercollegiate development organization in the US and essentially become the most impactul development social good organization.

Problem

To get involved with DFG, students, nonprofits, and donors need a website that is clear and easy to navigate due to the previous website being confusing and overwhelming with unorganized content & unnecessary information.

How might we incorporate user needs into the developing website and create a consistent branding that represents the Develop for Good Brand?

Goal

Redesign the website to better communicate relevant information for all stakeholders (volunteers, mentors and nonprofits). At the same time, showcase Develop for Good’s mission to accelerate the digital transformation of the nonprofit sector and empower the next generation of leaders for social good.

Research

Website Insights (Heuristic Evaluation)

User Insights
UX Designers were tasked with conducting interviews to gather insights on users’ pain points with the website.

User Personas
The Develop for Good website targets three groups of users: Volunteers, nonprofits, and mentors. In order to empathize with the users, the UX Designers were tasked to create three user personas.

Empathy Mapping & Affinity Mapping
After many interviews, the brainstorming session was focused on developing a deeper understanding of volunteers through empathy mapping.

With Affinity diagramming, we organized our research with one question in mind.

“What are the pain points our users experience?”

Based on that, we categorized the research into three sections which are Visual Design Style, Website Navigation and Information and then voted for the most important ones we needed to focus on.

Ideation

Design Goals

  1. Redesign the homepage so that it caters to/engages volunteers, nonprofits and mentors in regards to content organization with full transparency from the start.
  2. Develop a consistent design style that is addressed on all website pages.
  3. Restructure the website for easy access and navigation to information.

Lo-fi Wireframes (Desktop/Mobile)
With guidance from the mentor, the UX Designers strategized the user journey throughout the website to target the main user pain points of bad navigation.

Sitemap
Based on the Journey mapping & design goals , the sitemap was reorganized so that Develop for Good content was found easily for all users.

Measuring Impact

The measurable impact would be to increase more new visitors through socials and direct channels during the application process and increase time spent on the website. The main purpose of this project was to increase user engagement, ease of flow and have a more organized layout of information. The new website represents this and hopefully encourages more interaction and engagement with DFG’s content.

What we learned

Julia Nguyen — UX Product Manager

As this is my first time being the Product Manager of the website redesign, there was a high learning curve to plan the roadmap for the project. With the guidance of a mentor and the UX Designers, I was able to research the best tools for testing (zoom & maze), wireframing (miro) and prototyping (figma) AS WELL AS maintain project transparency and expectations using Slack, Notion and Google Suite.

My next steps as a Product Manager is to develop a deep understanding of each process + best techniques in research, iterations, test and design. I would also love to be MORE involved in research and design as I find value in communicating with users to understand their pain points and developing a design that addresses those needs.

Victor Hugo Molina Bis — UX Designer

Develop for Good was my first experience working with designers from different countries and backgrounds. It was a huge challenge at the beginning because I wasn’t used to communicating in a different language with native speakers, but through time I became more confident in every aspect.

I learned a lot working with my team, everyone had a different background, and this made the team so diverse that facilitated the ideation of solutions. In every meeting, our mentor gave us really important suggestions and recommendations, therefore, each time I came out with new learnings.

The most important thing I learned in this project is the importance of communication when you work with a team. Effective communication will facilitate everything, and it will make the team get better results.

Yian Wang — UX Designer

Having worked with Develop for Good in other projects before, I was familiar with their website and goals, so I was super excited to work on this project and see my team’s iterations come to life. Coming from a data background, and in the midst of a transition into a more creative career, this project was a great opportunity to discover user insights and use them to drive decision making in design.

This was an amazing experience working with other designers — something I was not too familiar with before. Through this, I was able to learn by doing and seeing, as it was extremely valuable garnering design insights and methods through my team members. I learned to better receive and implement feedback, developed my communication skills within a team of designers and cross-functionally, and also further built my design tool belt and improved my technical design abilities.

Overall, this experience really drove home that I was meant to create impact through a more creative career path.

Shannon Chakma — UX Designer

As a budding product designer, my portfolio was mainly conceptual/student projects. Working with Develop for Good was a great way to work on a real client project with a large impact, constraints, and an iterative process where we had to consider business perspectives and design perspectives. I found myself learning a lot from my team, especially how to collaborate in design environments, getting and receiving feedback, and also the technical aspects like using Figma effectively. It’s great that Develop for Good paired us with a mentor which is a valuable part of getting better as designers.

Kelly Ma — UX Designer

Working with Develop for Good gave me the opportunity to learn from other passionate creatives and hone my UX design skills. There will always be some ambiguities in the UX design process, but receiving feedback from a mentor and working alongside my teammates provided more certainty in my design decisions. Given time constraints and implementation limitations, my teammates and I had to adapt and reorganize our plans for research. Learning to overcome challenges with gathering proper research, realigning our goals, and designing with our personas in mind proved to be an invaluable experience.

Cathy Yan — UX Designer

I recently changed my career path as Physician Assistant and was not sure what I wanted to do. Develop for Good has given me the opportunity to take a step into the tech field as a UX Designer. The positive environment at Develop for Good allowed me to learn and gain confidence in my abilities as a designer.

This opportunity was eye-opening because I got to learn how website redesign meetings function and the process in revamping the website. I learned a lot from working with my team and being able to see different perspectives in ideas that were discussed in the meetings. In addition, I was able to learn new tools and skills such as; Maze for testing, Miro for wireframing, Adobe InDesign for brand guidelines, Figma for prototyping, and using Slack for team transparent communication.

As I continue my journey as a UX Designer, I want to continue to develop a deeper understanding of good visual design and refine my skills in wireframing and prototyping tools. Additionally, I would like to be more involved in the research portion of design because I enjoy collecting data and the psychology behind a user’s behavioral patterns. I want to bring a deeper understanding of the user’s pain points and use the information to develop a product that meets their needs.

Check out the live site https://developforgood.org