Broadway Serves - Case Study
A re-design of a Broadway Serves' website, a non profit organization connecting the theatre community with volunteer opportunities.
Video Presentation
Overview
Problem
Broadway Serves, a non profit organization, is looking to
re-introduce their company to the community with a cohesive look.
Goal
Re-design Broadway Serve's website to introduce their brand and mission to New York City, and engage current and future volunteers, collaborators, and sponsors.
Project Details
-
Timeline: 2 Week Project, Aug 26th - Sept 10th 2024
-
My Roles: UX Designer, UX Researcher
Research
Ethnographic Study / Getting Involved
Main Takeaways:
-
Participants love the sense of community
-
Participants love the joy of giving back
-
Participants lack information about how to stay involved, and upcoming events
-
Some participants have been involved for several years inconsistently
-
Participants of different ages enjoy different types of events
-
Participants signed up on social media
-
General feeling of friendliness / togetherness
Design Analysis of Original Site
Main Takeaways:
-
Inaccessible color-contrast
-
Difficult to find information
-
Inconsistent use of categories & page titles
-
Inconsistent button & linked text style
-
Lack of typographic variety & hierarchy
-
Lack of alt text
-
Too much plaintext
-
Lack of whitespace
Usability Testing
Pain Points
Accessibility
Low-contrast text and fast moving slider galleries make the design less accessible.
We can make the design more accessible and readable, which will help users of all abilities connect with the company.
Information
Lack of typographic variety and hierarchy make it difficult for users to find information.
We can break up text blocks and eliminated words, which will help users absorb important information, and skim for main content.
Engagament
Lack of recent content and calls to action prevent user engagement.
We can amplify calls to action and showcase recent company activity, which will help users engage with the website, and get involved with the company.
Navigation
Inconsistent page titles and button styles make navigation challenging.
We can make the design more cohesive and intuitive, which will help users effortlessly navigate the site.
Personas
James Danford
About:
Age: 32
Career: Broadway Actor
Background:
James is an actor who just moved to NYC after landing his first role on Broadway. Living on his own in a new city, James is having trouble settling in and missing the sense of a community he felt in his hometown. He loves getting involved in community service, so he did an internet search for community service opportunities within the theatre community. He stumbled on Broadway Serves' website and got excited, but isn't sure how to get involved.
Frustrations:
"This would be the perfect way for me to connect to the theatre community and the NYC community by doing something I love... I just don't know how to get involved in this. I'm not seeing any recent events, but I don't know if I should just straight up email them or what. The only thing I see is I can email them or donate to them... so maybe they just want donations?"
User Stories
James Danford
User Story:
As a Broadway actor who just moved to the city, I want to see if Broadway Serves has any upcoming events I can get involved with, so I can find a community of like-minded individuals.
Design Process
Brand Identity
Information Architecture
Iteration
Transformation
IMPACT
Client Testimonial:
"The feedback for our new website has been wonderful! Thank you for making it so beautiful and informative."
-Kimberly Marable, Co-Founder of Broadway Serves
"I cried when I saw the preview! We are so thankful for all of the work and care that you've put into it."
-Carla Martinez, Program Coordinator for Broadway Serves
Takeaways
Addressing Pain Points
-
Created an accessible / readable design
-
Helped users absorb important information, and skim for main content
-
Helped users engage with the website and get involved with the company
-
Helped users intuitively navigate the site
Challenges
Creating a website that feels current, so users can stay informed and engaged with the company, was an important goal. The challenge was the company wouldn't always have time to update this information. On top of creating an simple design for upcoming events that could be easily edited to reflect current programming, I decided to add an instagram feed that would be linked to the company's frequently updated instagram.
Showcasing the three different programs within Broadway Serves - emphasizing their differences while supporting a cohesive company brand - was a big challenge. Using cards to display and briefly describe each program, each with a photo, helped me conquer this challenge.
Personal Growth
One thing I learned was how important it is to clients to keep the brand of the website consistent with the company's brand on social media and other platforms. Although it does give the design certain constraints, including that brand identity from the first iteration saves a lot of time and energy.
In the future, I would consider designing mobile-first even when I know I have to implement the design on a platform like Wix which doesn't allow for mobile first designing. Just because the implementation of the design can't be done mobile first, I shouldn't have designed for mobile last when I knew that many users would be accessing this website on their phones. This decision made the design process more challenging for me, and I think designing for mobile first would have opened up a lot of creative options.