Brandon Sapalo: Portfolio

Design

USC American Lung Association

We need a new website!

The USC American Lung Association (ALA) needed new website! As campus clubs move online, ALA found themselves falling behind with a lackluster website and no cohesive design or affiliation to their Instagram brand.

My goal as a web designer...

My team and I worked to create an appealing website so ALA may:

Create a positive & professional first impression of the club
Align their website with their instagram promotional material
Enable easy sign up to their mailing list

My team

I worked on a team of 4 other designers from a club called Innovative Design at USC! We perform pro-bono design/coding/photography for USC organizations.

Why our solution achieved the client's goals

Check out the differences between the NEW and OLD versions below.

Old Website

No clear logo or branding
Missing a navigation bar / hamburger menu
No call to action button
Bad photo alignment
No color scheme or theme

New Website

Clear logo in the top bar
Navigation bar for quick access
"Fight for air" call to action button
Photos consistently aligned with text
Royal blue color scheme to match their Instagram brand

Please visit https://alausc.webflow.io/ to check out the NEW & IMPROVED USC American Lung Association website.

How did I get to the solution?

The steps I took to arrive to the solution:
1) defining the target user 2) identifying the old website's shortcomings and 3) connecting the clients goals to our changes

Defining the target user

This is an on-campus organization, so the target users would be USC students. However the user base could include:

USC Students
External organizations looking to support financially
National American Lung Association members

Identifying the old website's shortcomings...

I identified several pain points from a design perspective:

Images labeled with their file (i.e. image123.png)
Little to no color throughout the page
Terrible website name => "coughusc.com"
Poor use of whitespace
No call to action or easy access to mailing list
No links to social media accounts

Connecting to the clients goals...

USC ALA aimed for several goals:

Create a positive & professional first impression of the club
Align their website with their instagram promotional material
Enable easy sign up to their mailing list

Putting it all together!

After requirements gathering and research, I began iterating on possible designs.

Low Fidelity Mock-up

Mid Fidelity Mock-up

Final Version

This final version is a combination of my designs and my teammate's designs. Additionally, it was my responsibility to implement the designs in Webflow, and you can view the final version at https://alausc.webflow.io/.

Reflection

I had so much fun with my team! It was really rewarding for me to join a design TEAM (emphasis on TEAM)! I've always worked as the only designer on a developer team or at a small company, so having others critique my work and teach me about their design processes gave me a whole new perspective.

I also really valued designing for an organization with a great cause. USC ALA aims to improve lung health and prevent lung disease through research, education, and advocacy. While I'm not a part of the club, it felt as if I was contributing to the cause in my own way. Overall, it felt really rewarding to work for this client, and I look forward to helping more benefit organizations in the future!

Want to see my other work?

Check out my other projects

July 2020 | Editing Tool, UX Design