NBC Universal International VOD
Media Scheduling HCM SaaS Platform
Product Type: Desktop Media Scheduling SaaS Platform.
Scope: Interactive prototype for 1 type of user, from concept to development hand-off.
End Users: Int’l VOD Media Scheduling Team members.
Pain Points: Users experienced multiple pain points with the legacy app they were using for scheduling VOD media. From surveys it was found that they needed a more efficient way to conduct a complicated data-entry process that involved searching multiple databases to complete the scheduling process and send work orders to other departments. Specifically, they needed to search databases and select data to import within the same application. They also needed a way to edit individual title scheduling information as well as edit this information in bulk, across multiple titles at once. These features were needed to ensure product scalability as well as maximizing workflow efficiency.
1) Users needed to search databases and select data to import within the same application to improve efficiency.
2) Users also needed a way to edit individual title scheduling information as well as edit this information in bulk, across multiple titles at once, to improve efficiency.
1) Making the UI user-friendly and intuitive to minimize training requirements, while allowing complex data entry and editing functionality on screens requiring access to multiple datasets at one time.
Timeline: 10 Weeks
My Role: Design Lead in collaboration with two other Product Designers to ensure design consistency with other apps in this suite.
Approach to Solving Problems:
1) Collaborative design with other designers who had designed other applications in the suite to ensure consistent application of UI patterns and to utilize previously-developed modules where available to speed up the development phase of production.
2) I referred to popular consumer-facing apps with similar use-case scenarios in order to see how they simplified and minimized the UI for consumers, looking for any overlapping between their UI solutions and the existing design library that the Product Team had to work from to solve these issues.
1) To provide users with a way to search databases and select data to import within the same application to improve efficiency:
I created a screen layout that was unique to the process of editing a selected group of titles, separating the screen into two sections. One section would show the list of selected titles on expandable cards, allowing the user to select one or multiple titles from this group to apply edits to, and the other section would be a nav-drawer offering bulk-edit options based on the context of available actions at that step in the user flow. The Content Area cards presented titles in an editable table format that allowed for individual edits, while the nav-drawer presented a form for accessing and selecting from other databases and applying selected data to titles in the Content Area. This consistent UI pattern mimicked other UI patterns in other company apps to ensure no user-training was needed for end-users to navigate through this product.
1) To provide users with a way to edit individual title scheduling information as well as edit this information in bulk, across multiple titles at once, to improve efficiency:
I noticed that other apps in the suite of company apps utilized a nav drawer component for complicated forms that allowed bulk application to any number of titles that were selected in the Content Area of the screen. I applied this same pattern to this product and extended its user to allow the user a way to select one or multiple titles, view all title details relevant to the necessary editing process, and simultaneously use the nav-drawer form for complicated editing processes, including bulk edit application. Meanwhile, the user could make edits to individual titles in the main content section of the screen.
I used this UI pattern to create a consistent and predictable layout for the user to perform both bulk edits and individual edits.
I also used the methods I was observing in consumer-facing applications for UI simplification in order to identify and remove every design element on the screen that could possibly be removed while still allowing the user to perform the required actions at each point in the user workflow.
Both of these allowed for a more open, streamlined design solution that allows guides the user through the workflow process.
Result: The end-users of this product were interviewed and said this UI would greatly simplify their workflow. It is currently in development.