top of page

The Bridge Miami

The Bridge is a non-profit organization that serves as a music and arts incubator. The Bridge provide support to artists and musicians as they pursue their professional goals. The organization strongly believes in community activism and actively engages the local community and neighbors through arts and activism initiatives

Thebridge miami prototype 1.png

About this project

The Bridge Miami, an esteemed incubator for South Florida artists, has been a beacon of creativity and community support. However, it now faces a significant challenge: a struggling website that hampers its ability to connect with artists and donors effectively. The current website suffers from poor user experience, an unclear message, and a lack of vital information. Our project aims to redesign the website, revamping the visual design, improving user experience, and increasing credibility.

Project type: Academic, Design Sprint
Timeline: 1 week
My role: UX Co-Maker
Tools: Figma, Canva, Otter.ai.

icons8-figma-240.png
icons8-canva-240.png
download.png

Team Members

Diana V.

IMG_2543.JPG

Stefania G.

2.png

Laura M.

3.png

Marvin A.

Primary Research

We conducted 3 interviews as a research tool, providing us with a valuable opportunity to gain firsthand insights into the pain points, motivations, and behaviors of our target users. To ensure relevant participant criteria, we specifically interviewed individuals who had previously donated to non-profit organizations.

Insights

To streamline the organization and extraction of insights from the gathered information, we employed an Affinity Map. This powerful technique empowers us to systematically analyze and synthesize qualitative data by effectively grouping interconnected insights together.

Affinity map Stage 1.png
Affinity map Stage 2.png

Chosen Theme: Transparency

The insight that emerges from these interviewees' comments is the significance of transparency and communication in the context of donating to non-profit organizations. Each interviewee expresses concerns regarding the transparency of the organization's mission, the allocation of funds, and the impact of their donations.

How might we increase transparency around The Bridge Miami’s community efforts and needs in order to motivate potential donors to contribute?

Persona

Through meticulous analysis of the interview insights, we developed a comprehensive persona that encapsulates the essential characteristics of our target user. This persona acts as a dependable compass, directing the design process to effectively meet their needs and exceed their expectations.

Persona.png

Current Journey

To identify opportunities for enhancement, we conduct a comprehensive evaluation of the current donor journey. This meticulous assessment allows us to pinpoint specific areas that require improvement and fine-tune the overall donor experience.

Current journey 2.png

UI Inspiration Board

We gather a diverse range of visual elements that allow us to explore different design directions for the website.

UI Inspo Board.png

Sketches

Following the creation of a UI Inspiration Board, we transition to the sketching phase, where we initiate the development of preliminary layouts and interfaces. To foster exploration and generate diverse design concepts, we employ the "crazy 8" method, enabling us to generate a broad spectrum of exploratory sketches. These sketches serve as the foundation for our solution ideas, which we subsequently refine and transform into wireframes

sketches.png

Wireframes

Upon completing the initial sketches and drawing inspiration from various UI sources, we proceeded to create grayscale wireframes. This conversion process involved refining the sketches and translating them into simplified, monochromatic representations.

Wireframes 1.png
Wireframes 2.png

User Testing

In order to optimize the application's usability, we conducted rigorous usability tests with a sample of three individuals. Our approach involved introducing the participants to the product, providing them with a comprehensive understanding of its features and functionality. We then presented them with a series of tasks to complete, allowing us to observe their interactions and evaluate the ease of use of the application.

user testing.png

Testing findings

During the user testing phase, we observed that two individuals encountered difficulties in completing the initial task of reviewing the testimonials. In addition, we received a valuable suggestion from one participant regarding the navigation bar. They recommended including the organization name in the navigation bar to provide clearer context and improve navigation clarity.

1. To address the challenge of navigating through the testimonials section, we made the decision to incorporate arrows that provide clear visual cues for users to understand how to navigate between different testimonials and stories.

Before

After

Wireframes v2.png

2. In response to valuable user feedback, we implemented the suggestion to prominently display the organization's name on the navigation bar. This addition not only provides users with a clear sense of brand identity but also serves as a reassuring element that reinforces their recognition and familiarity with the website.

Before

After

High-Fidelity Prototype

Following the implementation of user testing-driven changes, we injected colors into the design, bringing life and visual appeal to the interface. Building upon the refined design and color integration, we proceeded to develop a high-fidelity prototype.

Thebridge miami prototype 1.png

Key Learnings

  • Prioritization: We learned from our teammates multiple prioritization & organizational strategies from the UX to the UI side.

  • Convenience is key: Many interviewees were encouraged by convenience in payment processes for donations.

  • Knowing our strengths: Role distribution speeds up the process.

Next Steps

  • Design for another user: create a second persona that would represent the local artists.

  • Add a photo gallery: Photos from events with captions and alt text.

  • Calendar Integration: Add Google event calendar in the home page.

  • Mailing List: Keep donors updated in monthly newsletter.

  • Design remaining pages: About, Residents, Booking, Contact

Designing User-Centric Solutions
Let's Connect and Make an Impact

  • LinkedIn
  • LinkedIn
bottom of page