Squarebox
Squarebox is a software development company building innovative tools for digital asset management. Their flagship product, CatDV, is a media asset management system that consists of a suite of products with desktop, server, and web-based solutions.
Back in 2014, Squarebox wanted to totally revamp the user experience for v2.0 of their web client.
Support for different screen sizes was an important aspect of the redesign. We needed to optimise the design for both traditional users on desktop with a mouse in hand, and those using touch-enabled devices. This meant all UI components had to be designed with minimum touch area, and we had to redevelop the panel layout to be flexible and responsive to different screen sizes.
The web client’s primary goal is to help catalog, browse, and manage media assets. But it still has some advanced features in common with its sibling desktop client; specifically the timeline/sequence editor with it’s zoomable and draggable interface, which proved to be quite a challenge to redesign for touch devices.
A defining feature of the web client is the ability to customise and personalise the interface to suit the specific requirements of the customer. This was achieved using Bootstrap themes to extend the default styling of the user interface – allowing the customer to go crazy with their colour choices, as shown below.
From web to desktop
At the same time Squarebox were working on a major update to their flagship desktop client. Due to the software’s complexity with hundreds of separate UI controls, panels, and dialog boxes, there were places where the user experience was hampered by a lack of consistency. So the focus of this update was to develop a clean and simplified style for the user interface, ensuring all UI components were visually consistent throughout. Removing superfluous borders and bevelling effects helped to reduce the visual clutter, and colours, font sizes, border widths, and icons were normalised across the application.
These redesigned UI components now inform the various other products in Squarebox’s suite, including the Advanced web client pictured below.
Other products
More recently we redesigned the new ‘Worker’ workflow automation software and the Final Cut Pro X extension. The new designs for the Worker application incorporates a colour-coded graphical user interface, as seen below.
