Projects

Playground

Resume

About

Contact

19:03:32

Fitting Room

Academic project, Dec 2024, individual

The Fitting Room Kiosk aims to enhance the retail experience by developing an interactive kiosk where shoppers can virtually try on clothes. Inspired by WGSN’s Synergists persona, the design was refined from initial sketches to a high-fidelity laser-cut kiosk through iterative prototyping. Merging UX research, hardware prototyping using Arduino, and digital design, this kiosk offers a seamless, sustainable fitting room experience that elevates customer satisfaction and streamlines the shopping process.

Industry Trends

My initial research into WGSN trends highlighted a rapidly growing interest in virtual fitting room technology. This sector offers solutions to retailers facing economic uncertainty, supply chain challenges, and issues with sizing inconsistencies.


Some of the leading brands like COS and Knix have integrated virtual mirrors to enhance online shopping, while platforms like MyAva and 3DLook improve sizing accuracy with digital avatars, significantly reducing return rates.


Inspired by these advancements, my fitting room kiosk adopts similar technologies to provide a personalized and interactive fitting experience, aligning with the latest industry practices to address modern retail challenges.

My initial research into WGSN trends highlighted a rapidly growing interest in virtual fitting room technology. This sector offers solutions to retailers facing economic uncertainty, supply chain challenges, and issues with sizing inconsistencies.


Some of the leading brands like COS and Knix have integrated virtual mirrors to enhance online shopping, while platforms like MyAva and 3DLook improve sizing accuracy with digital avatars, significantly reducing return rates.


Inspired by these advancements, my fitting room kiosk adopts similar technologies to provide a personalized and interactive fitting experience, aligning with the latest industry practices to address modern retail challenges.

My initial research into WGSN trends highlighted a rapidly growing interest in virtual fitting room technology. This sector offers solutions to retailers facing economic uncertainty, supply chain challenges, and issues with sizing inconsistencies.


Some of the leading brands like COS and Knix have integrated virtual mirrors to enhance online shopping, while platforms like MyAva and 3DLook improve sizing accuracy with digital avatars, significantly reducing return rates.


Inspired by these advancements, my fitting room kiosk adopts similar technologies to provide a personalized and interactive fitting experience, aligning with the latest industry practices to address modern retail challenges.

Low-Fidelity

Physical Prototype

The initial physical prototype of the fitting room kiosk was constructed using cardboard, an accessible and versatile material ideal for rapid prototyping.

Digital Prototypes

I started with a basic, low-fidelity digital model to layout the user interface and essential functionalities of the fitting room kiosk. This early version was crucial for mapping out the interaction flow and identifying key components.

While designing the high-fidelity version, mock-users experienced difficulties with the button interface. Their feedback highlighted issues with button accessibility and responsiveness, prompting a reevaluation of the user interface.

Peer Feedback

Before proceeding to formal user testing, I sought initial feedback on my high-fidelity digital prototype from peers. I posed three key questions to gauge the design's intuitivenes and inclusivity:


  1. How does the overall design appear?

  2. Should users scroll or use a potentiometer on the "Choose your body shape" page?

  3. Does placing the female figure first suggest a priority over other genders?

Before proceeding to formal user testing, I sought initial feedback on my high-fidelity digital prototype from peers. I posed three key questions to gauge the design's intuitivenes and inclusivity:


  1. How does the overall design appear?

  2. Should users scroll or use a potentiometer on the "Choose your body shape" page?

  3. Does placing the female figure first suggest a priority over other genders?

Before proceeding to formal user testing, I sought initial feedback on my high-fidelity digital prototype from peers. I posed three key questions to gauge the design's intuitivenes and inclusivity:


  1. How does the overall design appear?

  2. Should users scroll or use a potentiometer on the "Choose your body shape" page?

  3. Does placing the female figure first suggest a priority over other genders?

Responses from Peer #1


  1. "Good, I like the transitions"

  2. "Scroll"

  3. "It's fine, but add a little bit more options"

    "They are all skinny"

    "Put all genders in one scene"


Additional Feedback:

"Make the 'X' on the items list look more like a button"

Responses from Peer #2


  1. "Good"

  2. "Scroll"

    "Add arrows to indicate to users that they can scroll"

  3. "Why would you care about men? It's always female first!"


Additional Feedback:

"Make the 'X' on the items list look more like a button (as Peer #1 suggested), maybe add a circle around it"

Responses from Peer #3


  1. "Trendy; it looks like a design that could be seen on Pinterest"

  2. "If this is the only scene where users need to touch the screen, I think using the potentiometer would be better"

  3. "Gender option first"


Additional Feedback:

"The 'X' button makes sense, it's fine"

The design of the 'X' button received mixed reviews—some peers mentioned that the 'X' did not clearly resemble a button, while others found it adequate as it was.


To resolve these conflicting views and optimize the button's design, I decided to conduct preference testing. This method involves presenting users with multiple versions of the 'X' button design and collecting data on which version is preferred by users. This approach ensures that the final design will be user-friendly and visually appealing, catering to a wider audience.

Responses from Peer #1


  1. "Good, I like the transitions"

  2. "Scroll"

  3. "It's fine, but add a little bit more options"

    "They are all skinny"

    "Put all genders in one scene"


Additional Feedback:

"Make the 'X' on the items list look more like a button"

Responses from Peer #2


  1. "Good"

  2. "Scroll"

    "Add arrows to indicate to users that they can scroll"

  3. "Why would you care about men? It's always female first!"


Additional Feedback:

"Make the 'X' on the items list look more like a button (as Peer #1 suggested), maybe add a circle around it"

Responses from Peer #3


  1. "Trendy; it looks like a design that could be seen on Pinterest"

  2. "If this is the only scene where users need to touch the screen, I think using the potentiometer would be better"

  3. "Gender option first"


Additional Feedback:

"The 'X' button makes sense, it's fine"

User Testing

"How might I design a functional and intuitive item deletion button?"


To resolve the debate about the delete button raised by users, I conducted preference testing using Google Forms. Eight anonymous participants provided their feedback, allowing me to gather both qualitative insights and quantitative data. This approach helped me analyze user preferences and make more informed design decisions based on their responses.

"How might I design a functional and intuitive item deletion button?"


To resolve the debate about the delete button raised by users, I conducted preference testing using Google Forms. Eight anonymous participants provided their feedback, allowing me to gather both qualitative insights and quantitative data. This approach helped me analyze user preferences and make more informed design decisions based on their responses.

"How might I design a functional and intuitive item deletion button?"


To resolve the debate about the delete button raised by users, I conducted preference testing using Google Forms. Eight anonymous participants provided their feedback, allowing me to gather both qualitative insights and quantitative data. This approach helped me analyze user preferences and make more informed design decisions based on their responses.

Qualitative Insights

The qualitative data gathered from users revealed that the button designs were perceived as clean, intuitive, and functional. Many users appreciated the overall aesthetic and usability, highlighting these aspects as strengths of the design. However, feedback also suggested that making a slight adjustment to the button size could significantly enhance the user experience, ensuring better accessibility.

The qualitative data gathered from users revealed that the button designs were perceived as clean, intuitive, and functional. Many users appreciated the overall aesthetic and usability, highlighting these aspects as strengths of the design. However, feedback also suggested that making a slight adjustment to the button size could significantly enhance the user experience, ensuring better accessibility.

The qualitative data gathered from users revealed that the button designs were perceived as clean, intuitive, and functional. Many users appreciated the overall aesthetic and usability, highlighting these aspects as strengths of the design. However, feedback also suggested that making a slight adjustment to the button size could significantly enhance the user experience, ensuring better accessibility.

Quantitative DAta

Click on each data point to explore its details! Scroll to the right to view additional data points.

Test

Responses

These are the full questions and answers from the preference testing form. Feel free to take a look at the screen on the right!

These are the full questions and answers from the preference testing form. Feel free to take a look at the screen below!

8 responses

 

 

Summary

Question

Individual

👩‍🔬Pre-Testing Questions👩‍🔬

Have you used similar digital interfaces before?

8 responses

 

In 1-2 words, what are your first impressions of the button designs?

8 responses

Cute.

clean and straight-forward

Understandable/makes sense

Clean

Playful and clean

Simple and to the point

They were alright

Clean and simple

Do you typically prefer buttons that are large or small?

8 responses

 

👩‍🔬Post-Testing Questions👩‍🔬

Which button do you prefer?

8 responses

 

Why did you choose this version of the button?

8 responses

Somehow, my hands are going.

The button's function is already clear to understand even without the additional circle colored background or the "trash can" icon

The trash can icon is associated more with deleting if compared to the 'X'. The 'X' could also potentially mean "closing" in some other apps, so the trash can is better because there is less of a chance for the user to be confused!

Clean

I chose this button version because it feels more cohesive and visually consistent with the design theme. The rounded icons and warm color palette create a friendly and approachable aesthetic, while the clear alignment of text and icons ensures usability and readability. Additionally, the design encourages interaction with the buttons' prominent placement and intuitive functionality.

Seems better suited for the UI

It felt >right<

The trash button makes more sense since it indicates undoing or deleting an item, whereas an "x" indicates cancelling the whole order

Did you find any buttons difficult to use?

8 responses

 

How do you feel about the overall design of the buttons?

8 responses

 

Average rating (4.75)

 

 

 

 

 

Would you suggest any changes to the buttons?

6 responses

the contrast between the button and background is a bit low, maybe increasing the contrast will help make the button pop out more

I think they're okay! But I would potentially add a way to delete all or reset your choices (I'm not sure if you have a reset button in the previous pages or not) But honestly, I think they're all good already!

All good

Add hover or press effects (e.g., slight color change, shadow, or scale animation) to provide tactile feedback and make the buttons feel more interactive.

Make it bit larger, add haptic motion to it when touched

nah you good 👍✨

Thank you for your feedback!!!

Final Digital Prototype

Half of the participants favoured the second button design, which featured the trash can icon. This clear preference led to the decision to adopt this design for the final version of the digital prototype. This new trash can icon for the 'X' button aligns with the goal of enhancing user intuitiveness and it was seen as more indicative of its function, helping users easily understand and interact with the deletion feature within the kiosk interface.

Half of the participants favoured the second button design, which featured the trash can icon. This clear preference led to the decision to adopt this design for the final version of the digital prototype. This new trash can icon for the 'X' button aligns with the goal of enhancing user intuitiveness and it was seen as more indicative of its function, helping users easily understand and interact with the deletion feature within the kiosk interface.

Half of the participants favoured the second button design, which featured the trash can icon. This clear preference led to the decision to adopt this design for the final version of the digital prototype. This new trash can icon for the 'X' button aligns with the goal of enhancing user intuitiveness and it was seen as more indicative of its function, helping users easily understand and interact with the deletion feature within the kiosk interface.

Arduino Exploration

My initial plan for integrating technology into the fitting room kiosk centered around the use of OLED displays, due to their crisp visuals and flexibility. However, as the project evolved, practical needs and project scope adjustments led to a shift away from using OLED displays in the final design. Despite this, my fascination with the capabilities of Arduino did not wane!


I explored its other capabilities by programming it to display environmental data. I successfully coded the Arduino to read and show the temperature and humidity levels within my room, leveraging sensors from the Arduino starter kit. This not only provided a practical application for the technology but also added an engaging element to the project, demonstrating the potential of integrating Arduino into everyday solutions.

My initial plan for integrating technology into the fitting room kiosk centered around the use of OLED displays, due to their crisp visuals and flexibility. However, as the project evolved, practical needs and project scope adjustments led to a shift away from using OLED displays in the final design. Despite this, my fascination with the capabilities of Arduino did not wane!


I explored its other capabilities by programming it to display environmental data. I successfully coded the Arduino to read and show the temperature and humidity levels within my room, leveraging sensors from the Arduino starter kit. This not only provided a practical application for the technology but also added an engaging element to the project, demonstrating the potential of integrating Arduino into everyday solutions.

Inspired by the initial success with the school's Arduino sensor kit, I eagerly expanded my exploration by purchasing additional sensors. Among these was the seven-segment display (sev seg), which proved to be a fascinating and enjoyable addition to my experiments.


While I initially intended to incorporate the sev seg display into my kiosk to enhance its interactive capabilities, I encountered repeated technical issues due to the increased complexity of the system. Despite my efforts to integrate this feature, the frequent malfunctions led me to reluctantly abandon its inclusion to preserve the overall stability and functionality of the project.

Inspired by the initial success with the school's Arduino sensor kit, I eagerly expanded my exploration by purchasing additional sensors. Among these was the seven-segment display (sev seg), which proved to be a fascinating and enjoyable addition to my experiments.


While I initially intended to incorporate the sev seg display into my kiosk to enhance its interactive capabilities, I encountered repeated technical issues due to the increased complexity of the system. Despite my efforts to integrate this feature, the frequent malfunctions led me to reluctantly abandon its inclusion to preserve the overall stability and functionality of the project.

Arduino Exploration

My initial plan for integrating technology into the fitting room kiosk centered around the use of OLED displays, due to their crisp visuals and flexibility. However, as the project evolved, practical needs and project scope adjustments led to a shift away from using OLED displays in the final design. Despite this, my fascination with the capabilities of Arduino did not wane!


I explored its other capabilities by programming it to display environmental data. I successfully coded the Arduino to read and show the temperature and humidity levels within my room, leveraging sensors from the Arduino starter kit. This not only provided a practical application for the technology but also added an engaging element to the project, demonstrating the potential of integrating Arduino into everyday solutions.

Inspired by the initial success with the school's Arduino sensor kit, I eagerly expanded my exploration by purchasing additional sensors. Among these was the seven-segment display (sev seg), which proved to be a fascinating and enjoyable addition to my experiments.


While I initially intended to incorporate the sev seg display into my kiosk to enhance its interactive capabilities, I encountered repeated technical issues due to the increased complexity of the system. Despite my efforts to integrate this feature, the frequent malfunctions led me to reluctantly abandon its inclusion to preserve the overall stability and functionality of the project.

My initial plan for integrating technology into the fitting room kiosk centered around the use of OLED displays, due to their crisp visuals and flexibility. However, as the project evolved, practical needs and project scope adjustments led to a shift away from using OLED displays in the final design. Despite this, my fascination with the capabilities of Arduino did not wane!


I explored its other capabilities by programming it to display environmental data. I successfully coded the Arduino to read and show the temperature and humidity levels within my room, leveraging sensors from the Arduino starter kit. This not only provided a practical application for the technology but also added an engaging element to the project, demonstrating the potential of integrating Arduino into everyday solutions.

Connecting

Arduino & Protopie

Connecting Arduino & Protopie

To bridge the gap between the physical components of the kiosk and its digital interface, I utilized ProtoPie Connect to link the Arduino hardware with the ProtoPie software.


To ensure the successful integration of the Arduino, I used potentiometer as a diagnostic tool. This allowed me to monitor and log the system's responses in real-time, providing a direct method to assess the effectiveness of the connections.

To bridge the gap between the physical components of the kiosk and its digital interface, I utilized ProtoPie Connect to link the Arduino hardware with the ProtoPie software.


To ensure the successful integration of the Arduino, I used potentiometer as a diagnostic tool. This allowed me to monitor and log the system's responses in real-time, providing a direct method to assess the effectiveness of the connections.

I programmed the Arduino to respond to button presses by activating the buzzer and chaning LED states, enhancing the tactile feedback for users. For instance, pressing the start button would trigger a specific sequence of LED flashes and a corresponding buzzer tone, indicating that the kiosk had initiated a process.


I also incorporated a potentiometer, allowing for real-time adjustments. The Arduino read the potentiometer's value, and based on the changes, adjusted the kiosk's digital display accordingly. This interaction was vital for creating a dynamic and responsive user interface.


Serial communication also played an important role in this setup, enabling seamless interaction between the Arduino and the kiosk's digital interface via ProtoPie. This allowed control based on user interactions collected by the Arduino. Commands from ProtoPie were also received by the Arduino to activate or deactivate LEDs, making the user experience fluid and integrated.

Arduino Wiring Diagram

I used three buttons, three LEDs with 220-ohm resistors, a B10K potentiometer, and a piezo buzzer. Although this diagram includes a 7-segment display on the far right, I thought it was unnecessary and chose not to use it in the final implementation.

Arduino Code

Physical Prototypes

Mid & high-fidelity physical prototypes

Final Design

©2024 Sejeong Seo.

Menu

Home

Home

Home

Projects

Projects

Projects

Playground

Playground

Playground

Resume

Resume

Resume

About

About

About

Contact

LinkedIn

LinkedIn

LinkedIn

Instagram

Instagram

Instagram

Spline

Spline

Spline

E-mail

E-mail

E-mail

Phone

Phone

Phone

I'm fascinated by Darwin's theory of evolution and curious about what humans will look like tens of thousands of years from now. When I was younger, the Earth had a population of around 6 billion, but now it keeps increasing, which worries me a bit. I wonder when humans will go extinct, and I'd like to hear in detail about the extinction process. I'm also curious about what Earth's ecosystem would be like without humans. If humans haven't gone extinct, I want to know what the new evolutionary processes might be, especially how human evolution might interact with the climate changes we are experiencing today.


If you want to discuss this further or have possible answers, please contact me via email.