Partnered up with numerous universities, GiveCampus is a platform that makes the donation process transparent and stress-free. Schools and individuals can launch campaigns for scholarships, classes, or events. Anyone can make a donation or offer a matching donation. Using Facebook Connect or with an education email, users can set up their own profile and networks in order to explore campaigns that are relevant to their interest.

I was in charge of the visual creative direction of Campus and worked on designing the web interface. Currently on the web only, the design of Campus aims to instill a sense of collegiate nostalgia. (Remember the time when you sat on the quad with your best friend discussing calculus or philosophy?) This simple, yet vintage look is achieved through combining subtle textures with large icons, modern typeface and contrasting colors.

University logos are used throughout the site to further bring up a sense of collective belonging for the users, as well as allowing them to quickly identify campaigns while exploring. The main page of the site consist of school logos for quick navigation to trending, recommended, and ending soon.

Two types of campaign cards are used on the main page. The “Trending” section, which consist of friends’ updates, utilizes a condensed version without a description while the “Explore” section uses the full version. All other major clickable links of the site are constructed in a similar manner combining large photos, icons, and a description or link below.

Stylistically, the entire site is tied together with the main page. The main function is to explore and donate to campaigns. This wire frame shows the Campus is structured, where the main page and campaign page have several smaller affiliates. Details such as border edges and hierarchy are consistent throughout.

Each campaign has its own page, reachable by clicking on any of the campaign cards. This page features a large video that spans across the entire width and an easily recognizable donate button that is above the fold. Below are tabs where people can browse details about the campaign, its donors, advocates, etc.

Once people arrive at a campaign they are interested in making a donation to, they are presented with the options to donate, offer a matching donation, or advocate for the campaign. Each of these actions is presented with inline-instructions, making the process clear, fast and painless.

Donations can be made very simply where the amount people donate can be variable. Matching donations are displayed to encourage people to take heed. Once a donation is made, donors are asked a few stats regarding their status such as alumni relations, these are set up by the schools or individuals that run campaigns.


Because of its social nature, everyone has a profile on GiveCampus and you can connect with Facebook to find and follow your friends. When your friends make a donation or create a campaign, you will receive notifications of these activities. Profiles can also be used as a dashboard to keep track of your campaigns and the ones you have donated to.

There are many different notification types within the system: user focused notifications and campaign focused ones. User oriented notifications alerts you relevant activities from people who follow, as well as actions that concerns you. Campaign focused notifications are triggered if you have donated to a campaign or if you subscribe to it. Your can also choose to receive notifications from your alma mater. From notifications, there are a set of actions that can be taken related to each notifications, following someone back, or get notified of the progress of new campaigns.

While people can make donations to schools and campaigns anonymously, the part that sets GiveCampus apart and encourages peer donations is the social aspect. We utilize the Facebook SDK for easy log in and keeping up with your friends. For the log in screen, we tested a vertically stacked account and Facebook log in version and another (seen below) horizontal one. With the vertical one, we saw that people were confused about how to sign up or log in, where they thought they must put in their credentials like name and email first, then also must complete the Facebook portion, where it is actually either or. So we switched to the horizontal version where the left section is account set up and right hand side is Facebook log in to increase conversion and minimize confusion.

GiveCampus is also a platform where schools or alumni can create campaigns. It is currently available to schools that have partnered up with GiveCampus. Campaign creation is fairly simple and offers a set of robust options and tools for making a strong plead for the cause.

As an admin of a school, you would also be able to see a series of analytics revolving around the campaigns you have created. These data points range from very high level such as number of unique donors across all campaigns, to campaign specific stats such as the the highest contributed user and amount. The admin would also have input fields where custom school related information can be published about the school, such as their mission statement. Admins can receive full reports of their campaigns or connect with its alumni at any time.

Currently, GiveCampus is working hard to establish partnerships with a number of institutions in the U.S. They have recently graduated from Y-Combinator, summer class of 2015! To learn more or partner up with them, please use the link below.  Please don’t hesitate to contact me if you’d like to learn more about the design process for GiveCampus. Thanks!

Product: Kestrel Linder

Design & Creative: Sophie Su (me)

Engineering: Michael Kong, Jamie Warnock

<< Previous




Product Design, Visual Design



Next >>

©  Sophie Ying Su, 2017