Development – GUI

For me, one of the most intimidating aspects of developing this project was designing the Graphical User Interface (GUI) for the application.

I wanted to make the interface friendly, but also keep it as simple and clean as possible. I tend to use primary colors in a lot of my work, and this project was no exception. At first, I was concerned with mimicking the ultra-slick and metallic look of most content sites like Hulu or Netflix. After a few attempts, I didn’t feel inspired, nor did I feel like I was speaking to the purpose of the project. Though the content is key, there is more to the application than the content. There is also a bit of warmth that comes with this technological project, and I realized I needed to create a balanced experience for the user with the look and feel.

Upon entering the application, the user sees a splash page that suggests they use headphones for the best experience.

The user is then brought to the “Films” Page. They choose a film and click the “Invite” button.

The user is given a unique link they can share with other people (for the proof of concept, it’s one person).

Once they share it, they then can click “Watch.”

When the other users receive the link, they can enter their name. Then, they click “Watch” to enter the “VLR.”

When their friends have entered the VLR, the user is notified. They can immediately talk to their friends.

When they are all ready to watch the film, the users all click “Play” at the same time.

When the film has ended, each user is given the choice to either watch another film, or to exit the application.

So far, I’m very happy with the way the GUI has turned out. Of course, things may be tweaked as development and testing continues. Nevertheless, I find myself continuously inspired and motivated to keep working with this visual scheme and color palette.

I’m also starting to move onto branding, and this of course includes the color scheme and even certain shapes (such as the rectangles and squares with the rounded corners). Here’s the most recent version of the logo for YourVLR.

In the next post, I’ll talk about the backend of the application and my collaboration with creative technologist Bob Gourley.