Wikimedia Meta-Wiki

ItWikiCon/2020/Under the hood of a cozy online conference

< ItWikiCon | 2020
Translate this page
Other languages:

Here we documented all the itWikiCon 2020's gears and machineries hoping to help organize similar online conferences.[1]

Some smiles in BigBlueButton by some moderators and organizers.

Before you say «who cares, it was a small simple videocall», here some numbers:

  • 21,000 pageviews
  • 310 visitors who stayed online for more than 15-30 minutes

And yes, we designed it with only Free/Libre software and open source. Read more!

Preamble

edit
 
itWikiCon 2020 buzzwords

We are writing this page in the hope of making this kind of conferences more…

  • cozy[1]
  • respectful of the user's freedoms[2]
  • easy to implement[3]
  • scalable[4]

Having said that we hope to reclaim live events when the global health situation will not be that bad.

In any case, when everything will be back as before, the online mode can be promoted as a bonus point for live events. This is also in line with the Sustainability Initiative.

Use case

edit

We had this use case like many online conferences:

  • few people want to talk[5]
  • lot of people want to listen and chat[6]
  • people want to see again the conference[7]

Also, we organized it with these resources:

In a nutshell

edit
 
Room overview[12]

The itWikiCon 2020 in a nutshell:

  1. few people (less than 100) interacting each other in real-time with audio and video
    → BigBlueButton[13][14]
  2. lot of people (more than 100) viewing the conference and chatting
    1. website[15][16][17]
    2. video player[18]
      → #video direction
      → streaming[19]
    3. chat
      → Rocket.Chat[20]

In short, whatever conference software (BigBlueButton, Jitsi Meeting or any other) does not scale well from 50, 200, 500, 1000, 10000, 1000000 participants and anyway it's not that easy to be used from random participants. To overcome this bottleneck you may be interested in the #video direction section describing how to do streaming and have a simple video player for your visitors, to have your conference one click away.

In depth

edit
 
Interaction flow (legend)

Not all actors were using every component of the conference. This can be described using this schema shown on the side. Here its legend:

BigBlueButton
place where people can talk and share slides
speaker(s)
who talk and share slides in BigBlueButton
moderators
who assist the speaker and help in sharing slides and share some interesting topics from the public chat
video director
the one in the video control room with a BigBlueButton browser tab always opened, sending that tab in streaming with Open Broadcaster Software to the streaming server
streaming server
Internet node able to receive a video input from OBS and broadcast that video to a lot of participants using the HTTP Live Streaming protocol or whatever similar open protocol.[19][21]
few participants
someone invited to the party who can ask to raise some questions and that can be banned from moderators
lot of viewers
visitors of the website who just want to click on a video player and have fun and eventually use the public chat

Organization

edit
 
Wikimedia Phabricator workboard

The itWikiCon 2020's team was coordinated trying to boil down with the The Cathedral and the Bazaar philosophy, trying to keep everything in the hands of who have time to contribute.

We cooperated with this dummy loop:

  1. put an idea in the stack[22]
  2. sort by priority[23]
  3. pick one from the top
    1. can I work on this?
      1. contribute
      2. track progresses[24]
      3. show your work[25]
    2. no, I can't[26][27]
      1. triage[28]
      2. ask for help[29]

The coordination happened via instant messaging and other informal places like:

  • a public Telegram group for generic organizers (open for everyone)
  • a couple of private Telegram groups to handle sensitive data (expenses, survey results, ...)

Also, we played with Phabricator creating an itWikiCon's 2020 Phabricator workboard to avoid to miss something and keep track of progresses and deadlocks.[30]

Considerations

edit
Open participation
An online conference may be a good moment to try to open the organization to more contributors.
Pro
That's why we tried to avoid a strong organizing committee, trying to avoid approved roles responsible for something, trying to hold discussions in public, trying to invest in that feeling of having something at hand, being part of something.
Cons
In practice we had anyway some usual taboos of barriers and frictions for contributors.[31]
Lesson learned
The conference has improved dramatically every single time the answer was «Yes, be bold! work on it!» or «Yes be bold! but what about this problem? Let's fix this before working on it!» trying to overcome the problem and not to overcome any constructive idea just because of some personal fear or prejudice about other people work. Nobody loves to receive a no. If an idea comes from a volunteer, and if that idea is in line with the project, that idea deserves a "yes" by default, discussing about its strengths and weaknesses but without any preventive "no".

Organic shopping list

edit
 
Video direction with OBS

For an awesome online conference you will need to find nerds matching one or more of these non-obvious figures and skills.

Descending by level of mystery:

sysadmin
that's an online event! Find that guy with beard and GNU.org T-shirt and lot of stickers on an old but powerful laptop doing.. well nobody knows but everything will be up 'n' running. Until you do not cite some proprietary stuff.
backend developer
the one who do not understand what normal people want but who can convert coffee in robust management systems, frameworks, APIs and some other toys to make the frontend guy happy
frontend developer
young hipster with lot of colorful stickers about esoteric programming languages on a very fresh laptop. The only one who knows how to convert energy drinks in what people want, from clean interfaces, big buttons, good templates, cute icons, and... who said emojis?
designers
generators of amazing logotypes and always working on your visual identity. These contributors will transform your conference into an unique and consistent one.
video director
Someone who likes to be condemned in the control room for the whole, long, eternal duration of the day playing. They will play with OBS sending the conference on-air for the large public. For some sanity, have one of them for each parallel track and change them every day. So the suggested number is days * parallel tracks.
video editors
people who would love using OpenShot or Kdenlive or other libre video editors and cut and adjust and publish your videos the days after your conference
moderators
at least one but better two for each session of your conference, to assist the speaker and communicate with the video directors and have some on-air coordination. They will moderate interventions in BBB (if enabled to the public) or the chat (if desired) and eventually forwarding interesting chat messages to the speaker
project leader
well, the leaders writing this paragraph can say we haven't spent much on this point but, hey, it worked.[32]

Having said that it may work well also concentrating the first technical figures into a single one-man band nerd, a good suggestion is to try to avoid a single point of failure.

Technical shopping list

edit
 
OBS control room

Well, we know there are a lot of proprietary solutions for this section but here you will discover our Free as in freedom recipe for a Wikimedia online conference:

  1. a place to host a Big Blue Button (BBB) instance[13][14]
  2. an RTMP server - a generic Internet node able to broadcast what happens in BigBlueButton to a lot of viewers. This part makes your event scalable to more than 100, 1000, 10000 participants.[19][33][34]
  3. control room - a quiet place! literally! meaning no babies and no construction sites nearby and a good and stable bandwidth in every direction (up, down and diagonal if you can). The choosen desk must be wired and distant less hops as possible from your home gateway and, not obvious, make sure it's less than 4-5 meters from the nearest bathroom (or, well, wire the bathroom).
  4. some workstations - computers needed to operate the control room. The rule of thumb is to have at least tracks + 1 workstations. Every workstation must have the ability to run OBS Studio (it works well on GNU/Linux operating systems) to both record and stream your track. Keep a workstation free, to be used as a jolly in case of emergencies or for personal use. Every workstation should have a microphone to interact with downstream.[35]
  5. a website - a place 100% under your control where you can glue your technologies together.[15][17]
  6. Matomo - a very good web analytics application to explore metrics and check if everything is going well (performance as well)
  7. snacks for the video directors[36]
  8. storage - for two days of conference of two tracks we recorded 50G of raw videos in our hard drives. Stay ready to taking up a lot of digital space, and stay ready to share your raw materials somehow with others, or you will not be able to collaborate.

For example if you have two parallel tracks for one day, try to have a control room with two video directors with three workstations, three monitors, three microphones and three headphones.

Website

edit
 
Database schema of the itWikiCon 2020 website.

We had some fun in software development for the website. As usual, we reinvented the wheel for the glory of insignificant details.[37][32]

We designed an unstable dedicated content management system from scratch, based on another unstable conference framework made from scratch, based on another unstable website framework made from scratch.[38][39][40].

Somehow this spaghetti project received particularly positive feedback, always been in step with all requests:

  • have something more cute than a wiki[15][41]
  • auto-magically import sessions from Meta-wiki
    → have the event under control of the community
    → webmaster job simplification
  • have a timetable dense of links
    → player button for each session
    → up-to-date information from Meta-wiki
    → saying "starts in x minutes/hours..."
  • have a permalink for each session
    → with up-to-date description, abstract, notes
    → with up-to-date speakers and mentors
    → automatic links from next/previous and in the meanwhile
  • have a permalink for each room
    → with up to date timetable

Let's surf a while:

https://2020.itwikicon.org/

Video direction

edit

This really makes the difference between a simple online video-conference and a structured conference.

In short, this section tells about Open Broadcaster Software. As an important component of your online conference, this section has a dedicated page.

See also: Working and convening remotely/Open Broadcaster Software streaming guide

Stats

edit
 
Visits over time

We collected some really anonymized metrics using the website analytics software Matomo.

Charts

edit

Here some available metrics (stub):

See or edit source data.


See or edit source data.

The next chart comes from our service provider who conducted a bandwidth stress-test that can be compared to the real-world bandwidth consumption.

 
Streaming bandwidth: stress-test and then real-world usage.

Stats considerations

edit

Thanks to these metrics we answered some questions and had some considerations:

  • We had 310 visitors online for more than 15-30 minutes
  • We had 152 visitors online for more than 30 minutes
  • We had nearly 14,000 accesses on the website every day of the conference and a peak of 21,000 pageviews
    → The performance of an average webserver can surely handle this traffic without troubles
  • We had a very high bounce rate at nearly 80%
    → This means that the CentralNotice invited 14,000 visitors but only a 20% of them was somehow interested in the conference
  • We had peak of "just" about 110 video viewers at the same time.
    → Not all the 14,000 visitors accessed the same time and very few of them was interested in participating via the video player. This can be useful to calculate your real streaming bandwidth.
    → The video player was one/two clicks away. That is not so much but probably you can try to put the video player on the very top of the website to increase interest.[42]

After the conference

edit
 
Example video introduction

It's very important to try to distribute the extremely heavy load of post-production. Well, this obviously means that you should have the intention to record your conference.

Stay ready to taking up a lot of digital space, and stay ready to share your raw materials somehow with others, or you will not be able to collaborate.

Some good Free software editors:

Gadgets

edit

To spread conference gadgets you have to find good gadgets manifacturers and a reliable express courrier. Fortunately, during itWikiCon 2020 we found both of those and we had no problems shipping gadgets pack all above Italy to all our speakers and organizers! It's important to correctly ask and handle T-Shirt sizes but also addresses, maybe with some sticker sheets and a printer!

At itWikiCon 2020 we had t-shirts and jackets paid for by Wikimedia CH, while Wikimedia Italy paid for stickers, pins and shipping expenses. We also sent some gadget packs to conference participants who compiled the final form and played the minigame we had created or answered to some questions about what we said during the final sessions. In fact, we had said random words during the sessions and then asked about them in the final form.

Giving gadget packs to organizers, speakers and (why not?) participants is a cute thing to thank them for getting involved!

Surveys

edit

Surveying your potential participants and your real participants is important to correctly define priorities and, then, see how well (or bad!) your event went to further improve.

We organized two surveys during itWikiCon 2020, thanks to a LimeSurvey instance (a free software) deployed on a random server owned by one of the organizers. In this way, no proprietary JavaScript was executed on the users' devices and the data remained solely with the organizers.

On the sidelines, Google Form was not considered because:

  • it required proprietary software executed client-side[43]
  • we didn't want to extend the data protection policy to their company

If you want to adopt LimeSurvey, see this page we have written:

The survey results were published in these pages:

Diffusion

edit

Costs

edit

Due to an interesting set of circumstances, the itWikiCon 2020 was organized with a very low budget. Mostly, just gadgets.

We had the ability to request more budget and the possibility to delegate more work but we just didn't do it. The main cause of this was no experience in fundraising and total lack of desire to go into bureaucracy.

To be honest, all received money were obtained without any bureaucratic process and this was a wonderful, wonderful thing. For our case we have had great support from our neighboring Wikimedia chapters.

Having said we had no operating expenses (!) here we tried to provide an estimation of some non-obvious costs entries to organize a generic online conference using 100% free software.

Topic Sub-topic Description Cost info Total
expected 		Total
itWikiCon-2020
Services Bandwidth This is the cost of taking whatever audio/video source (BigBlueButton or whatever) and broadcasting it to lot of people in the form of a simple video player. This is not the cost of hosting BigBlueButton.

Note that most of the service providers disallow streaming. The price here is related to providers specifically allowing it.

We had an average of 500Mbps of audio/video streaming for 16 hours of use. Let's say a total of 8TB streamed data.

Note that some social networks allow this at no costs (if you do not consider their advertising as a cost).

For the itWikiCon 2020 the streaming was offered thanks to our collaboration with a local Internet service provider.[10]

100$–500$ 0$
Website hosting The cloud is just someone-else computer… but maybe it's not the laptop of your web developer.

Your website may be designed to be lightweight and CPU-friendly and being cheap, or very slow and resource-consuming. There are nearly millions of hosting companies and different prices, to host from the cutiest puppy up to the scariest monster.

Note that Wikimedia Foundation helps with its infrastructure to host this kind of websites.[17]

The itWikiCon 2020's website was hosted by a volunteer.

7$–20$
/ month 		80$–200$
/ year 		0$
Hosting BigBlueButton
or whatever 		BigBlueButton (or whatever other free software solution) allows to being installed on your server for whatever purpose. If you want to do it on yourself this has a cost.

This cost ranges between renting a decent server and installing everything by yourself, or paying a system administrator to install BigBlueButton on your already existing server, or paying one of the many BigBlueButton service providers.

The itWikiCon 2020 had a volunteer as system administrator of the BigBlueButton server, coming from a local GNU/Linux User group.

The itWikiCon 2020's BigBlueButton server was offered thanks to our collaboration with a local Internet service provider.[10]

20$–300$ 0$
Online storage Nearly 50 GB of online storage were used to share our raw videos before post-production, and to embed the final videos on the website in multiple formats.

A normal hosting does not provide enough space for the purpose of hosting a video without a proprietary social network.

The itWikiCon 2020 online storage for the videos were offered by a volunteer of a web-radio using their DIY cloud storage.[44]

0.02$–0.2$
/ GB / month 		1$–10$
 0$
Flavours Gadgets Gadgets at least for mentors and moderators and some of the participants with the noblest heart.

For the itWikiCon 2020 we had big colored rounded stickers, T-shirts, vests, jackets. This cost was covered by Wikimedia CH and Wikimedia Italy.

3000$ 3000$
Gadget shipping In an online event you may need to ship your gadgets.

We plan to ship some other gadgets in the next days also to participants with the noblest heart, but actually we shipped 25 packages, one for each mentor and moderator and special guest. The cost of each of these ~8$ and in total nearly 180$.

Most of the itWikiCon 2020's gadgets were shipped inside our nation but an international package costs nearly x3 times.

For the itWikiCon 2020 the gadgets were packaged by a volunteer and the shipping costs were covered by Wikimedia CH and by Wikimedia Italia.

8$–25$
/ menthor and moderator 		500$–800$ 780$
Professional roles Web developing The website can be developed from a single freelance or by a company and can be setup in minutes with WordPress or in months with epic technologies.

Even if the design is not your problem anyway you may need someone to keep it constantly updated and fix any random issue.

The itWikiCon 2020's website was developed by a volunteer investing 30/40 hours of work.

20$–60$
/ hour 		600$–2,500$ 0$
Post-production Before publishing some videos they should be prepared with all the appropriate bows and ribbons.[45]

We had about 36 sessions. Let's say about 23 hours of video. Usually companies ask $100–130 for each video-hour.

For the itWikiCon 2020 we managed post-production with volunteers. Well, without particular haste.[46]

100$–130$
/ hour 		2,000$–3,000$ ??
Video direction You may want to pay that professional figure responsible of what goes on-air in streaming.

For the itWikiCon 2020 we had one volunteer using its hardware and setting up his girlfriend's bedroom to manage the video direction for both tracks of both days for nearly 18 hours in the week-end.

10$–40$
/ hour (18) 		180$–700$
 0$
Total 5,350$–11,100$ ? 3,780$ ?


Notes

edit
  1. ↑ a b The risk for participants of online conferences is to be not entertained or even being stressed and fatigued. It's up to us to try to design a good environment as much cozy and fun as possible for your participants.
  2. ↑ See the Wikimedia technology page to discover how to respect user's freedoms and why
  3. ↑ Having said it's easy to underestimate the skills needed to orchestrate all the involved technologies in this area, you can organize this. I believe in you.
  4. ↑ A well-designed online conference should scale from 100/1000/10000/100000 visitors without redesigning it from scratch at every need.
  5. ↑ Few people means 1, 10, 20 but not 100.
  6. ↑ Lot of people may means more than 100.
  7. ↑ When people want to see the conference again, you will need to involve some solutions to cover decent-quality recordings, with some fallbacks. Keep in mind also lot of time in post-production, upload, ecc.
  8. ↑ Try to merge Wikimedians with local technical communities. You may need all the possible help to overcome technical issues and keep your conference respectful of user's freedoms. Allow your online event to become the revenge of the nerds.
  9. ↑ To achieve the 100% free/libre goal the itWikiCon 2020 was organized in partnership with the (Italian) Italian Linux Society. That is a network of local GNU/Linux users groups. You can surely find something similar in your zone. If not, create one.
  10. ↑ a b c The itWikiCon 2020 operated with the technological partnership of the GARR. This non-profit Italian academic & research network offered their epic infrastructure to feel inside a fortress. Something like:
    *zap zap zap* look at the bits of the itWikiCon flowing across backbones and routers and reaching every cabinet! *zap zap zaaap* Shooting free knowledge! Be free! *zap* *zap* Awww yes! I feel the POWER!
    That feeling.
  11. ↑ Anyway, even if you can organize a conference without a laser-cannon, you can have lot of fun with one. Try to get in touch with potentially interested local service providers: you may just fail and play with standard toys, or you may be surprised by that collaboration and have something epic.
  12. ↑ Legend of elements in the above picture:
    1. link to join the conference as active participant (a link to BigBlueButton)
    2. embedded streaming service (handled by the video director who alternates the BigBlueButton streaming with fixed texts and musics and other information)
    3. embedded chat service related to the current room
    4. open the chat in an external tab (can be useful)
    5. open the generic chat related to the whole conference
    6. link to the Friendly Space Policy
  13. ↑ a b Instead of BigBlueButton you can also adopt Jitsi Meeting that is simpler, but think about all the awesome moderation features you may need provided by BigBlueButton as default.
  14. ↑ a b There are some providers offering BigBlueButton and sometime also at no costs. This may be the case of some local no-profit organizations or some local service providers. Anyway you can install BBB on your own server. Note that the Wikimedia Foundation is talking about hosting BBB in their infrastructure here: phab:T249750
  15. ↑ a b c Note that a generic Wikimedia wiki is probably not suitable to be used for an online conference because of some restrictions applied by Wikimedia Foundation to protect you. For example you cannot embed whatever external video or a chat in Meta-wiki for some serious security concerns that, well, will be not questioned and removed just for your conference.
  16. ↑ We spent lot of time in the content management system used for our website https://2020.itwikicon.org/. The resulting software is quite complete and robust but deserves further documentation. Its source code is actually in https://gitpull.it/source/itwikicon-conference/. If you are interested in it, contact its maintainer.
  17. ↑ a b c It is not necessary to pay an external service provider to host your new website. Note that Wikimedia Foundation provides Toolforge that may be a valid shared hosting service to put some static HTML or using PHP7 or some other well-known web programming languages.
  18. ↑ Random participants usually just want to click on a player and see what happens without much instructions.
  19. ↑ a b c (Italian) Dirette video con NGINX e OBS Studio - a simple do-it-yourself RTMP server and example with Open Broadcaster Software
  20. ↑ We adopted https://chat.linux.it that was our Rocket.Chat instance but there are a lot of good solutions lice cute web IRC clients.
  21. ↑ See the #video direction section for further implementation details.
  22. ↑ It's not that bad to try to track down all the apparently weird ideas that may improve your conference. It does not matter how much cards you have in your deck if you can just start drawing the most clear and feasible one and start from there.
  23. ↑ It should be really easy for everyone to pick one of the ideas and determinate if you have everything to start working on it.
  24. ↑ Try to write down somewhere what you are doing and how. This will be useful both to your actual coworkers and also for future ones.
  25. ↑ Have you worked on something for a while? Show your progress to the others of your team, to discover if something can be improved even more. Also this will be a good point to track the next priorities.
  26. ↑ There is nothing wrong in writing down that you cannot do that now.
  27. ↑ Anyway we are a volunteers: we can afford to wish for something and fail.
  28. ↑ Write down somewhere the reasons of your deadlock when you cannot proceed. Maybe the idea is not clear at 100%. Maybe the idea requires too much time, more volunteers, some external skills, etc.
  29. ↑ Explain your issue. A great issue may deserve a great solution. People may love your challenge and help you. Remember that we are volunteers and it's nasty to say you! fix this before tomorrow.
  30. ↑ But to be honest with Phabricator we were almost playing.
  31. ↑ It is more difficult than expected to create inclusive events, because when a decision-making group is created, other people feel excluded.
  32. ↑ a b Do not replicate at home.
  33. ↑ Do not try to host an RTMP server by yourself adopting your 9$ single-board computer connected to the Wi-Fi of the garage of your neighbor. Here the computation and bandwidth matters.
  34. ↑ If you can't deploy your own RTMPblabla server, whatever it means, you can just use some well-known social networks who exactly offer this stuff when you want to do a live video.
  35. ↑ Just do not forget your microphone opened while you are streaming the conference on-air. Even better to avoid any kind of mistake and just do not sing alone in the control room.
  36. ↑ Seriously. Video directors will be kidnapped in front of their workstation for the whole duration of their track. Remember to feed and hydrate your video directors or they will just die as heroes for the sake of your event.
  37. ↑ About reinventing the wheel: Have you ever tried to tell a singer to stop making love songs since we're full of love songs? Uhm?
  38. ↑ The itWikiCon 2020 website content management system was the itwikicon-conference. It's a GNU AGPL project made in PHP/MariaDB like MediaWiki.
  39. ↑ The website was based on the suckless-conference framework used for other conferences.
  40. ↑ Another dependency for the website was suckless-php. It is another dummy framework for websites.
  41. ↑ To dress the site in less formal clothes we adopted a free software frontend framework called Materialize CSS somehow based on Bootstrap and Material Design.
  42. ↑ Note this may cause some more hysterical bandwidth consumption to be taken into account.
  43. ↑ https://www.gnu.org/philosophy/javascript-trap.html
  44. ↑ Citing the itWikiCon 2020 storage:
    these contents are served from some secret drives on a secret RAID on a secret single board computer hided in a secret storage closet attached to the Wi-Fi access point of my girlfriend (ehm... I love you!) under her firewall, under NAT, but exposed to you via a secret encrypted proxy using a reverse SSH tunnel. In short, welcome in a low-cost, low-bandwidth, low-reliability, big-capacity Internet node deployed nowhere. It sounds freaking awesome? It is.

    In short, do not replicate our nerdy solution at home. Pay these 10$ / year. Well, or drop everything on one random proprietary social network full of advertising.

  45. ↑ Someone should take each video and clean it with a video editor. This means cut, insert an introduction splash screen with the title, cite mentors, put jingles, fade-in / fade-out, put final credits, etc. Trust me, this, plus rendering, take lot of time. Accept a tip: pay someone for this.
  46. ↑ Without being particularly proud of this energy consumption, we really suggest to do not do this by yourself if you wish to have lot of video recordings.

See also

edit
edit
Retrieved from "https://meta.wikimedia.org/w/index.php?title=ItWikiCon/2020/Under_the_hood_of_a_cozy_online_conference&oldid=27845217"