2021 General Assembly Hackathon
🥇First Place Award Project🏆
General Assembly hosted the 2021 June Hackathon, an immersive exercise that necessitates collaboration between designers and developers. Over 50 individuals have participated and were assigned into teams which includes software developers and UX designers, to come together to solve a problem.
The set rules and the topic is intentionally broad to allow teams to bring forward any solution you see fit. UX Designer requirements were to create a functioning prototype design backed with research, and the software developers were required to come up with a fully functioning web app.
What is GA hackathon?
My role as UX designer
As a UX Designer on this project, I wanted to gain experience working with cross-functional teams, especially with software engineers, and be challenged in the agile design process.
Before beginning the design and research, I wrote down what I thought might be most needed to have a successful outcome on this project.
What is Serenity?
Serenity is a General Assembly Hackathon first-place award-winning fully functioning web app that helps caregivers the true mental and emotional support they need to cope with their loss or going through a loss.
A product that not only brings a community together but also provides individual support to the user who might need a simple listening ears to share their story.
Requirements for successful outcome
1. The project planning must meet the 3-day agile design sprint.
2. Clear communication between all the team members.
3. Be thoughtful and empathize with the team members.
UX design project breakdown
1. The project planning must meet the 3-day agile design sprint.
2. Clear communication between all the team members.
3. Be thoughtful and empathize with the team members.
-
Design MLP(Most Lovable Product)
-
Read more about my MLP case study here
-
Research real users
-
Create a strict timeline for each meet-up.
-
Always be clear on each step of the stage.
-
Stay in a single-channel communication.
-
Separating design team to seperate meeting.
-
Understanding of team members.
-
Deep empathizing towards Serenity user.
-
Compromising for the team efforts.
My understanding of true UX
During the 3 days, all my focus was on how to work the UX design process in an agile design sprint.
The core of UX is how we understand humans and use that to influence decisions and behaviors.
When UX is done right, you are helping your team or your client understand humans and make better decisions based on that understanding.
Case study overview
Summary:
As a UX Designer, I participated in a General Assembly Hackathon where I was challenged in the 3 days of an Agile environment to create a fully functioning web app with software developers.
Responsibility:
Collaborate with engineers and data analysts to create mobile application with visual styling of the design system to high fidelity prototype for user research. Guiding teams to challenge in the agile design process.
Role:
UX designer / Visual designer
Timeline:
June 2021
Team Serenity
Our team consisted of 4 UX Designers and 5 Software Developers.
On our first meeting, everyone shared each other's goals and expectations for the Hackathon design sprint.
This helps to understand each other's points of view and be able to communicate better.
In a free conversation, we talked about the problem the team was given to solve.
Emerging pattern through conversations
In a genuine conversation, a pattern and emotion were formed and it became clear to the team who we wanted to solve the problem for.
In our team, everyone has lost someone. And every one goes through this.
And shockingly there were not as many products or resources that solved this problem as we imagined to.
Let me tell you how we as a team and I as a UX Designer solved this problem.
Serenity /səˈrenədē/
From our direct problem statement, we were able to form a name Serenity.
Serenity was created to help caregiver the true mental and emotional support they need to cope with their loss or going through a loss.
As a team, we were able to empathize on the topic deeply, and we truly believe it can connect so many more in the future.
Our focus for Serenity is to give true support to the users and help them give peace of mind.
(noun) the state of being calm, peaceful, and untroubled
Problem to solve
This problem was given to all the participants.
To understand this problem, I broke it down into three parts.
1. What: Create to help
2. Who: Caregiver
3. Why: Need peace of mind
This helps me during my process to understand the problem and also helps to divide up the role as a team.
What can you create to help a caregiver’s peace of mind?
Competitive analysis
To understand the current business market and to find out the competitor's function I started to begin competitive analysis.
In the competitive analysis, I can understand which competitors offer similar functionality as ours and learn the different approaches to the users of other products.
Understanding which method was successful will help us design what our users might need.
Then there is the learnability from the user to understand the product's approach on the onboarding and the user needs to be able to use the product as soon as they are done signing up.
User interviews
In total, I conducted 3 user interviews with an objective to learn more about the experiences and needs as caregivers.
All 3 users I interviewed had mentioned that they would like to speak to people who can relate to their situations and be able to talk about the caregiver's experience to others who can understand and support them.
Another trend and pattern that I noticed in the interview is the necessity of content resources that can help the user to better understand and learn what they can do to better cope with their situations.
From this user interview, I learned that Serenity needs to provide a chat functionality where users can easily chat with someone about their situations as well as learnability feature through resources.
Key insights
-
"I think it would be helpful to talk to others in the same situation and to have a support network that checks in on you"
-
"I would consult a Facebook group of people who were experiencing a similar situation."
-
"Talking with other coworkers who can relate is most common."
-
"Just helping people be as comfortable as possible."
Research backed design
Competitive analysis
User
interview
To begin the design process for Serenity, I had to figure out the research plan and how we could research and bring as much data in a short period as a team. There were two methods that I thought might be possible.
After our research and before actual designs, this was the perfect time to create a user flow to be shared with the developers to help them understand the user journey for our persona.
Once this user flow was presented to the developers, it was clear for them to understand the functionality in each step.
User flows
Persona
-
Conveniently chat with other healthcare workers
-
Maintain anonymity for the sake of patient privacy
-
Access personalized informational resources
-
Conveniently chat with a mental healthcare professional
Laila Snow, R.N.
Age: 34
Hospice Nurse
Chicago, IL
"I love what I do but it does take a big toll on my emotions.."
Needs
Goals
Pain point
-
Laila is often hit hard by the loss of a patient, especially when the patient is a child or suffers from a severe degenerative condition.
-
When this happens, Laila has difficulty finding the support she needs to cope.
-
Learn more about coping with losing child patients
-
Learn more about good self-care practices
-
Get support from people in the same situation
-
Receive mental health support as needed
Wireframes
It was my responsibility to create a foundational wireframe for our prototype. In the low-fidelity wireframe, our users are to complete 3 main tasks.
1. Register by creating an account
2. Go through the onboarding process
3. Finally get the support the users need
These were the most important MVPs from the UX team, and the developers understood to make that their MVP and split the workload.
After completing the wireframe, I went over it with the rest of the UX designers and the developers.
Presenting this low-fidelity wireframe to the developers helps the developers to visualize the user journey, which will help them to get the first visual design of what the app will look like.
Design system
Creating a well-structured design system is vital when working with developers in a short period of time.
This will help the developers understand the design with clear guidelines with design specs that the developers do not need to try to figure out by themselves.
Prototype
With the design system, I was ready to start applying it to the prototype.
Creating a well-structured design system helps to create a cohesive prototype.
After the first iteration of the prototype, it was shared with the designers, and after a few more iterations, it was passed to the developers to help bring them to life from design to development.
What I learned as a UX designer
What I learned through this Hackathon is the true definition of teamwork and experience working with cross-functional teams to create a product that mattered deeply to all of us.
A true understanding of empathy from all the team members and working in the agile sprint to bring the best work in all of us.
It was truly an exceptional experience working with a cross-functional team to create a fully functioning web app and challenge myself in an immersive agile environment to bring my focus level on design to create a product that truly is meant for our users, the caregivers.
