Frequency Studio:
CONNECT
In 2022, we added a new tool, CONNECT, to be the main page of Frequency's Studio software, giving users a quick, actionable window into their video streaming performance data.
In 2022, we added a new tool, CONNECT, to be the main page of Frequency's Studio software, giving users a quick, actionable window into their video streaming performance data.
In a meeting withour Customer Success and Sales teams, the Product team learned that our biggest source of pain from the customer was twofold: First, the amount of time it took to recognize that there was a problem with a given stream (e.g. black screen),and second, there was no quick way to solve problems once they occurred.
Since a lot of streaming monitoring was done manually - either in-house or by the clients themselves - it was not a scalable solution. Taking on TelevisaUnivision as a client meant adding 25+ live channels to our roster, and we knew it would be a strain on our existing monitoring capabilities.
Finally, from a business perspective, people weren't spending much time with the software outside of adding channels and uploading content. Less face time with the software means fewer opportunities to sell the client on our advantages over our competitors. Also, the people who used the software were not usually the ones making purchasing decisions, so we needed a feature that executives and buyers could get excited about.
1. Wireframes
2. High-fidelity Figma prototype
3. New monitor/alert UI element
1. Head of Design/UX
2. Lead Visual Designer
3. 2 Developers
1. Lead Designer
2. Discovery Research
3. UX/UI Design
We decided the best way to solve these problems was with the creation of an entirely new tool within Frequency Studio that could serve as a monitoring dashboard, with actionable alerts that made it easy to fix any issues you discovered with your streams.
We did extensive research and competitive analysis to determine the best way to lay out a monitoring dashboard, what information should be included at the top level, and what easy actions could be taken to solve common issues like loss of video or scheduling gaps. We did testing at both the wireframe and prototype stages to make sure the new dashboard was intuitive.
Sharing a functioning dashboard with a few close clients before the full launch allowed us to test the new functionality with real streams, and ensure that we had a beautiful, functional piece of software that addressed several common complaints and added a lot of value for our customers.
Before designing our monitoring dashboard, it was crucial to understand exactly what our clients were missing, what they wanted, and the commonality of certain issues. We also looked at other dashboards in various software solutions (including one I had worked on before) to gather ideas and build a starting framework.
We also worked with the engineering team to learn what actions it was possible to take from the dashboard and how much time it would take to implement the solutions being requested. We learned that it would be relatively straightforward to implement the monitoring, but the quick fix functionality would require updates to some other tools as well, namely SCHEDULE and MANAGE.
1. Live monitoring and quick action
2. Scalability
3. Adding value
Identify the biggest pain points among clients related to current streaming monitoring system, and ways we could best implement actionable fixes for common problems.
The biggest pain points were having to monitor streams manually, then having to troubleshoot or call Frequency support to identify and fix the problem. Every client said they would prefer being able to make quick fixes in house, even if it means a new workflow or software solution.
Since the interviews supported our dashboard solution with actionable quick fixes, our first step was to brainstorm new user flows to discover what other areas of the software might need to be updated in order to implement these fixes. What began as a monitoring tool was now going to be new software capabilities that would cement CONNECT as the central hub of Frequency Studio.
External monitoring
No quick fixes
No alerts
No schedule gap warning
Time-consuming CX
Limited action within software
Filter by stream, channel, etc
Intuitive fixes
Quick replace
Warnings and alerts
Dashboard
Existing streaming and ingest data can be fed into the new dashboard for customer use.
Large alerts plus status panes to quickly draw attention and guide users to actionable information.
Live video monitoring and overrides within CONNECT tool dashboard.
The CONNECT tool adds an overall "monitoring" journey to Frequency Studio, supplementing the existing "channel creation" journey. Beyond the alert-solution journey depicted above, we built other tabs within the CONNECT tool to monitor channel status, live playout, and distribution status - all with robust filtering options.
As the new "front page" of Frequency Studio, the user is immediately presented with the most urgent live information, with the ability to click through directly to solutions either within the CONNECT tool, or within other Frequency Studio tools.
We built low-fidelity prototypes in Figma to find the right balance of alert to information, and what information needed to be on the dashboard and what could be a little deeper in the tool.
What information was most urgent and actionable?
Playout Status (90%) and Schedule Status (66%)
How can we make it work for clients that have a lot of channels and streams?
Have status panes list streams by status; include robust monitoring on other panes
We needed to design and test connections to other tools within the software
Action buttons within the status panes made this intuitive and effortless (100%)
Give engineering a sense of the functionality that will be required by the new dashboard and flows.
Send lo-fi prototype to a few core clients for feedback on the content and user flow.
Decide how much information to include in status panes vs. what can just be in other tabs.
At the same time as we were creating the CONNECT tool, I was building a design system for Frequency Studio for the first time, so we were designing elements for this tool at the same time we were formalizing and optimizing design elements throughout the software.
Designed a new alert bar for the top of the dashboard, with alerts for playout, scheduling, and ingestion, plus one for total alerts.
Eye flows from top left, across alert bar, alerts correspond to panes, panes lead you to action.
Designed monitor squares that were big enough to see playback, but small enough to be able to load dozens at a time.
CONNECT icon was added to the top of the sidebar, now more chronological according to the channel creation process.
Unified filter sidebar design throughout software tools.
Included full list of distributor partners to encourage expansion.
Throughout the design process we were in close contact with the engineering team to ensure that our designs aligned with our technical capabilities, and testing each individual interaction to make sure it had the desired effect.
Once there was a working prototype in staging, we worked with a few close clients to test the software, simulating the main issues it was designed to detect, and had the clients take the actions to fix them through the software. During this process we discovered the need for another tool - INGEST - which would involve building out our tagging infrastructure to aid in the "override stream" functionality.
We released CONNECT as an MVP in November, 2022, alongside our updated UI based on the new design system. Over the course of 2023, alongside the development of the INGEST tool, CONNECT was iterated on and became fully featured (including "override stream" and other updates) with the release of Frequency Studio 5 in September, 2023.
Figma
Figjam
Google Analytics
MS Clarity
Useberry
Illustrator
Jira