Cinematics For Online Products
This project aims to explore a new form of online product interaction, which simulates people’s real-life behaviours through interactive movies. Compared to still images, these movies can enhance the communication of product properties and significantly increase online engagement.
It started with an observation in physical stores...
In order to digitally recreate people's real-life behaviours, we need to study them first. Observations were conducted in various shops to help us understand how people interact with products in real world. As a result, sketches were made and clustered to provide the basis for prototyping.
One is pressing a cushion in store.
Clustered sketches about people's gestures in stores.
And then, products are selected for prototyping...
Products were selected based on the observation, and the selection should cover most interesting categories in the sketches. After an iteration process, final movies were made and presented on this website.
Products were selected based on observation. A studio was set up for the filming, including DSLRs, studio lights, tripods, etc.
These are the tools used in the filming process.
Filming example: iron wires were used to film the cushion being squeezed, and was later removed in After Effects.
Most movies were prgrammed using p5.js. For the pressing cushion movie, pressure.js library was incorporated to detect pressure on 3D Touch/Force Touch devices. It's supposed to support iPhone 6S or later, and new TrackPad on Macbooks. On other devices, it measures the time of pressing instead.
Naturally, we need to find out if the movies are actually better...through an experiment.
We conducted an experiment with 20 participants in total. They were evenly divided into two groups: the movie group played the movies first and then examined the actual products, while the image group first saw still images instead. We measured four variables for each product: perceived information completeness, confidence on judgements, level of no-frustration, and level of matching expectations.
Results indicate that these interactive movies marginally enhance the product communication, while significantly increase engagement. In other words, they are very novel, fun, and interesting to play, but might need further improvement to communicate products better.
In the experiment, movies were played and compared with the actual products.
Advantages on these four measures are marginal. The overall difference might be more significant with further improvements.
However, significant difference was found in the drawer (perceived information completeness: t(18)=2.648, p=.016; level of no-frustration: t(18)=3.264, p=.004), the fabric (level of no-frustration: t(18)=2.047, p=.056), and the pen (perceived information completeness: t(18)=3.171, p=.005; confidence on judgements: t(18)=3.353, p=.004; level of no-frustration: t(18)=2.751, p=.013).
The movies scored more positive on nearly all aspects. And significant difference was found in Hedonic Qualities (identification: F(7,12)=5.08, p=.007; stimulation: F(7,12)=18.21, p=.000), and Attractivity (F(7,12)=3.07, p=.042).
During the experiment, we also saw that people had richer facial expressions when playing the movies. They liked to spend more time on the movies, and talked more on many products.
Conclusion: Overall, the interactive movies in this experiment are more like ‘in-between things’ between still images and actual touch. It significantly increases online engagement, while with further improvements it could help more to communicate products.
This is a master graduation project by Howe Xie, coached by Maarten Wijntjes and Gert Pasman in TU Delft. Request a full report? Contact us!
Howe Xie: xiehowe@gmail.com
Maarten Wijntjes: M.W.A.Wijntjes@tudelft.nl
Gert Pasman: G.J.Pasman@tudelft.nl
