Digital Civics on Campus
Creating a supportive resource for Asian and Asian-American students at Purdue during a time when anti-Asian sentiment and microaggressions increased in light of the coronavirus pandemic
UX Design | August to December 2020
Collaboration with AAARC Purdue
Anti-Asian sentiment and discrimination have been an issue among Purdue students and graduates since long before the pandemic. Asian and Asian-American students need a supportive network beyond what Purdue currently offers to turn to when incidents of discrimination arise.
Process
Research & Analysis
Problem Statements, Secondary Research, User Interviews, Co-design
Ideation & Prototyping
Iterative Sketches, Website Design
Feedback & Conclusion
Peer Critiques, Reflections
My Contributions:
Gathered secondary research and synthesized findings
Conducted interviews with the user group
Developed and ran the co-design protocol
Built the interactive website prototype in HTML, CSS, and JS
Designing with people: Co-design
Purdue's current resources reveal a number of gaps around person-to-person contact and an overall lack of connection.
AAARCC (Asian American and Asian Resource and Cultural Center)
No direct contact with people with similar experiences
It is run by staff rather than students, which creates a disconnect
It seems to struggle to attract students to events
The incident report page reads as a way to record an event rather than guide people toward support
AAA (Purdue Asian American Association club)
Students in the club are divided into “houses,” each with one student leader as event coordinator and mentor
The houses can be very large (30+ students), which can lead to a disconnect between mentor and mentees. To better address these gaps, our team developed a co-design.
Goal: Discuss incidents of discrimination and identify what participants felt, what they did, what they wish they could have done, and — most importantly — what actions would have made a positive difference.
Participants: College students who have experienced anti-Asian sentiment and/or discrimination.
Structure: Three activities run remotely on a Miro board and Discord, each addressing a different aspect of the co-design's goal.
Insights From Co-design
Empowering victims of discrimination to stand up to and educate perpetrators would be more effective — and more needed — than focusing on the perpetrators themselves or creating a “safe space.”
People on the receiving end of discrimination have the power to reclaim their identity and stand their ground; they just need mentorship and guidance to do so. Educating random perpetrators in the moment is difficult — they're unlikely to listen, or are using their limited knowledge against minorities — and the victim may feel too uncomfortable or too angry to start an educational dialogue.
Having a prepared response to anti-Asian comments would be empowering.
On reflection, several co-design participants were critical of how they responded to anti-Asian behavior in the moment and wished they'd had a comeback or a way to educate the perpetrator. They often felt overwhelmed at the time, which kept them from responding; afterwards came rumination and regret at not having taken back their power with a confident reply. Participants felt a resource for comebacks would help.
Having a mentor who can relate to their lives would have helped immensely.
Growing up Asian American in the 21st century is different from what came before. Being an immigrant or the child of immigrants can feel difficult when there are few accessible resources from people with relatable backgrounds, and a general lack of representation. Participants wished they'd had a mentor when they were younger to guide and empower them — and expressed little desire for a safe space or a large organization as a resource.
Takeaways
We discovered that our participants:
Wanted to feel less isolated
Did not see value in trying to change the racists themselves
Did not feel empowered by reporting options tied to legal authority
Many of their experiences were microaggressions (often from friends, classmates, etc.); “official” means of reporting were not appropriate in this context
Felt the environment at Purdue made people uncomfortable or hesitant to address or discuss racism, creating a taboo around it
Felt a need to educate or inform perpetrators, felt pressure to do so themselves during their encounters, and blamed themselves for not managing it in the heat of the moment (which we believe is not their burden to bear alone, nor an easy thing to do)
Felt a lack of social responsibility/accountability around race-related issues on campus
With this in mind, we changed direction to address these underlying issues, so our design would empower our user group on a deeper, more meaningful level. Given the general lack of awareness and the nature of Purdue's campus culture, we also recognized a need for precursory work to lay the groundwork for empowerment down the road. A mentorship program might well be empowering — but a certain amount of foundational advocacy work has to happen in this space first to support it.
Sketching for Advocacy
Goal: Visualize and ideate on our co-design insights, and decide which directions hold the greatest potential for advocacy. Some questions we asked ourselves:
Does this site provide a platform for action over information?
Is the process simple enough that students will want to use it?
How is this transferring power back into the hands of Asian and Asian-American students?
Site mapping areas/locations of racial incidents
Goal: Show that incidents of anti-Asian discrimination are happening on campus, prove to students who experience them that they are not alone, and show the whole Purdue community that it exists even if it doesn't affect everyone.
How it works: Students would input their information regarding what happened during the incident and where it happened. This would then generate a pin, star, or marker of some sort on a map of campus that could then be shared with anyone via a simple link.
Reporting and discussing incidents
Goal: As with site mapping, prove that students who experience incidents are not alone — and that there are things they can do when they face racial injustice.
How it works: students would complete a quick, simple survey explaining in further detail what happened during the incident, how they felt, and what they wish they could have said. Information would then somehow be compiled and showcased for the community to view.
Mentorship and Community
Goal: Give Asian and Asian-American students a place for real conversations about what has happened or is happening to them, so they feel supported and part of a community.
How it works: students would input their demographic and contact information, as well as what type of connection they are looking to make–counseling, an upperclassmen mentor, and a group or larger community of students with shared experiences. They would then be placed with someone or invited to join the community.
Where do we go now?
Choosing a direction can be one of the hardest parts of the design process, and we had three solid options. In the end we returned to the questions we'd asked before sketching: Does this site provide a platform for action over information? Is the process simple enough that students will want to use it? How is this transferring power back into the hands of Asian and Asian-American students?
As a team, we went back and forth on whether to take the mentorship and script-creation suggestions from our co-design literally, or whether something else was driving them. What we hadn't yet realized was that these suggestions pointed to a need for unity — the realization that no one situation stands alone, and that there is a whole community of Asian and Asian-American students with a shared experience. We moved into mid-fidelity design still unsure which focus to tackle, but knowing any of them had the potential to empower.
Wireframing–”Building Up”
After sketching individual mockups of the site, we came together as a team to choose the elements worth keeping, based on our co-design insights and other research. We built these mockups in Figma and developed a collaborative mid-fi wireframe to refer to while coding the site.
With the mid-fi prototypes covering the site's core abilities, we layered in visual elements — a consistent typeface, colors, icons — to strengthen the site and bring it in line with the Purdue style guide.
Coding–”Building Out”
With the Figma mockups done, we started with semantic markup for each page, then set basic guidelines for fonts and colors to follow while styling with CSS. Working remotely, we coded collaboratively to produce a responsive, interactive site with JavaScript.
Heuristic Analysis
Goal: Inspect the site for design flaws using Nielsen's heuristics.
We chose a simple, time-effective approach to testing the final product: we identified which of Jakob Nielsen's 10 heuristics applied to our site and ran a heuristic analysis on those.
We tested the site as a whole — inspecting individual elements, but arriving at an overall assessment of its functionality. For each heuristic, the site either passed or failed. Failed elements will be considered in our project reflection but weren't changed for the final design during this project.
Final Design–”Acting Together”
Imagine the user experiences a racially-fueled incident on campus. Their friend had sent them a link to our webpage, so they visit it, immediately seeing the call to action and an option to share. Unsure if they want to share, they proceed to scroll.
↓
They read through a slideshow of other Asian/Asian-American students’ experiences similar to theirs. They had no idea so many others were experiencing the same thing! They feel less isolated.
↓
They continue to scroll and see the incidence map of campus. Through it, they are able to see where Anti-Asian sentiments are most concentrated.
↓
Seeing more information on why they should share and the number of students like them who have shared their stories, they are moved to do the same. They are moved to click “share” and are redirected to the questionnaire on the second page…
↓
Here, they are able to share their experience, including how they were feeling and what resources they wished they had. This questionnaire feels more personal than most other incident reports they have had to fill out, and they feel like they are supporting others like them by sharing their story. Once they click “share,” they are redirected back to the homepage where they can browse the archive or share the link with their friends.
Now, they feel less helpless and more empowered. They feel like the website could start to raise awareness and spread information on campus about their experiences.
That’s a wrap!
Through the co-design, we learned how much it matters to empathize with the people we design with and to create a safe space for them to share sensitive, personal experiences — especially when we couldn't be in the same room. Small, intentional choices had a real impact on participants' comfort and willingness to share. For example, we let participants keep their cameras and microphones off. We lost their expressions and body language, but some participants were far more comfortable sharing their experiences this way, which proved invaluable to the project.
On execution, we fell behind a few times and would have benefited from better time management. We'd have liked more time to code the site, and had to rethink some elements from our original vision because we lacked the technical skills or the time to learn them. Even so, we're proud of the work and the direction it took.
Above all, this project showed us that digital civics work can be powerful and impactful while being simpler than we first thought. Design doesn't have to be grand and complex to have a meaningful impact. Here, we learned that revealing information is radical in its own right, and that simpler foundational work is sometimes needed as a basis for activism. That made digital civics feel far more accessible and achievable to us, and we're grateful for the chance to engage with this space.