Web client - window layouts

[Felipe Cecagno]

Hello guys,

We've been working on window layouts at the web client. First we've implemented a layout called "Small videos" that organize the video windows and resize them to a small size. Some screenshots are attached in this e-mail. What do you think about this feature? We've thought about other layouts, like "Presenter + presentation" and "Meeting" (videos and chat using all the screen). Do you have any other ideas?

Thank you very much,

Regards,

Felipe

[Felipe Cecagno]

I forgot to mention that you can test this feature in our public development server at http://devbbb-mconf.no-ip.org. :)

[HostBBB.com]

Felepe, looks neat... do you have the hi res 720 video working on this
to... i noticed you mentioned some other features like display
console?

regards,
Stephen
hostbbb.com

On Mar 16, 10:34 am, Felipe Cecagno <fceca...@gmail.com> wrote:
> I forgot to mention that you can test this feature in our public development

> server athttp://devbbb-mconf.no-ip.org. :)

>
>
>
> On Wed, Mar 16, 2011 at 11:31 AM, Felipe Cecagno <fceca...@gmail.com> wrote:
> > Hello guys,
>
> > We've been working on window layouts at the web client. First we've
> > implemented a layout called "Small videos" that organize the video windows
> > and resize them to a small size. Some screenshots are attached in this
> > e-mail. What do you think about this feature? We've thought about other
> > layouts, like "Presenter + presentation" and "Meeting" (videos and chat
> > using all the screen). Do you have any other ideas?
>
> > Thank you very much,
> > Regards,
>

> > Felipe- Hide quoted text -
>
> - Show quoted text -

[Felipe Cecagno]

Hi Stephen,

Actually we didn't change anything on the console window - we've just enabled it on config.xml.

About the high definition, we've added that resolution on config.xml (see https://github.com/bigbluebutton/bigbluebutton/pull/4), and it seems to be working fine - we've tested the video with a HD webcam -, but with higher resolutions the framerate is very low.

Regards,

Felipe

--
You received this message because you are subscribed to the Google Groups "BigBlueButton-dev" group.
To post to this group, send email to bigblueb...@googlegroups.com.
To unsubscribe from this group, send email to bigbluebutton-...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/bigbluebutton-dev?hl=en.

[HostBBB.com]

What do you think the issue is on the frame rate. Flash/Local PC video
driver cant capture the frames, or is it the amount of data the needs
to be transmitted thru netowrk connection such that frames are dropped
somewhere?

stephen

On Mar 16, 7:06 pm, Felipe Cecagno <fceca...@gmail.com> wrote:
> Hi Stephen,
>
> Actually we didn't change anything on the console window - we've just
> enabled it on config.xml.

> About the high definition, we've added that resolution on config.xml (seehttps://github.com/bigbluebutton/bigbluebutton/pull/4), and it seems to be

> >http://groups.google.com/group/bigbluebutton-dev?hl=en.- Hide quoted text -

[Fred Dixon]

Very cool Felipe.

I checked out your server and personally liked the pop-up menu in the
lower right-hand corner. It could replace the existing 'reset layout'
button with a choice of layout options in a menu, such as:

Reset Layout
---
Align Webcams
Maximize Presentation

where "Maximize Presentation" makes the presentation window as large
as possible, which, on some monitors, will partially cover the Viewers
and Listeners window.

Regards,... Fred

[HostBBB.com]

If you could map F11 to a FULL SCREEN layout button option, users
wouldnt have to know the short cut to go full screen.

stephen

[Gregor Gimmy | Sclipo]

Hi Felipe,

this is a great idea, and much demanded by our BBB users. (fyi... We run BBB on Sclipo.com, a platform of Web Academies for freelance teachers and small schools. A Web Academy comes with BBB, a Course Manager and social tools. We have about 10k teachers from +200 countries, many of which use BBB in their Web Academies, providing continuous feedback.)

Our teachers (and I guess any) use BBB for 4 types of distance education activities, each with a different layout requirement:
* a class: few to few
* a webinar: 1 to many
* a tutoring session: 1 to 1
* a meeting: n to n

Ideas:
1) define layout options by "activity type" (webinar/class/...), in addition to / instead of "tool type" (webcam/etc.)
2) selecting a layout could be part of the log in process: "Select your Activity: Class / Webinar / etc."
3) how about putting the layout selector on the top right?
4) layout configurator: each teacher could configure a layout, and name & save it

Thanks Felipe. Great contribution!

Gregor

--

[Fred Dixon]

Hi Gregor,

> * a class: few to few
> * a webinar: 1 to many
> * a tutoring session: 1 to 1
> * a meeting: n to n

Good list, and I agree that each one of these scenarios is slightly
different. I'd modify it slightly as follows:

1) a tutoring session: 1 to 1
2) a webinar: 1 to many
3) a small collaborative meeting: n to n
4) a panel presentation: n to X

where n < 7 and X > n.

The number 7 is not an absolute number, but rather it reflects that
the overwhelming number of collaborative meetings are with smallish
numbers of people, hence we can look at optimizing the experience for
that use case.

1) a tutoring session: 1 to 1

Here a student knows there is only one teacher, so the student doesn't
really need to see the listeners or viewers window.

Presenter:
- Default layout for BigBlueButton

Viewer:
- Hide the users and listener's window and maximize the
presentation and chat

2) a webinar: 1 to many

Here the remove viewers are going to mostly watch. We've seen
scenarios in a classroom where a teacher will login to BigBlueButton
twice: once using the electronic podium (which is broadcasting on the
overhead projector), and second on their laptop.

The presenter then maximizes the presentation window (or as much as
possible using the current layout), but on their laptop they maximize
the chat window and increase it's font. This lets them follow
questions from those remotely.

In many cases, the students in the class will login to BigBlueButton
as well and alert the teacher if remote students are asking questions.

Presenter:
- Default layout for BigBlueButton

Viewer:
- Unable to start their webcam. Audio is muted by default. Must
push to talk (if allowed).

3) a small collaborative meeting: n to n

Here the group really wants to collaborate. The webcams will startup
up aligned along the bottom (with room enough for 7).

Presenter:
- Default layout for BigBlueButton. Presenter can unlock their
presentation so others can move around during the presentation. This
allows everyone to go into a "collaboration mode" where they are not
locked to the presenter's current view.

Viewer:
- Webcam and audio starts by default.

4) a panel presentation: n to X

This may not change much from (2), but there would be a third
moderator that is switching the role of presenter amongst the panel.
All the panel have the ability to talk by default.

Presenters:
- Default layout for BigBlueButton. All can talk.

Viewer:
- Unable to start their webcam. Audio is muted by default. Must
push to talk (if allowed).

The ideal way of implementing the above would be as follows:

1) the layouts for each scenario (window placement, enabled/disabled
features) are defined in XML file, such as layouts.xml, on the
BigBlueButton server.

2) The moderator can shift the layouts dynamically during the
presentation. Thus a small n to n meeting could be shifted to a
webinar as more people joined.

3) An administrator could use BigBlueButton itself to modify the
layout for a given scenario. For example, if the administrator
switched to webinar mode, then rearranged the windows, they could have
the BigBlueButton client generate the current XML (such as in a log
window) within their client. The administrator could use this
generated XML to update the corresponding scenario in layouts.xml.

Obviously, for (3) you ultimately wouldn't want to require an
administrator with privileges to edit the files on the server to
change the layout for scenario, but it would be a start to give
schools, colleges, and companies like Sclipo that capability.

Excellent discussion.

Regards,... Fred

> 1) define layout options by "activity type" (webinar/class/...), in addition
> to / instead of "tool type" (webcam/etc.)
> 2) selecting a layout could be part of the log in process: "Select your
> Activity: Class / Webinar / etc."
> 3) how about putting the layout selector on the top right?
> 4) layout configurator: each teacher could configure a layout, and name &
> save it

[ppetasis]

Felipe's work is great! And i personally believe it is work that many
users would want included in the official release.
Is there any chance that the patches he made are available in the next
version (0.8) of bbb? At least the option to have more video
resolutions is good to be included.
If not we can always patch and compile ourselves so no problem :) .

Regards
Panagiotis

>  after.png
> 236KViewDownload
>
>  before.png
> 345KViewDownload
>
>  small videos example.png
> 239KViewDownload

[Fred Dixon]

Hi Panagiotis,

We're are reviewing Felipe's work to incorporate parts (or all of it)
it into 0.8.

Regards,... Fred

[Phan Thái Trung]

Great ! Only the presenter should have "main" webcam window, while the attendants should have smaller or inactive webcams. For fixed layout management, the windows should dock on left or right panels.

Trung

2011/3/22 Fred Dixon <ffd...@gmail.com>

[Bhavin Patel]

From where i can get this changes done in my development environment.