ScreenPal: Screen Recorder & Video Editor — Light Mode

WIndows + Mac Desktop Client APPLICATION UI/UX DESIGN

In 2009, The Skins Factory was contracted by our client Screencast-O-Matic to redesign their flagship screen recorder application.

Now, 13 years later, The Skins Factory has once again been tasked to redesign & modernized their flagship Windows & Mac desktop client application, a robust, best-in-class screen recorder & video editor used by some of the world’s biggest brands. Feature-rich, intuitive and powerful, users can record video via their screen, webcam or both. This project was done in two versions - default and light mode plus a dark mode version that showed our original intent.

Screen Recorder UI/UX Design by The Skins Factory

Project Manager

The workflow of the screen recording application is powered by the Project Manager dashboard. Users can manage and store their videos and images here. To speed up the workflow, projects are categorized by date and can utilize a powerful filter mechanism.

Below: Preview Window

Editor Base + Menus

This is where the majority of the application's magic happens. You can edit your screen recording or video using a broad variety of tools right from this screen.

Custom Menus & Icon Creation

The Screen Recording Editor's menus and unique icons were completely redone by the design team. The icon system was made to be clear and simple, with each icon having a corresponding visual "weight" that ensures uniformity throughout all tool menus.

Editor Base Tool Menus L to R: Hide, Insert, and Overlay

Editor Base Tool Menus L to R: Replace, Sound, and Speed

Editor Menu: Text

Editor Menu: Modify Style

Screen Recorder

With the screen recorder, you can record any region of your desktop screen as well as audio from your microphone and video from your webcam. In order to give the floating recorder toolbar some depth and a tactility you rarely see nowadays, we designed a neumorphic REC button.

before you start recording

Recorder: Screen

Recorder: Camera

Recorder: Both

after you start recording

Recording in Progress

Post Recording

Drawing Tools

Timeline Magnify Slider + Playback Speed + Caption Menus

We designed the user interface to be incredibly crisp, clean, and intuitive, getting out of the user's way so they can focus on what's most important—creating and editing. This includes the ability to magnify the timeline for more precise editing, adjust the playback speeds when necessary, or simply add captions to the recording.

Playback Speed

Captions Menu

Music Menus + Importing Audio

Users have the option of importing their own music or choosing from more than 3400 stock audio files that are a part of their Premier subscription. You can sample audio tracks right in the list, which is one of the Music Menu's best features.

Music Menu: Empty

Music Menu: Hover

Music Menu: Playing Audio

Narration Tools

Narration plays a crucial role in bringing your movies to life when making custom videos from your screen recordings or videos, or speaking directly to the spectator in instructional videos.