VR-UX: Building a video player prototype

Today I’m building an interactive VR video player; an integral piece to entertainment apps featuring on demand video. The most important task is understand early on what it is I’m building, how that will be perceived by the end user and its interaction.

I always start with pencil and paper to plan what I create and I love to take the time at this early stage to build a low fidelity visual to not only understand my visual goals but to help calculate where my prototype will sit within the users space and how details will be positioned with the UI for accessability, legibility and comfort.

It’s time to start thinking about the spacial aspects and working with visualising the UI and within a 3D space. Using various techniques including Augmented Reality I look at various angles, Does the UI balance? Does it sit well within a spacial scene? etc.

Happy with the UI layout and how the prototype works from a third person perspective I like to visualise from a first person perspective (as a user) to make sure I’m happy before moving on to the next stage.

Happy with the layout within 3D it’s time to start building all the elements ready for the main build. The first step is vector design (Obviously) and then I look at the coding of the elements including animations & hover states etc.

Speed and efficiency are paramount and it is important when interacting with a product that the user gets from point A to point B in the fastest way possible. I’ll achieve this with simplicity. There’s no need to waste valuable time by creating waiting time with unnecessary interactions, animations or micro interactions. It’s a good rule of thumb to understand that a user is using the app to get a specific task done.

Aims:

• Click on video > FadeInUp (UI)
• buttons hover (video array) > Scale & highlight
• progress bar > animate to video time

I’m happy with the overall prototype and everything is functioning as it should so it’s time to add some finishing touches. I add in a volume slider and the ability to allow the user to slightly curve the video as opposed to its flat original self and add in some UI sounds.