Charitable Impact

Online bank account for donations

In 2019, I joined Charitable Impact, a well-established mid-size startup based in Vancouver to start making practical impacts in people's lives.

For two years, I played a vital role in the complete redesign of the mobile app. My major contributions included recreating the onboarding experience, revamping all types of profiles, implementing personalized recommendations, and establishing a comprehensive design system.

I also lead iOS to Android transformation closely working with Android engineers and enhancing microinteractions on both platforms.

My mobile team won Best in UX and Best in Good at Van UX Awards.

Time

June 2019 – June 2021

Role

UX Designer, Design System Specialist

Team

1 Design Manager
1 Senior Designer

Tools

Sketch
Jira
Adobe After Effects
InVision

Discipline

UX/UI Design
UX Research
Graphic Design
Interaction Design
Design Systems

App Impact

App Impact

Key Figures

$1.2B+

$1.2B+

donated by users of Charitable Impact

13,000+

13,000+

charities have benefited from gifts sent by donors

183,000+

183,000+

people have given to the causes they care about

85%

85%

of user testers were able to describe app features

Product Background

Product Background

Mobile Team at Charitable Impact

Charitable Impact is an online giving platform built for Canadian donors that makes it easy to support any charity in Canada, raise money through crowdfunding, and track impact over time. Charitable Impact has helped more than 110,000 Canadians donate more than $660 million to thousands of charities nationwide.


Between 2016 and 2017, Charitable Impact saw a 170% growth in its mobile user base. In response, in mid 2018, the company decided to launch a newly designed mobile application by the beginning of 2020.

List of Projects

List of Projects

Design Systems

Established and maintained the Charitable Impact Design System

Established and maintained the Charitable Impact Design System

Onboarding / Sign Up

Onboarding /
Sign Up

Worked with a senior designer, illustrator, a UX researcher and UX writers to redesign the entire onboarding/sign up flow

Worked with a senior designer, illustrator, a UX researcher and UX writers to redesign the entire onboarding/sign up flow

Home Screen

Assisted senior designer turning mid-fidelity to high fidelity mockups. Closely worked with the Desktop experience team to match updated designs based on user testings.

Assisted senior designer turning mid-fidelity to high fidelity mockups. Closely worked with the Desktop experience team to match updated designs based on user testings.

Profiles

Mostly worked as a solo designer to produce mid-fidelity mockups and high-fidelity mockups. Closely collaborated with a UX researcher and participating in UT sessions.

Mostly worked as a solo designer to produce mid-fidelity mockups and high-fidelity mockups. Closely collaborated with a UX researcher and participating in UT sessions.

Messaging

Worked with a senior designer, a UX researcher and UX writers to freshly create a new messaging feature

Worked with a senior designer, a UX researcher and UX writers to freshly create a new messaging feature

Notifications

Closely worked with UX writers to redesign the notifications experience

Closely worked with UX writers to redesign the notifications experience

Personalized Recommendations

Collaborated with Desktop team in the enhancement of personalized recommendations feature

Collaborated with Desktop team in the enhancement of personalized recommendations feature

Android Transformation

Lead the Android transformation from iOS. Closely worked with Android engineers.

Lead the Android transformation from iOS. Closely worked with Android engineers.

Microinteraction

Studied microinteraction on After Effects and produced a series of microinteraction enhancement on iOS and Android such as popping hearts and success states.

Studied microinteraction on After Effects and produced a series of microinteraction enhancement on iOS and Android such as popping hearts and success states.

Final Designs

Final Designs

Mobile App

Mobile App

To enhance the mobile app, our team collaborated with illustrator Petra Sitaru and the branding team to develop visual assets. We analyzed the available data using various phases of UX analysis, actively sought feedback from donors, and conducted user testing sessions with our UX researchers.

Splash Screen & Onboarding

Splash Screen & Onboarding

Exploring App Features

The app starts with a splash screen, followed by an onboarding experience that guides users on how to add money, get tax receipts, discover new charities and groups, and give with friends.

Sign Up

Sign Up

Personalize the App

During sign-up, users choose their causes of interest, enabling the app to deliver personalized recommendations for charities and giving groups. By allowing access to their location, users can easily explore nearby charitable organizations.

Home Screen

Home Screen

Empowering Giving

The home screen offers a range of empowering features, including a user's impact account balance, the ability to give to friends, discovering new charities based on interests, engaging with stories and tips, accessing a help center, and receiving notifications.

Charity Profile

Charity Profile

Engage and Donate to Charities

Charity profiles offer users essential information about each organization, including contact details, website links, photos showcasing their activities, program areas, and transparent revenue and expense graphs. Users have the convenience of directly contacting the charity and making donations, empowering them to take immediate action and make meaningful contributions to the cause.

Giving Group Profile

Giving Group Profile

Coming Together for a Cause

Giving Groups are free fundraising pages that foster collective support for charities. These groups enable multiple individuals to come together, pooling or raising money to amplify their impact. Within Giving Groups, users can actively engage by posting comments, sharing updates, participating in the group activity thread and making direct donation to the group.

Campaign Profile

Campaign Profile

Unifying Impact

Campaigns track and celebrate the success of multiple Giving Groups, combining their fundraising efforts for a collective impact. Supporters can see the total raised and the cumulative impact of various fundraisers and directly give to the campaign.

User Profile

User Profile

Personal Details

Within the user profile, users have the ability to fine-tune the visibility of personal profile details by selecting the Globe, Friends, or Lock icons. These options allow users to manage the visibility of information such as friends, giving goals, causes and topics, joined Giving Groups, and favorites. Additionally, users can access the app settings, granting them further control over their profile and overall app experience.

Learning Outcomes

Learning Outcomes

What I gained from this project

During my two years at Charitable Impact as a UX designer, I have cultivated a solid skill set and gained valuable experience in collaborating and communicating effectively with diverse teams.

Working closely with product designers, graphic designers, UX researchers, UX writers, engineers, and other stakeholders, I have developed the ability to effectively collaborate on various projects.


In addition to contributing as a team member, I have also acquired knowledge in project leadership while spearheading the app's Android transformation and playing a key role in developing the design system.


These experiences have provided me with a well-rounded understanding of design processes, teamwork, and project management within the organization.

Stack I use every day

Figma

Framer

Arc browser

Notion

I'm a designer specializing in

✦ Product Design

✦ Visual Design

✦ Interaction Design

✦ Design Systems

I'm available for new opportunities

You can also reach out to me here

Stack I use every day

Figma

Framer

Arc browser

Notion

I'm a designer specializing in

✦ Product Design

✦ Visual Design

✦ Interaction Design

✦ Design Systems

I'm available for new opportunities

You can also reach out to me here

Stack I use every day

Figma

Framer

Arc browser

Notion

I'm a designer specializing in

✦ Product Design

✦ Visual Design

✦ Interaction Design

✦ Design Systems

I'm available for new opportunities

You can also reach out to me here