Mar 15, 2021
Gaining Insights and Collaborating to Enrich a Virtual Event Experience
Process behind making interactive live stream for Indonesia’s first and largest virtual fashion event
At the end of June last year, Samara LIVE (known for Ideafest) was kicking off their plan to hold a virtual fashion event and reached me to help them on the interactive live stream. I was tasked to develop the idea and make it happen in 1.5 months. It was going to be the first fashion event after the pandemic hits and forbid such important event to the fashion industry to be held offline.
Samara wanted something different than just a livestreaming of fashion show. They invited many talented names from multiple disciplines like Jay Subiakto (director) and Anton Wirjono (music producer) to execute the video production. They were going to make it a big moment of collaboration to promote “bangga buatan Indonesia” (proud of Indonesia-made product) on the nation’s independence day (August 17).
Challenges
Rather than to only design, as the person in charged for the website and interactive live stream I was also responsible to figure out how things work and what’s possible according to the timeline. Later I would also give direction to the tech and video production team to execute.
The initial idea Samara had for the main show was to provide invited guests with multi-angle views and personalized flower appreciations on the website. The show would be available for public at the same time, so they wanted the invited guests to have more advantages that differentiate their experience.
To develop the interactive live stream, Samara invited TADOtv — a tech startup that makes interactive (choose-your-own-adventure) video platform for promotional campaigns. It sounds great. The thing was, the team had never applied the interactive layer on a live stream before. They usually do it on a series of pre-recorded clips that have a fixed timeline. The event’s live stream would also be hosted on Vidio.com as the event partner (not TADOtv’s platform), which made the technical stuffs more complicated.
Gaining Insights
At the very beginning, I talked to three people that I think represent various backgrounds of fashion event audiences. I needed to know what experience they like from an offline event and what they expect from a virtual one.
Evan — works with people in the fashion industry
Evan has done some graphic design work in past years for a fashion brand and often been invited to their show.
To be invited to a fashion event is something that felt really exclusive for him. “You’re invited because you’re part of the industry. You can feel close to designers, their works, and people in the community.” He thinks invited guests have the chance to be the first to see a collection that has never been released to public.
Fiona — has interest in fashion
From her social media, it’s easy to spot Fiona’s interest in fashion. She follows updates from local designers and some of them participated on the event.
For her, attending a fashion show gives her a chance to see details of the collection in real life which can’t be seen from the catalogue. Besides, she also likes to see a lot of stylish people under the same roof. She expects a virtual fashion show would feature a behind the scene coverage and chance to see the collection details in HD and better view of the show.
Scarlett — a fashion graduate and works as a stylist
Scarlett graduated from a fashion school and now works as freelance fashion stylist.
She sees fashion event as a moment to build connection and to see new collections for future references, so anytime a project needs a kind of style she can name a designer. She would watch a virtual fashion show only if she’s really interested with the new collection or it’s her favorite designers’. She thought a normal livestreaming of a fashion show won’t be able to replace the experience of attending one where she can see the details of the collection.
Discussing with Other Teams
Because it was a huge team effort, we shared how each of us would do things and discussed possibilities to make sure we deliver the best experience.
Video Production Team
The production team would make 2 minutes video for each designer that fits the collection’s concept from the setting, camera movement, and video editing. It would be more interesting but very different from what Samara expected. Since it would be more like a music video rather than a catwalk documentation, the initial idea to have multi-angle views was no longer relevant. I had to find a replacement based on this new concept.
Livestreaming Platform / Vidio.com
We reached Vidio team to ask if we could modify their video player — to show interactive options and play another video — or get the live stream source URL (to play it on TADOtv interactive player). Turned out both required big changes which they didn’t think could be done in 1.5 months. Later we continued to work closely to find way for the website and video player to communicate using postMessage to do actions like mute/unmute, disable fullscreen, and the video pause function. For the website to have more control on video player would be useful to develop new idea later.
Show Operators
In few meetings, show operators and I discussed about the show’s rundown and broke down each segment to talk about every little things. These are the people who would be on the front-of-house/control room while the live show was running. They gave direction to the show host, kept the rundown on schedule, and also controlled what the audience see on Vidio player.
The designer collection videos will be divided into few segments separated by live interview sessions. They scheduled each interview to be 3 minutes-long but it could take longer than that. Meanwhile, interactive videos (maybe you’re familiar with Netflix’s Black Mirror: Bandersnatch) are very dependent to time/duration, the video player is programmed to show pre-defined options at certain time, for example “show options A and B @ 19:45”. This won’t be simple for a dynamic schedule, so the tech team and I had to figure out how to handle the worst case.
Developing The Experience
“Exclusive” Experience
The first thing I did was looking for an alternative to replace the multi-angle views. The experience was meant to give invited guests another view of the show that others don’t have the privilege to see. An “exclusivity” — something that our insights agree is very important for the invited guests to have. So what I need to figure out was in what other form could an exclusivity be.
When talking about experience of watching, the most common topic is movie. Movies used to be something people see when it’s on the cinema. If you’re a big fan of a title, you might want to buy it to watch it again later. The studio that made the movie knows you’re valuable to them, so when the copy is released they usually reward you with something exclusive that others who only watch it in cinema don’t see, like directors cut and deleted scenes.
I looked back at the insights to find out what the show should offer. One of the privileges said was to have a more detail view of the collections. So I propose the production team to make shorter clips for each collection which focus on showing the details. These clips would be accessible for invited guests who wants to see the details. People on the board liked the idea and believed it was the closest thing we could get to the previous one. Later we named the experience as “exclusive cut”.
Technical Tricks
Combining Vidio’s live stream player and TADOtv interactive technology wasn’t simple because normally it’s supposed to come as a package (like a TV and its remote control). We needed to figure out how to blend both individual layers as one interactive live stream, or at least make it looks like so.
The output we looked for was to have smooth switch between video that will happen quite often during the show. We considered a smooth switch as a process of changing to another video that doesn’t cause a blink on the video player and happens in a snap.
We decided to place our own video player on top of Vidio’s and “command” the live stream to mute whenever we play the experience clip. The audience would see a smooth switch while actually the live stream was still running (hidden) in the background on mute. After the experience clip is over, we hide our own video player and command Vidio’s to unmute. Audience would be brought back to the live stream without having any delay.
Scheduling
TADOtv team first came up with wireframes similar to what they have on their platform. The interactive option appears at a defined time for few seconds before it vanishes or automatically choose a default. This choose-your-own-adventure-like interactive option usually appears near the end of every video so the selected option will be played afterward.
This kind of timing fits the flower appreciation experience in conventional fashion show. Samara team also thought this would keep the guests so they wouldn’t just give and leave. We could add a bumper (brief interval filled with motion graphic or ads) between shows so those who choose an interactive experience wouldn’t miss the next show. Meanwhile, others who didn’t choose any would see a bumper with the same duration.
However, the show operators who have years of experience in TV disagreed with this idea. They thought too many bumpers would annoy the majority of audiences who couldn’t have the experience. Execution wise, it’s also hard to make sure the experience video plays perfectly during bumper since both have different streaming latency. Live video stream use a complex method that cause up to 40 seconds delay from the source (depends on the audience’s connection) while the interactive layer use a simpler method which would be way faster. Meaning if we push an interactive option rightaway, the audience could see it in seconds while the live stream they see could still be from 40 seconds ago.
Considering these, the tech team and I decided to make a single ‘VVIP experience’ button that appears along each segment (consisting up to 3 pre-recorded videos). When invited guests click it, it would expand to show what the exclusive experiences are. After they choose the experience, it will show names of designer whose collection is on the current segment. The experience video of selected designer will be played directly. Invited guest would be able to skip it and get back to the main show anytime while the others wouldn’t be annoyed by bumpers.
To handle the dynamic schedule, few of our team would join the show operators during the live stream to send updates to all video players when there’s a sudden change on the rundown. So when an interview took longer than expected, we would delay the next ‘VVIP experiece’ button.
Designing The Interface
After we’re done with the experience and technical stuffs, I continued to design the interactive live stream interface. The interface was designed based on the events’ visual identity created by Far Out Studio. The identity plays around combining two different typefaces on the typography, variety usage of lines and contemporary colors.
Because these buttons will appear on top of video, I wanted it to be very simple and less distracting. I made them all in semi-transparent dark background so the text could still be clear while not entirely blocking the video behind. There is also a compact version for buttons that would appear for a long time, like “VVIP Experience” and “Back to Gala”. Such button will have icon and text label for the first few seconds before turning into its compact version with icon only. This will let the audience know the button function in the first place but they don’t have to “see” it through the show. We also expected the flower appreciation to be screen-captured and shared to the social media, so we need to make the screen “clean” while also keep it clear for the audience that they’re always able to return to the main show.
Audiences’ Response
We successfully delivered hundreds of flower appreciations and exclusive clips to the invited guests. We even managed to direct the show hosts to say thanks to high-profile names who recently gave a flower appreciation which makes the experience more personal and exclusive. The good responses could also be seen on social media. Many invited guests shared screen captures of their VVIP experience on both flower appreciation and exclusive clip.
It was a great journey and many things learned during the process. The interactive live stream is just one of many aspects of the event that I worked on. I’m proud of what the team could achieved in just 1.5 months, so I’d also like to use this opportunity to thank the team I worked closely with:
Project Credits
Samara LIVE: Ben Soebiakto, Desy Bachir, Cindy Anggraeny, Syifa Mutiara Putri, Evan Wijaya (Far Out Studio)
TADOtv: Gema Megantara, Steven Koesno, Hermanet Lay, Victor Junaidy, Nesya Agata, Gilang Al Faritsy
Vidio.com: Hadikusuma Wahab, Latifah Helmy, Bobby, Dennis
Video production: Taba & Team
