Foreword by Olivier: This wonderful piece was written by Ebony Omodara. I learned a lot from reading it, including about the importance of wireframes.
Project Overview
The Project
This design is part of a larger group study, aimed at exploring how innovative technology can create enchanting every-day experiences by improving emotional connectedness between people. We created a lounging hoodie that had a built voice sending and receiving and sharing hugs through heat.
Alone, I designed the application in 2 days (lo-fi in 1 day and hi-fi in 1 day). Babette Scheepers was the co-researcher for this project.
The Product
My team and I created The Lobit, which is a lounge hoodie with technology to foster connectedness between 2 people. To better understand the functionalities of the product this app aims to configure, please view the full case study.
The Goal
Create an app interface that allows for easy and straightforward configuration of the hoodie if it were to be produced.
Responsibilities
- Conducted a literature review to understand enchantment and social presence in technology
- Designed and created the hoodie with my team (see case study)
- Created user personas
- Create user flow diagrams in Miro
- Create app maps in Miro
- Conducted User research (with Babette Scheepers)
- Create low-mid and high-fidelity prototypes in Figma
The Product & The User
The app needs to…
- Walk users through configuration
- Have steps easy to understand for all users
- Have an intuitive interface
User Personas
This is one of the user personas we used to create the hoodie. I adapted this persona to represent the user once they’ve purchased the hoodie, and the specific characteristics relevant to configuration.
John (27, M)
John is a dedicated PhD student who thrives in collaborative study environments and enjoys leveraging technology in his daily life. He is in a long-distance relationship with his partner, who is also pursuing a PhD. While he has no experience with wearable technology, he possesses strong technical skills and is quick to learn. John ordered the Lobit online to his partner’s home and his own. He bought this in hopes that they would connect more off their phones.
Goals:
- Have deeper communication with partner on a regular basis
- Be able to study with his partner
- Feel the presence of his partner
- Reduce Screen-time
Challenges:
- Forgets to check phone for contact when busy
- Sometimes gets distracted during video calls
- Balancing long distance communication while being on top of responsibilities
Needs:
- Simple set-up that allows him and his partner to use the product right away
- Set-up that allows his partner to connect with his hoodie
- Be notified to wear the hoodie when his partner’s hoodie is on
Problem Statement
“I need assistance setting up the hoodie to connect with my partner’s hoodie so that we can connect and communicate with each other immediately.“
User Journey Map
| Stage | Actions | Outcomes/Interactions |
| Unboxing the Hoodie | – Receives Lobit hoodie – Opens package – Finds hoodie, manual, setup guide | – Excitement about trying out new technology – Potential difficulty knowing to download which app |
| Messaging His Partner | – Sends message asking if partner received hoodie – Expresses excitement about trying the technology together | – Confirmation of partner’s readiness to set up the hoodie – Shared anticipation for using the hoodie together |
| Setting Up His Hoodie | – Reads setup guide – Downloads Lobit app – Turns on hoodie – Puts on hoodie – Follows app instructions for pairing | – Progress through setup steps – Encounter difficulties – Potential need for assistance or troubleshooting – Completion of pairing process, ready for testing |
| Ensuring His Partner is Doing the Same | – Communicates with partner about setup progress – Offers assistance if needed | – Missing confirmation of partner’s progress – Mutual support and troubleshooting – Shared experience of overcoming challenges |
| Completing Setup and Testing | – Sends signal to partner’s hoodie – Verifies signal reception – Confirms successful connection | – Testing functionality – Verification of successful pairing – Satisfaction with setup process |
| Using the Hoodie | – Regularly wears Lobit hoodie – Enjoys enhanced communication features – Utilizes notifications for partner’s presence | – Improved communication and connection – Reduced screen time – Potential confusion of the successful communication between hoodies – Integration of technology into daily life |
Information Architecture
User Flow
Simplified user flow once both users have downloaded the app.
The App Map
Simplified app structure to accommodate for the likely method of configuration of the hoodie.
The Design
Design Considerations
The design considerations for this project prioritized a minimalist and modern aesthetic to enhance the simplicity of configuration. It was crucial for the design to align with WCAG guidelines, ensuring accessibility for a diverse target audience with varying ages and digital literacy levels.
As the goals of this project was to minimize phone usage, the app was designed to have minimal functionalities.
Digital Wireframes
Lo-Fidelity Prototype
Usability Studies
My teammate and I conducted a proctored usability study using the low-fidelity prototype of both the app and the hoodie. In regards to the app, we wanted to find out:
- Are users successfully able to configure their own hoodies?
- Are users successfully able to see configure the hoodie of a partner?
- How do users experience the Intuitiveness as the app?
We found that users are….
- Able to configure the hoodies intuitively with no guidance
- Thought that the functionalities were enough
“Its clear what we need to do – its very easy to set up!”
Improvement Opportunities
Through user feedback, I found that users want:
- To make it clear that you can only have one partner instead of multiple connections
- Able to better see if the partner is wearing the hoodie
- Notifications that their partner is wearing the hoodie
Refining the Design
Implementing Feedback
First, I implemented the improvement opportunities from the improvement points of the usability study of the app alone.
I then refined the app structure based on user feedback on the intuitiveness the hoodie itself.
Then, I continued to iterate the design keeping the following goals in mind:
- Inclusion of necessary photos to depict the process effectively.
- Ensured app alignment with predefined goals throughout the design process.
- Ensured app functionality aligned with the final hoodie’s features, which were developed concurrently.
- Implemented design conventions and standards for consistency and usability.
- Emphasized simplicity, cleanliness, and aesthetic appeal to enhance user experience.
High-Fidelity Wire-frames
Since the digital wire-frames, I made changes to better reflect the requirements of the user flow as defined by our project. Unfortunetly, this app had to be finished before the hoodie was complete. Thus, images were supplemented with iconography. Overall, I improved the lo-fi prototype through:
- Implementation of relevant iconography
- Updated use of colour for higher contrast and simplicity
- Improved clarity of instructions by implementing brevity (i.e., “Add connection →Connect”)
- Aided instructions with icons
- Organized detailed information about the product in a list for more information
- Improved the distinction between one’s own and partner’s hoodie (i.e., ”Name” → “Hi, Name”)
- Included links to detailed explanations within each configuration step
- Used colours and icons to make the detection of the hoodie clear
Overall, the high-fidelity frames were designed to reflect simplicity and intuitive design.
Hi-Fi Prototype V1
Testing the Design
Testing the Prototype
Testing the Prototype
I individually conducted user testing the final prototype to ensure that the final prototype was a satisfactory representation of the product goals (Mage = 22, Average tech literacy = advanced, mixed use of wearable technology).
I asked questions like, ‘On a scale of 1 to 5, how easy was it to configure your own hoodie using the app?’ and ‘What challenges did you encounter while using the app?’ Finally, I gathered participants’ suggestions for improving the app’s usability and thanked them for their valuable feedback.
Through this, I found that users….
- All found the configuration of one’s own hoodie and their partners hoodie straightforward and intuitive.
- Are able to configure their own hoodie without guidance
- Are able to configure a partner’s hoodie without guidance
- Are able to learn more about the hoodie without guidance
“No challenges, it looks good. Its [configuration] is clear because there are seperate pages between your own hoodie and your partner’s..”
However, users also …
- Experienced few second pauses between steps to figure out what to do next
- Wanted guidance prior to setting up the hoodie
“My grandma would not be able to figure this out on her own.”
Improvement Opportunities
Include on-boarding screens describing the steps that need to be taken and why
Enhancement of the Hi-Fi Prototype
Hi-fi V2 with Iterations based on the user research.
I added 6 additional screens that could provide a smooth on-boarding experience that would show the users step-by-step what needed to be done before doing it.
Onboarding Prototype
Further research is needed to validate the goal of this addition.
Reflection
I enjoyed working on this project and creating a potential configuration component for novel wearable technology. My team and I are satisfied with what I was able to draft even without the technical feasibility of configuration.
While crafting the app, I was able to play around with the use of iconography in guiding users to using a real-life product, without images of the actual project.
Furthermore, more research with diverse in age and technical literacy to validate the global usability of this application if the hoodie functionalities support true distanced communication.
Thank you for exploring my portfolio. I’m always open to connect for a chat!
Connect with me on LinkedIn – Ebony Omodara.
Leave a Reply