Project

Vodiac


About

Released: June 2021
Platforms: iOS and Android

Vodiac was a 360 video streaming app, for iOS and Android. It allowed viewers to experience approximately 100 videos, across 7 different channels, on their smartphone.

Channels

  • Adrenaline
  • Documentaries
  • Explore
  • Family
  • Relaxation
  • Thrills
  • Wonders

Using the Google Cardboard Unity plugin, users could view the videos on their phone in their hands, or place it into a VR headset and step into the action to climb Mt. Everest, race around a ralley course, dive with sharks, or go on safari. Vodiac allowed people to really experience a host of activities that they wouldn't be able to otherwise.



Development

I worked as the solo front end developer on Vodiac, using the app design from a contractor and working with the back-end web developer for any back-end API communication between app and server. I was solely responsible for building and testing on both platforms (iOS and Android), as well as store mananagement of the apps (app descriptions, screenshots, etc)

Vodiac went through many iterations over its lifetime. The initial launch had user accounts and IAP's to subscribe to the service - this used the subscription features provided by the two app stores. Not long after launch this monetisation method was changed to a rental model. Users could rent for 3 days or 7 days. During this change it was decided to 'reward' anyone who had already subscribed by giving them access to all the content, for free, for 12 months.

Vodiac was featured on QVC quite a few times. The feedback from QVC and their customers resulted in changing the app to allow access to all the content completely free and the removal of the account system. A QR code was used to unlock the content.



Content Curation and Creation

From the start of development on Vodiac I had input on the content being selected for launch. This input, initially, consisted of reviewing content a co-worked had sourced.

Due to restructuring during development I took on the responsibility to source new content, check we received the correct videos and make any nenecessary conversions to meet our streaming requirements - this mostly meant ensuring the resolution was at our maximum, and exported with the correct codec for the webdev's batch processing with ffmpeg to create various versions of each video in different bit rates, so that a user would be delivered a lower quality video rather than encounter buffering.

Two years after release I started creating content - using Unity to animate and render 360 videos. More information here.


Virtual Reality


Google Cardboard

The Google Cardboard XR Plugin for Unity was used to add virtual reality to the project. This plugin provides cross-platform smartphone VR, with functionality to easily start and stop the VR - allowing for Vodiac to have a non-VR menu and non-VR option for viewing the 360 videos.



VR UX

As the only thing available for interaction in VR is headmovement, it was important to get the UX right. We wanted people to be spending most of their time using the app to be in VR. The main concern was 'What's the best way to click a button?'. For buttons that don't affect the menu display (play vide, exit, reset view, etc) the answer was a simple fuse style button - keep your gaze on the UI element for x seconds to click.

The show video buttons required something extra. With the grid view of the video buttons, looking around would cause a fuse to happen and select a video - or require the user to move their head off the thumbnail, which would either end up on another thumbnail or take some concentration to aim in the space between thumbnails.
The solution was to add a hidden button, that when the users gaze hits the thumbnail, shows up. This hidden button has the fuse on.

Changes made from user feedback added a subtle noise plays when the dot enters an interactable object and increased the length of time for the fuse before click.



Media Controls

So that the user knows where they are looking, when interacting with UI, there is a little dot present in the center. It became apparent during early development that this dot, while useful, was a distraction whilst watching a video. Additionally the mdia controls needed to be hidden away, so that they could be brought up when the user wanted and not accidentally.

The interaction dot is only visible when it's directly over any UI. The media controls require the user to look down, then back to a button with a fuse to display the actual controls. This two-step process was required for instances where a user would look down to watch something in a video, and not to bring up the controls.

A timer automatically hides the media controls when the users gaze has been off them for a set amount of time.



Onboardng

The first time a user launches into VR, they are presented with an onboarding tutorial, which guides them through interacting with the menu and how to call up the media controls.

This is only displayed once. The user can re-enable the onboarding again in the settings, should they want a reminder.



Media