1

Background

I'm working on a project involving configuring live video feeds (contrast, brightness, focus, etc). This is a very rough sketch of how the layout of the UI looks like:

enter image description here

Each grey box represents a category of settings. This is a view of one live feed. The UI can show an indefinite amount of live feed that the user can "open". Think of it like tabs or profiles. The above picture represents the view of one such feed, and the user can go "back" and select another feed to view and configure. Basically:

<Feed overview page>
  <Feed 1 page>
  <Feed 2 page>
  ...
<Settings page>

I am now working on a new feature, which I cannot disclose the name or type of (sorry about that), but I can generalize a few things about it. I'll just call it foo bar hence forth:

  1. It needs to be configurable in the Settings page and then "applied" to one or multiple feeds. In other words, you configure foo bar once and can then reuse it in any feed.
  2. As above, but the user should also be able to configure the same setting from within a feed page. Setting the feature here will apply it to the open feed, but will be available for other feeds to use too.
  3. The nature of the setting requires the video to be fairly big in size. Not necessarily fullscreen, but a thumbnail or anything small or medium sized will not suffice.
  4. The user should be able to select, edit and delete an existing foo bar or create a new one.

My proposal so-far

A feed without any applied foo bar setting:

enter image description here

Clicking it allows the user to select a previously created foo bar, or create a new one. (The video here is small because it serves the purpose as a preview - creating a new foo bar would require a much larger video area):

enter image description here

How selecting an existing foo bar looks like:

enter image description here

enter image description here


My issue

And here's where I am stuck. In the case where the user wants to create a new foo bar - and taking into account that we need to give the user a much larger video area to work on - what is the best flow from here? Again, the video area here, in black, is just for preview - it cannot be used for the config itself.

Do I transition from here to a window/modal where the video is much larger? Do I redirect to the Settings page instead, and then back again once finished?

enter image description here

Any ideas or suggestions? Thanks.

2
  • I think it's important to clarify if it's a desktop or mobile application or both. In any case, I cannot understand the paradox of the need for a full screen to view the videos and the extremely wide buttons of the application sketches. I think the immediate solution is to remove all the buttons and make the video screen interactive with semi-transparent sliders or side menu.
    – Danielillo
    May 21, 2021 at 16:31
  • @Danielillo it's a web application, so both. The video needs to be big because the user will be configuring the feed depending on details in the video that may be quite small - a small video would make these details hard to distiguish/see.
    – Chris
    May 21, 2021 at 17:30

1 Answer 1

1

I'm not entirely sure if I understood everything right. I imagine your foo bar something like a template to be reused on different videos. What I'm also not really sure is, where the 'configure foo bar' action is placed. Is it part of the settings in your first image?

So here my thoughts: To me it seems there are two different actions: 'apply existing foo bar' and 'create new foo bar'. You have placed both actions into the 'configure foo bar' overlay. What I would suggest is to separate these actions on step before. If (as I assumed) the foo bar is one of the settings on the right side provide two actions there. 'apply foo bar' would open the overlay and 'create foo bar' would stay in the view with all the options to create the foo bar right in place.

2
  • As per your first question, correct. One of the many settings on the left-hand side there. Not a bad idea. So essentially you are suggesting to replace the Configure foo bar button with two buttons. Correct?
    – Chris
    May 21, 2021 at 17:31
  • 1
    Exactly, that's what i suggested.
    – BrunoH
    May 24, 2021 at 12:04

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.