Add "Grid View" layout

[hex-m]

It is common that every participant in a meeting enables the webcam. That way everyone has a visual reminder of who is in the room. This use-case breaks by enabling video pagination.

Coming from real-life meetings (and other video-conferencing solutions) this seems like a reasonable request. The solution would be to offer a more visual overview of the participants than the current user list while still being gentle on resources.

Describe the solution you'd like
A layout option (usually called "Grid View" or "Tile View" in other tools) that shows placeholders (avatars) for users that do not share a webcam.

Describe alternatives you've considered
The "share webcam" dialog could allow users to set an avatar (maybe take a photo with the webcam) and use that instead of the live video. This gives the decision to the individual user while it should probably be a meeting-wide setting.

[antobinary]

Thanks for the enhancement request @hex-m !
Related #12481

(Edited - it is related to 12481 but not a duplicate. In 12481 we don't explicitly display everyone.)

[AInteriorB]

For me it was also very confusing, that there is a pagination for more than 6 webcams on student side but not for me as a presenter. In general it is highly recommended, that everybody has the same view of the situation. A presenter doesn‘t expect a different view on student side. Also it would be very helpful that the presentation is closed on student side if the teacher does so by clicking on the icon bottom right. (The way via settings, layout, … is very inconvenient)

But back to your suggestion: I‘d also welcome a grid view with all of the webcam participants. Especially if the presenter propagates the „video in center“ setting for everyone. Or better: by clicking on the close presentation button bottom right ;-)

Workaround is to set public.app.defaultSettings.application.paginationEnabled to falsein
usr/share/meteor/bundle/programs/server/assets/app/config/settings.yml to disable webcam pagination at all and then set the „video in center“ layout via settings in the UI.

[prlanzarin]

For me it was also very confusing, that there is a pagination for more than 6 webcams on student side but not for me as a presenter. In general it is highly recommended, that everybody has the same view of the situation. A presenter doesn‘t expect a different view on student side.

That is configurable. You can set the same page sizes for moderators and viewers if you want to (pageSizes at setting.yml), so not an issue per se.

[prlanzarin]

Short list of talking points

• Blocked by Webcams: allow using avatars as webcam container placeholders #12481
• Figure out UI/UX for this. The main pain point is that we probably still want to prioritize available space for actual cameras. BBB's video dock is not your regular conference grid view right now so it's not that straightforward usability-wise.
  • When should we enable that grid view? (e.g.: only when presentation area is minimized, dedicated layout mode like the OP suggested, ...)
  • How would this interact with pagination?
  • How does the amount of placeholders vs actual cameras interact with different viewport sizes for the video dock (e.g.: varying layout modes, varying devices...). We should probably still prioritize space for actual cameras in most scenarios IMO - if so, come up with an appropriate grid format as the current one does not suffice.
  • Consider Give webcam focus to the current speaker #8388 as well
  • ... [other considerations]
• Define a list of tasks based on the outcome of Webcams: allow using avatars as webcam container placeholders #12481 and the UI/UX debate

[antobinary]

The most recent (afaik) existing design for grid layout from @tylercopeland There are extra details here (volume control, etc) that fall out of scope, but I don't have a copy without them

A possible implementation of the playback (to match the grid layout) from @tylercopeland

[mariogasparoni]

Thanks , @antobinary . As we discussed internally , this is going to be handled in future.

@frankemax is looking into using these UI ideas in #12481

[prlanzarin]

Factor in #8388 when thinking about the UI/UX for the video dock grid (#13844 (comment))

[antobinary]

Related: #10828

[ffdixon]

Our focus for 2.7 is to get a grid view in place first. The designs show a meeting timer and ability to adjust the audio of a user - these concepts may not make it into the final release for 2.7.