UX/UI     Interaction     About


Body Wonders

CONCEPT / VISUAL DESIGN / UX

Body Wonders is a playful experience to let people feel the potential of haptic feedback in smart clothing. What kind of messages, feelings and emotions can we evoke through touch?





Overview


The platform for future thinking Baltan Laboratories joined forces with Holst Centre to create an experience which lets visitors of Dutch Design Week experience haptic feedback in smart clothing in a novel and inspiring way.
They approached me and design engineer Adriaan de Man to design an experience where people can interact with each other by sending vibrations through an interface and a smart vest. 


My role


I was the sole UX designer on the team. I focused on secondary and user research to develop the experience concept, working in close collaboration with Adriaan, the engineer in the team. Additionally, I developed the user experience, visual design, spatial elements and oversaw the production of the experience.


Challenge


Working alongside Adriaan, our main objective was figuring out what was possible with the technology and how to best make use of it to design a unique yet  accessible experience for a wide range of users (visitors of Dutch Design Week). Another challenge was the subjective experience of the vibrotactile sensations which required a lot of tests to design something pleasant for everyone.


User research


We started off with secondary research into haptics and tinkering with tiny motors to understand the design space of the technology. We then used our own bodies for research, working in a constant back-and-forth between technological development and reflections on what we experience.
Although there is no global objective measure of enjoyability, we made a plan to measure the subjective experience of people in a systematic way through recording their reactions to vibrations on different places on the body to find out what felt good, bland or annoying. We recruited participants for the research who matched the broad target group - visitors of DDW (from young to older adults). 


CLIENT
Baltan Laboratories &
Holst Centre

ROLE
Concept
UX/UI Design

TEAM
Adriaan de Man
Pauline van Dongen
Lorenzo Gerbi

DATE
2020 - 2021





Findings


The user tests helped us define where on the body vibrotactile stimuli could result in pleasant sensations. For example, vibrations in the armpit and lower belly area were generally unpleasant, while right above the shoulder blades and lower back were perceived as pleasant. Other factors also affected the pleasurability of experience, such as vibration composition and intensity. Most users found that repetitive vibrations quickly become highly annoying, whereas unpredictability and variation were engaging. 


Ideation & Prototyping


Following up on the finding that users enjoyed experiencing variation and unpredictability, and that the personal experience is inherently subjective, we developed a concept for a game-like experience. The participants need to collaborate in order to complete a series of tasks, and one of them is using an interface to send vibrations to the vest of the other.










I started the design stage by sketching out ideas for layouts. The low-fidelity wireframes were a quick and efficient method for developing visual hierarchy and planning out key screens required for a user to guide the participant wearing the vest .




Usability study


Next, we carried out three on-site moderated usability studies with two people in each group, including younger and older adults. The goal was to determine how easy it is for users to navigate through the interface and complete the tasks, and how delighted users are with the experience.

We decided to measure:
  • success rate of completing the tests,
  • the time a test requires,
  • the error rate, and
  • users' subjective feelings and enjoyment





Insights:
  • All participants reported feeling pleasantly surprised from the novelty of the experience
  • Users need more explanation about how the interface works
  • The meaning of some texts and function of buttons are unclear


Iteration


Based on the insight that users needed explanation for the instructions, I created a short onboarding flow at the start of the experience. I also added supporting text and icons to make meaning and function explicitly clear. To further improve the visual hierarchy of the layout, I used contrasting backgrounds to enhance the proximity of elements on the left and right sides of the screen.







Accessibility 


To account for accessibility, I took the following steps:

  1. Going for a color palette that consisted of a strong green (active buttons), a bright blue for secondary buttons and a dark blue-gray for the background to ensure contrast ratio of at least 4.5:1 following WCAG.
  2. Keeping a clean and concise layout, by keeping the onscreen info to a minimum (to not overwhelm users who are sensitive to a large flow of information)
  3. Simplifying the directions on the navigation screen but also enlarge the most important instructions
  4. Target size for all buttons at minimum 44 by 44 pt 


Revised prototype


After adjusting the wireframes, I used them to build a second iteration of the prototype that can then be used for additional evaluations.

 
 

Results 


The positive feedback we got from the usability study proved that we managed to create an enjoyable experience, and we also got interesting suggestions for further development. Due to the unfolding pandemic, Dutch Design Week happened only virtually and we were not able to test the experience with a wide audience. However, the project gained media interest and the experience got briefly tested live during a VPRO show on culture and design. It was also included in the client’s virtual presentation at CES’21 - the world’s largest tech fair.


Reflections


  • Following accessibility guidelines improved usability, and overall visual appearance alike. 
  • UX writing is an important aspect of the UX design and we underestimated its impact in this project. 
  • The project would have benefitted from another iteration round to implement valuable feedback. For example, a next step would be to add a feature to adjust the global intensity of vibrations as we discovered that older people tend to have decreased sensitivity. 




Next project ︎︎︎     Back to home 





® 2022 Mila Chorbadzhieva