The Motivation

In the ever changing world of social media, non-profit organizations often struggle to keep up with trends and effectively market their missions. CommUni was conceived to address this challenge by providing a centralized platform for non-profit communications personnel to track industry trends, access successful case studies, and engage with a supportive community.

Project Overview

Project Type

Independant, Academic

Role

UX Researcher | UI/UX Designer

Tools

Figma

Canva

Otter.ai

Duration

10 Weeks

Platform

Android (Native Mobile App)

Constraints

Timeline

WCAG Standards

Approach

The process I followed for this design challenge was to follow the double diamond model with its four stages: Discover, Define, Develop, and Deliver.

Discover

Problem Space

I began by researching online to identify existing pain points for non-profit communications personnel. The following was identified through preliminary research:

According to Charity Village, 49% of nonprofits reported dissatisfaction with charitable engagement from younger Canadians. However, only 22% have implemented strategies to improve this engagement.

Most nonprofit organizations face challenges in effectively engaging with their donors and communities due to constraints in resources such as staff capabilities. These limit their ability to establish meaningful connections, resulting in poor donor retention. In fact, 18% of donor attrition can be associated to poor service or communication (TheFundraisingCoach).

As a consequence, communication specialists and fundraiser coordinators in NPOS struggle to sustain vital funding streams and cultivate a supportive community network essential for their missions’ success.

Secondary Research

After identifying the general problem space, I conducted further internet research to gain a deeper understanding of the issue and its impact on non-profit communication personnel. Here are a few key findings:

Screen Shot 2024-07-04 at 10.25.58 PM.png

49%

Nearly half of nonprofit organizations are dissatisfied by donor engagement by Canadians aged 18-30

18%

Nearly 18% of donor attrition is due to poor service and communication

>1/4

Only 22% of nonprofits have a communications plan to target Canadians aged 18-34

>10

In communication teams of up to 10 staff, 44% are likely to have only 1 full-time employee

Primary Research

The criteria:

The nonprofit must be defined as small to midsize
Interviewee must be the person that oversees communications in the nonprofit organization
The organization should have donors or members that they communicate with regularly

Method:

Decontextualized interviews conducted over Google Meets and transcribed by Otter.ai

My research led me to interview three persons in non-profit organizations that are responsible for communications in their organization. I wanted to understand:

The day-to-day responsibilities of non-profit communications personnel
Identify their pain points
Determine what motivates them
Discover what their goals are

After conducting the 1:1 interviews, I used an affinity map to organize the insights I gathered into pain points, motivations and behaviours.

I then grouped the insights into common themes identified which were:

Resources and Staffing

Communications personnel struggle with limited resources and are also typically doing more tasks and responsibilities that fall outside the role of communications

Diverse Audience/Messaging

Communication is difficult to plan due to a diverse range of persons being communicated to and the types of messaging that get sent out

Adaption and Learning

With trends constantly changing, messaging needs to change too in order to resonate with audiences which results in need for constant learning

Data Management

Non-profits struggle with being able to track data due to limited funds and use free or low cost options to try help.

Moving forward, I would select Adaption and Learning as my chosen theme.

Define

Persona

The interview insights allowed me to create my primary user persona of Ashley Lynn. Her persona reflects the consolidated pain points, motivations, and behaviours of my interviewees.

Design Challenge

The interviews and user persona led me to the following design challenge:

How might we help communications personnel in small to mid-size NPOs adapt to changing communications trends and styles to increase member and donor retention?

Experience Map

To understand Ashley's end-to-end experience in drafting her communications content, I created an experience map that identified her thinking, feeling, and doing as well as channels, touch points, and stages to identify where digital intervention would be best.

User Stories and Epics

Based on Ashley's persona and the selected theme/insight of adaption and learning, I began drafting 20+ user stories. Once the user stories were drafted, I sorted them into several epics including:

Integrated Communication and Management Tools
Content Creative and Scheduling
Analytics and Reporting
Audience Engagement and Management
Learning and Keeping up with Trends

The Epic I selected is Learning and Keeping Up with Trends since each of Ashley’s pain points, motivations, behaviours, goals, and opportunities touch on the topic of learning.

The highlighted user stories within this Epic would inspire my apps task flow while the other stories inspired the full envisioned functions of the app.

Task Flow

I used the selected epic and relevant user stories to inform the Task Flow that would inform my screens and the connections between them.

Develop

Sketching

Using pencil and paper, I sketched out my preliminary sketches pulling inspiration from my UI Inspiration Board. I sketched out 3 variations of each screen and selected the most compelling design for each to create the below pictured set of solution sketches.

Prototype

The next step was to build out some greyscale wireframes in Figma that would give me an initial prototype that I could conduct user tests with.

The below pictured wireframe is prototype 1 of 3 before testing was complete and colour injection could occur.

User Testing

The initial usability tests for the Comm-uni app prototype yielded valuable insights into user interactions, revealing several areas needing improvement. Over five sessions, conducted both virtually and by phone, I pinpointed key issues related to the app's functionality and user interface design. Addressing these issues is crucial for enhancing the overall user experience and ensuring the app effectively meets users' needs.

Prototype 2: The second usability tests for the Comm-uni app prototype yielded more insights into user interactions. Over another five sessions, this is what I found about the second prototype.

Prototype 3: After applying the changes from the second round of user testing, I landed on prototype 3 linked here.

Brand Development

With the greyscale wireframe testing completed, I was able to start thinking about the brand that would embody the app. The brand would consist of developing a colour scheme, deciding on typography, and designing a wordmark.

Moodboard

To begin the branding process, I needed to draft a mood board. The first steps to start this was to draft a list of adjectives I wanted the apps brand to embody and then create a More A Than B list that would help me curate the right images.

I needed to brainstorm some names for the app that acts as a learning and communications platform for non-profit communications personnel.

I selected CommUni as the brand name because it combines the words of communications and university which connects the themes of connection and education.

Could also be a play on community which is the focus of most non-profit organizations.

The multiple possible meanings makes the name feel fun and comprehensive.

View Mood Board

The following colours were extracted from the mood board.

Wordmark Conception

To begin the process of developing a wordmark, I searched for fonts that felt modern, empowering, and bold. The pictured fonts here inspired the following sketches.

The sketches included symbols for education, learning, communication, and connection including books, pencils, brains, grad caps, communication bubbles, and people.The selected sketches are based on the font Bodoni 72 Bold and use the symbol of the communication bubble and the graduation cap.

From the developed wordmark, I was able to create an app icon that combines the elements of communication and learning from the chat bubble and graduation cap.Here is a preview of what the app icon would look like with other apps in an android app drawer.

Colour Injection

When I began to inject colours into the the wireframes, I realized that the app already has a lot of colour that won't be controllable because of the aggregated content making up a majority of the screens. I kept the 60/30/10 rule in mind using neutral colours as the majority.

Deliver

Hi-Fi Prototype

The high-fidelity prototype for CommUni was the result of extensive research, user input, UI and mood board inspiration, and multiple rounds of feedback-based iterations. After countless hours of work, multiple iterations, thorough testing, color injection trials, and brand development, I successfully transformed the prototype from mid-fidelity to high-fidelity, bringing the vision for CommUni to life.

Marketing Website

To market CommUni to non-profit communications professionals and convey its value, I created a marketing website for both desktop and mobile. Similar to the app development process, I began by searching for UI inspiration and exploring design ideas through sketching. The previously established UI library for the app significantly streamlined the design process, ensuring a cohesive and efficient development of the marketing site.

View Desktop Prototype

View Mobile Prototype

The Future

When considering the future steps for CommUni, I asked myself, "Within the non-profit community, who does this exclude?" Non-profits encompass a diverse range of causes and missions, and I believe there's potential for expansion beyond just being a platform for communications professionals. Adding features for content creation, the ability to share and collaborate on multimedia projects, and tools for tracking and analyzing engagement could empower organizations that focus on digital campaigns and remote work. This expansion would reinforce CommUni's value in supporting non-profits in their mission to make a positive impact.

I chose to look at "The Forgotten" tarot card of tech to think about the future and app impact because I chose a very niche target for CommUni.

When picturing the user base for CommUni, we must consider who might be excluded. Potentially excluded users could be:

Small Non-Profits with Limited Resources: These organizations might lack the necessary staff or technical capabilities to fully utilize a digital platform.
Non-English Speaking Users: If CommUni is only available in English, it may exclude non-profits operating in regions where other languages are predominant.
Grassroots Organizations: These groups might rely more on direct, in-person community engagement and less on digital marketing strategies.
Older Communications Professionals: Individuals who are less tech-savvy might find it challenging to adapt to a new digital platform.

If these users were to use CommUni, their experience might include:

Enhanced Connectivity: Access to a centralized platform could significantly enhance their ability to connect with other non-profits, share resources, and learn from successful case studies.
Resource Optimization: Tools for trend tracking and community engagement could help them make better use of their limited resources.
Learning Curve: There might be an initial learning curve, especially for those less familiar with digital tools, but support and training features could mitigate this.

Whose perspective is missing from the final product development?

Small Non-Profit Leaders: Input from leaders of smaller non-profits who face unique challenges due to limited resources.
Non-English Speaking Professionals: Insights from non-profit workers in non-English speaking regions to ensure language inclusivity.
Older Users: Feedback from older communications professionals to ensure the platform is user-friendly for all age groups.
Grassroots Activists: Perspectives from grassroots activists who might emphasize in-person engagement and may need different features.

Including these perspectives in future development could ensure CommUni is more inclusive and better tailored to the diverse needs of all non-profits.

Key Learnings

The UX design process is tedious for very good reason, it allows us to understand our target user and assign reason to each of our decisions along the way
The UX design process is never linear, you will need to go back to previous steps or temporarily skip a step depending on where you are at in the process
It is vital to organize files, documents, icons, images, and other elements from the beginning in order to be ready to hand the product over to development easily

Next Steps

Develop other pages for a fully functional prototype to get ready for development
Complete user testing on the hi-fi prototypes
Finish building desktop solution to allow this product to be even more accessible for communications personnel

KeepFresh Hero image (1728 x 775 px) (1).jpg