BridgeMadison
CSSA Event Hub
BridgeMadison is a WeChat mini-program developed by the Chinese Student and Scholar Association at the University of Wisconsin-Madison. Designed specifically for Chinese students at Madison, this innovative platform serves as a centralized hub for discovering and participating in both personal and local events tailored to their interests and needs.
What's the Problem?
The primary challenge for Chinese students at the University of Wisconsin is the lack of a cohesive, supportive, cultural-based community among peers from the same culture.
Many experience feelings of isolation and detachment, particularly because they are far from their native cultural and linguistic environments. This sense of alienation can negatively affect their overall well-being, mental health, and academic performance.
“How might we facilitate stronger connections among Chinese students in Madison to enhance their mutual support and sense of community, thereby improving their overall experience and well-being while studying abroad?”
Process
EMPATHIZE
Potential Solution
CSSA decided to build a Real-time Events Hub that offers a centralized platform for international Chinese students at UW-Madison to discover and participate in personal and local events.
This feature provides real-time updates on activities and social events happening around Madison organized by students or local organizations. Users can discover events that will be held soon; create their own events, send invitations, and engage with other attendees directly within the app.
Interviews
12 interviews were conducted with a diverse group of Chinese students. Allowed us to delve deeper into individual experiences and specific features they would find beneficial.
Process
User Research
Objective
Understand the unique needs, behaviors, preferences, and challenges faced by Chinese students at UWM. We aimed to uncover insights that would inform the design and functionality of the CSSA Event Hub, ensuring it effectively addresses the students' desires for community, social interaction, and cultural engagement.
Methodology
We employed a mixed-methods approach to gather comprehensive insights: Interviews, Surveys, and Secondary Research.
Surveys
Using Tencent Voting and Google Forms, focusing on their social habits, event participation levels, digital platform usage, and barriers to community engagement.
Logo Design
Secondary Research
Investigating the correlation between social engagement and the mental/physical health of international students is essential for what features/contents should be included.
04
Process
DEFINE
Persona
I illustrated the behavioral traits identified in the empathy map to a user persona. The goal here is to maintain a connection with the product user throughout the development process.
Pain Points and Solutions
Create a platform for discovering events that are relevant to Wei’s interests and cultural background, helping Wei overcome his challenges of isolation and cultural barriers, and enabling a more fulfilling university experience.
Real-time Event Updates
Provides users with up-to-date information on activities and social events around the University of Wisconsin-Madison.
Process
DESIGN
Timeline
2024 / 3 months
My Role
Challenge
Role
Contract UIUX Designer
Clients
CSSA at UW-Madison
I cooperate with the development team and stakeholders of CSSA as a solo UX Researcher and Designer. I collected user data, mapped out an appropriate user flow, designed an MVP user interface, and presented a high-fidelity interactive prototype to the stakeholders for feedback.
A critical aspect is crafting a bilingual interface that accommodates both English and Mandarin speakers, removing language barriers to foster inclusivity and engagement.
Additionally, the project demands effective collaboration with the development team to ensure the app's features and design can be integrated seamlessly into a WeChat mini-program, considering technical constraints and user experience.
Process
IDEATION
Personalized Event Discovery
Users can discover upcoming events, with the option to subscribe to preferred event categories and utilize filters to find events that match their interests.
Organize Concepts into Designs
Main Features
Event Creation and Invitation
Allows users to create their own events, send invitations, and interact directly with attendees within the app.
Sitemap & User Flow
Sorted through the main features and functionalities to complete the sitemap, keeping track of all the screens needed to design.
After a design meeting with the CSSA’s leader team and Developer team, I modified the user flows to establish a solid information architecture before moving into the design phase.
Offers a personalized event discovery experience for Chinese students at the University of Wisconsin-Madison. Users can subscribe to their preferred event categories and utilize intuitive filters to find events tailored to their interests.
Allows users to seamlessly explore nearby events using an intuitive map interface. By displaying each event with a category icon, users can identify and engage with events that align with their interests.
Choose Event Tag
Map View
Event Details & Community Insights
Enter Details
My Profile
19 Total Participants
Screen Sketches
Rapidly sketched out the screen’s layouts and functionalities to simplify the following wireframe design process. Sketching out the ideas in two rounds of time, helps me figure out the design errors and problems at the early stage.
User Tests
I conducted user tests to gather feedback directly from the target demographic and observed their navigation choices, soliciting their opinions, and noting any usability issues they encountered. This hands-on feedback was invaluable; it not only highlighted critical areas for improvement but also confirmed which design aspects were resonating well with the users.
Paper Prototype
Visual Identity
Align with the University of Wisconsin-Madison's visual identity while also catering to the cultural aesthetics appreciated by Chinese students.
On Boarding
Create Event
Process
TEST
Process
Launch
02
An event can fit into multi-categories
When creating an event, the user thought the event should have more than one tag.
Solution
Users could choose more than one category when creating an event.
Map Explorer
01
Event Explorer
02
03
05
Try it Out!
Filtering
Provides users with detailed event information, including host details and attendee lists, fostering transparency and community engagement. By offering insights into who else is attending events, users can easily connect with peers and build meaningful connections
Users can choose a category, input event details like title, location, and cover image. Additionally, they have the option to set a ticket price, enhancing flexibility in event planning, enables users to tailor their event experiences to their preferences.
Personalized Profile
View the Event
Allows users to manage their event participation, adjust subscribed categories, control profile visibility, and invite friends, ensuring relevance, privacy, and social connectivity within the community.
Invite Friends
Explore
Event Details
Join the Event
100% of users want to participate again
Wireframe
User Testing Insights
01
Accidentally back to the main screen
When creating an event, the user wants to go back and choose a “category” again, but it directly goes back to the main screen without saving.
Solution
Add a “Save” alert and a “Back” button.
Final Version
Design Solution
Testing and Iteration
Usability Test
To ensure the effectiveness and usability of the app, I conducted 3 rounds of user testing sessions with CSSA members and UX classmates, observing them as they interacted with the app's features, gathering feedback, and identifying areas for improvement.
Feedbacks 02
Users are unable to determine which event is nearest
The user’s location is not displayed on the map, and the selected event is not clearly marked.
Solution
Add a red dot to represent the user's current location on the map. For the event's icon, use a contrasting color and increase the size to make it more prominent and easily identifiable.
Feedbacks 03
Users feel the "My Profile" page lacks essential information.
More than half expressed a desire to see other users' WeChat numbers to facilitate friend requests. Additionally, there is confusion about the function of the "hide my profile" option.
Solution
Incorporate a button for WeChat numbers, while providing an option to hide their profile from the public, which would conceal their contact information and event participation details.
9 Feedbacks Suggestions
Design Iteration
Based on the feedback, the iterative process involved making adjustments to interface elements, refining feature implementations, and optimizing navigation pathways.
Feedbacks 01
The selected state of the items is unclear to the user
They are uncertain whether the items highlighted in pastel or grey are active selections, as the grey color gives the appearance of the buttons being disabled.
Solution
Use the platform's primary color to indicate selected items, ensuring consistency by assigning a fixed color to each event category throughout the platform. Additionally, expand the selection by adding more categories for users to choose from.
Collaborating with development team
I collaborated closely with the developer team to launch the CSSA Event Hub app. By translating design concepts into actionable tasks and providing valuable insights throughout the development process, we ensured a seamless implementation that met the needs of our users.
Reflection
Collaboration with the developer team and user feedback was instrumental in refining the app's features, ensuring they met real-world requirements.
Additionally, the role of cultural sensitivity in design became particularly apparent. As we targeted a diverse and multicultural audience, it was essential to integrate cultural elements thoughtfully. Specific examples of this include adapting color schemes to avoid cultural misinterpretations and including multi-language support to accommodate different linguistic groups, demonstrating how cultural nuances can profoundly influence design outcomes.
