Epic Games / Unreal Engine
As a member of the product team, I brought many years of broadcast design and technical experience to Epic with the goal of building a real-time broadcast system that could rival any tool on the market and add the rendering power of the Unreal Engine to the mix. This system required retooling on pretty much all fronts and, with the helpful feedback of an enthusiastic industry and community, we launched the production ready version in Unreal 5.7 in addition to a massive and well-received sample project that I directed that was designed to test the limits of the product.
Motion Design Interface
I designed many elements of the general interface of the Motion Design toolset. This final UI was refined over several iterations based on my history in the Unreal Engine and broadcast use cases as well as critical industry feedback from our beta testers and broadcast partners. All imagery is from the sample project that I worked on with Capacity Studios, an external partner that was new to the toolset. All feedback from their designers was extremely valuable because they were the exact type of customer that would be using the toolset - seasoned design veterans who were previously focused on using tools like Cinema4D and the Adobe Suite.
Outliner Rework
Structurally organizing and filtering the elements of a level (lights, geometry, actors, etc) is a critical function of working in Unreal. Prior to Motion Design, this was done in what is called the “World Outliner.” When it came to being “designer friendly,” there were inherent issues with it. Doing things that designers are used to, like grouping elements under a single positional transform was simply not possible.
Motion Design solved all of this to the point where many members of the larger Epic team were wondering why the engine didn’t shift to this model entirely.
Filtering, nesting, basing visibility on inheritance, color coding groups (similar to After Effects). This is really just the beginning of what was done to enhance the UE workflow.
Before Rework
After
Material Designer
Many of our users were familiar with the Adobe suite and some combination of real-time broadcast software. Both of those workflows required catering to designer-friendly UX as opposed to the more tech-art focus of Unreal Engine. The Material Designer tool that I built the UX for intentionally takes inspiration from tools that our userbase would understand immediately. This greatly simplifies the act of building customizable materials for designers familiar with layer-based systems like Photoshop. The top 4 images are the UX focused improvements that Material Designer brings. There were several iterations explored before landing here, but the most comfortable workflow was the vertical layer style that users have been trained on for their entire career.
The node graph example shown here is how someone would traditionally build this exact element using the old material system before this improved workflow was designed. The “Material Builder” as it was called, also enabled the user to create a material in the layer-stack style and export that material as a traditional Unreal material, giving the user the best of both worlds.
Motion Design Rundown
The Rundown is where the live operator can call up any of the designed levels, modify the properties that are remote controllable, and build up their presentation. This was a key bit of the interface design to nail down, so great care was taken to make sure that it was familiar for existing broadcast users to easily dive into.
The user is also able to set up their output channels in a custom broadcast setting panel. All of these features were expected by clients and the industry at large, so getting this right and ensuring that it also had a matching API was mandatory.
Remote Control
Remote Control allows for any property in a level to be exposed to the artist/graphics operator in order to easily customize the design content without giving the user the ability to break the core systems under the hood. This is one of the final steps to rig a level for on-air playout.
What you’re seeing on the right is the same graphic stylized depending on those exposed properties. Each property is defined with a Controller number (in the 2nd column) and can use a variety of behaviors to expand what the controller influences.
Remote Control Web
Web based Remote Control utilizes the same property control functionality as standard Remote Control but allows for selected properties to be added to friendly website controls (dials, sliders, text boxes, etc) and can therefore be used wherever a web browser can be found. We specifically did a lot of work on iPads and primarily for linear content such as films. The control panels to the right here handle two major features requested by a major production. They needed a panel that handled color correction for specific areas in the environment as well as the ability to control “Light Cards.” So two different panels, with similar design direction, needed to be designed and built. I handled the design side and we had a software team that handled coding it.
In addition to pre-structured panels, users are also able to create bespoke layouts based on properties that were exposed in-engine.
Scene State
The demand for broadcast graphics to have an “always live” design is a huge part of the workflow. Unreal did not have a built-in solution for that, so I took my prior broadcast knowledge and drove the effort to get a system constructed that would be both familiar and an upgrade to existing products in the marketplace.
What you are seeing in the screen grab is the state machine that was designed to give users an easily readable flow chart. In this example, it is capable of animating a scoreboard on/off as well as the sub-features of that scoreboard.
Multiple, highly specific nodes were created to cover key tasks. Want to play one of the sequences that you have in your level? Look no further than the “Play Sequence” node. Once we had the ability to control delay, data sources, and the sequence list to the bottom right of this frame, the core features of an entire scorebox could be rigged.