Babka House
Responsive and interactive e-commerce website for a local Toronto bakery
Overview
I designed and developed a responsive e-commerce website for Babka House. I provided creative direction on the project, doing product photography for the website, and creating social media post templates. I developed the branding identity for the company together with my talented friend Oscar Patzan.
Project Type
Responsive Website
Duration
5 months
My contributions
UX/UI
Development
Branding
Interaction Design
Client
Babka House
CIBC
I spent 8 months working at CIBC as a product designer on the delivery team. I spent the majority of my co-op on a digital card management project.
Project Type
Co-op
Duration
8 Months
Platforms
Native app, Web (static + responsive)
The Problem
Babka House’s main source of business was through manual orders taken through their Facebook and Instagram pages. This was not the best use of time for the business, and lots of their time went into answering the same basic questions about their offerings.
The Opportunity
Our challenge was to create a brand identity for Babka House that would position them as a high-end, handmade local bakery. Our other task was to grow Babka House’s online presence with a website that would showcase their delicious product offering, attract potential customers, and provide essential information about their products.
The Solution
This page is still a work in progress. Please check back soon!
How did we land on Peerspace?
The Design Process
The design process consisted of 5 x 2 week sprints, each culminating with a presentation of our progress to our instructors, classmates, and industry professionals.
We started out with a broad design question:
How can we help UofT students deal with, and cope with failure?
Research: Understanding the Problem
Research Process
We conducted secondary research to better understand the impacts of failures and setbacks on students’ mental health.
We then proceeded with our primary research of current UofT students or recent grads.
12 semi-structured Interviews
52 Survey Participants
Research Analysis
We consolidated qualitative data from our interviews and surveys into an affinity diagram to visualize common themes in the data
Research Findings
Setbacks are multifaceted
UofT students experience both academic and non academic setbacks during their academic careers.
Setbacks have a significant impact on mental health
of students reported that a failure has had a significant impact on their mood and mental health.
3 Key Barriers to Help Seeking
We were able to uncover 3 key barriers UofT students encounter when help seeking:
The Importance of Personal Networks
70% of survey respondents and all interview participants rely on their personal network for supports during a setback, most notably peer support
Typically when experiencing setbacks, who do you confide in?
The value and comfort of shared experience
Students described sharing their experiences and vulnerabilities with others who are in the same boat as a highly effective way to cope with their setbacks. This helped them feel less alone and normalized their hardships, alleviating some of the stress and anxiety around their failure.
While experiencing a setback, do you ever interact with others going through the same thing?
Qualities students seek in a supporter
What students want:
Non-judgemental
Patient
Good-Listener
Patient
Empathetic
Compassionate
Supportive
Honesty
Shared Experience
What students don’t want:
Someone condescending
Arrogance
Toxic Positivity
Unsolicited advice
Defining the Problem:
When students feel disconnected and unsupported during their setback, they are unable to cope, leading to a negative impact on their mood and mental health.
How can we support students at the onset of a failure by fostering genuine connections through shared experiences and vulnerabilities?
Empathizing with Students
Meet Isabelle the International Student
To never lose sight of our users and their needs, we used our data to create the persona of Isabelle the International student.
The as-is scenario takes us through Isabelle’s journey as she performs poorly on a midterm.
Initially, we wanted to focus on the seek help stage of the process, but after further thought we realized that intervening at the onset of Isabelle's failure could result in greater impact.
So, what does Isabelle need?
Support
Isabelle needs to feel supported at the onset of a failure so that it doesn't spill over into other areas of her life
Annonymity
Isabelle needs a way to remain anonymous so that she can be her authentic self
Community
Isabelle needs to know there are others in the same boat as her so that she does not feel alone during her moments of failure
How can we help Isabelle?
Ideation and Prioritization
Each team member generated ideas that can improve Isabelle’s journey and solve her needs.
We then voted on the ideas in terms of impact and feasibility.
.jpg)
We landed on 4 “home run” ideas with the highest impact and feasibility:
Speedy Support
An immediate announcement to express need for support
Shared Experience
Reminding one another that we’re not alone in our struggle
An Anonymous Forum
Anonymous topic-based forum for student struggles
Fake Identity
Concealing real identities to encourage authentic conversations
Prototyping: From Ideas to Features
Low-Fi Prototypes
Through our chosen ideas the team was able to align on 3 features we wanted to tackle in the MVP. I was responsible for drawing the low-fi prototypes.
1. Writing a Post
Feature: Students can notify the community that they are struggling by making a post describing their struggle
2. Receiving Support
Feature: Through post engagement, students will be able to receive support and share helpful knowledge.
3. Direct Messaging
Feature: Through private messaging and phone calls, students can have direct conversations with one another while remaining anonymous.
Iterating through Evaluation
Usability Testing
The team conducted usability testing with 4 representative users.
The users were given 3 tasks to complete, each tackling a different feature of the app and were then asked follow up questions.
Med-Fi Iterations guided by data
Our evaluation findings were able to inform us of concerns that we then iterated in our med-fi prototype.
Security Concerns
Concern: Opportunities for trolls to abuse the app and prey on those who are emotionally vulnerable.
Iteration: Adding DM friction by allowing users to accept an incoming message.
Concern: Weak sense of safety as anyone could sign up for the app
Iteration: Sign up is now only through official UofT ID, to provides an added layer of security and accountability.
Difficulty in immediate vulnerability
Concern: Students are more likely to explore other posts first before sharing their own vulnerabilities.
Iteration: Reducing the prominence of the post feature to encourage browsing before posting.
New feature: Live sessions
With the security concerns that arose around anonymous 1 on 1 conversations, we needed to give users with a different way to take part in honest conversations.
Honest conversations: Reimagined
We decided to introduce a new “live sessions” feature on the app where students can listen to live audio sessions about various topics around failure and overcoming hurdles.
Med-Fi Evaluations + Next Steps
With the interactive mid-fi prototype, the team conducted summative evaluation with three representative users.
Positives:
Ease and likeliness of use
All 3 users found the prototype very easy to use and claimed that they are very likely to use the app when they encounter a failure or setback.
Sense of Safety
The various security features (UofT login credentials, voice changing, reporting) provided a sense of safety to participants.
Effectiveness
Users felt the post and live session features to be helpful and effective when experience setbacks.
Next Steps:
Clarify unique icons
Users had trouble understanding the “Boat” emoji icon, which signifies “same boat”.
Find more ways to encourage posting
2 / 3 users unlikely to write a post in the beginning, instead they will observe others’ posts and decide if the platform is effective or not.
Key Learnings
Feedback isn't always unanimous
When dealing with multiple stakeholders from different backgrounds, interests and areas of expertise, you are likely to receive conflicting feedback on your design. It's important to remember that this is normal and that all feedback is valuable.
Listen to the data
It's easy to come into a project with preconceived solutions, or to hang on to a feature or functionality that simply isn't working. The research data collected throughout the design process is immensely important - even when it's inconvenient, and should always be used to inform and defend your design decisions.
Seek input from experts
During our final playback, an industry guest gave us the feedback that we're designing an app that tackles the sensitive issue of mental health, without having talked to any mental health experts who would have extensive knowledge and expertise about our problem space. This type of app could have negative consequences on users, and taking this additional step could help prevent any unintentional harm that it may cause.