UX/UI Case Study

Group Projects: The Scourge of the Lifelong Student

The Hors d'Oeuvres

When I began my career as a Designer, I was blissfully unaware of the amount of time I’d have to spend honing my craft. Fortunately, the structure of a class has always suited my learning style. But, like most people, I feel as excited about group projects as I do about family holiday meals.

Last year I registered for a series of courses in UX/Visual Interface Design through UW. A friend had just completed her certificate and recommended it to me. This certificate program was so popular that the next two sessions were already booked and I couldn’t begin for another six months. So I had one hundred and twenty days to think about something that my friend had mentioned inconsequentially: the first course began with a group project.

We’ve all been there; your professor announces the next project is going to be a group project, and you die a little inside, because you know what’s coming … Scheduling conflicts. Mismatched expectations. Communication struggles. Perhaps even personaity clashes. And when it’s finished, all you’re left with is a queasy sense of resentful accomplishment. The whole experience feels a bit like, well, a family holiday meal.

Our first class session was like any other first day, full of orientations and onboarding procedures. And then came the time to discuss the group project. Given the flood of questions that followed, I was clearly not the only person with anxiety about it.

Each group would have a pre-written problem statement to use as a prompt in developing our UX/Visual Design solutions. Out of the three courses in the certificate program, only the first course was group work. As our professor patiently explained, this first course was largely research which was better shared amongst groups of four. Over the next two courses, we would work individually using the research from course one to develop our apps.

My group’s problem statement was a doozy: how might we help voters who use social media gather unbiased facts and warn each other of nefarious content?

So this was how I found myself, an introverted adult human who knows better, having frequent conversations about politics with strangers and loved ones alike.

How might we help voters who use social media gather unbiased facts and warn each other of nefarious content?

The Entree

DESIGN THINKING
Research, research, concept testing, and more research

Our first course showed us how to fill out our research plans by using four research methodologies so that we would better understand the landscape of our problem statement.

We conducted 16 interviews to collect qualitative research about the goals, needs, pain-points, thoughts, feelings, and actions of our interviewees with regard to our team’s problem statement.

We divided our planned research areas amongst the group and compiled a Research Notebook for collecting and document our team’s findings.

We worked as a group to brainstorm as many solutions as possible to our problem statement. As a group, we created a concept catalog to compare and contrast the results of our brainstorm.

Each team member selected one concept from our catalog to develop for the test study, and Town Square Debates was born.

“For people who need humanity in social media, Town Square Debates helps users to formulate ideas and support them effectively so that they don’t end up in unproductive fights.”

Our team worked together to develop the testing protocol and administer the test study to our participants.

Following the concept test study, each participant completed a one-page survey about the concept they chose to learn more about.

Key Takeaways

Although the concept I created was not the winner of our group, test participants frequently expressed a desire for learning experiences that dovetailed with their interests. I incorporated this feedback by changing the theme of the app to a game to help it feel more accessible.

I conducted a card sorting activity with eight participants to discover how users expect to interact with my app. This helped me to identify and prioritize features.

“DebateQuest is a role playing game that teaches valuable debate skills while players have fun. The All-knowing Oracle guides Warriors through training to prepare for Quests, where they face off with opponents in timed debate formats.”

With my research in hand, I began to organize and label my content. I created a sitemap to help me understand the scope of my app.

I created three user scenarios and delineated three pathways that would allow users to accomplish their goals within the app.

Relying on established UX/UI patterns where appropriate, I referenced my sitemap to sketch out the screens that would guide users through the pathways identified in the previous step.

I developed a testing protocol that led users through scenarios and asked them to complete specific tasks using the wireframes.

Following the usability study, each participant verbally answered a series of questions and then filled out a one-page survey about their experience.

APPLIED UX DESIGN
App architecture, user journeys, wireframes, and more testing

The second course taught us how to apply our research and develop the first iteration of our apps, and also concluded with a round of testing our apps with our classmates.

Key Takeaways

Test participants experienced cognitive overload and found the navigation and labeling confusing. They were unsure about which parts of the app would complete their tasks. This feedback showed me I needed to improve hierarchy of breadcrumb links, implement clickable tool tips, and divide the data into smaller, more easily understandable portions.

INTEGRATING UX AND VISUAL DESIGN
Setting the mood and style to create a prototype

The third and final course focused on translating our lo-fi designs into a unified system to create an app prototype that would be ready to present to a development team.

Once again referencing all of my research up to this point, I created a series of mood boards to describe my vision for this app.

Employing atomic design principles, I created the molecules and atoms of my app to reflect the decisions I’d made in the previous step.

Referencing my modified wireframes, I applied my styles and created a working prototype. I gave a 10-minute presentation to my class describing how my app evolved from concept to prototype.

 

The Digestif

All joking aside, I am grateful to my group members and cohorts for creating the foundation to make this project what it was. They helped me to question my assumptions, expand my perspective, and ultimately make a better product.

And you can’t always say the same about a family holiday meal.