ilos - Windows Recorder

During the Fall of 2016, the development team had been re-writing the code for the Windows recorder (It had previously been written in Javascript). It was an opportunity to redesign the UX/UI of the recorder.

Here's a product video of the new Windows Recorder.

Problem

We wanted to keep the essential actions at the front while having access to other features like webcam, timer, and redirect via settings button. Having a functional UX with a clean UI was key to this project especially since the ilos recorder had to maintain a small screen footprint.

Old Recorder.png

Old Windows Recorder

The old recorder felt very clunky and disconnected from the brand. Although it was functional and the base structure was there, the UI needed to change.

Approach

Structure

We wanted to refine the UI while maintaining a structure that was consistent during every stage of recording a video.

Structure Clear.png

Iterations

Aside from designing custom Microphone, Fullscreen, and Trash Icons, a big obstacle was the close and minimize button

Aside from designing custom Microphone, Fullscreen, and Trash Icons, a big obstacle was the close and minimize button

Record Button

Another idea we tried was having a larger record button. We decided against this because it felt too large on the recorder.

Result

With a mix of custom icons and work around the space of the buttons, we launched the new windows recorder in January of 2017. It's currently live if you are on Windows.