webconf, vidéoconférence Jitsi & co

LA solution WebRTC de référence

Pascal Kotté
QuickLearn
13 min readMar 30, 2020

--

Tu veux la version courte, pour 2 personnes? De suite? Clic Ici

Sandrine nous expose une réflexion qui nous plonge dans nos réflexions avec l’espace CoWorking/BestLiving/Transition du HUB-ne.ch (hub neuchatel)

Bon la prochaine fois qu’on prendra une photo, il faudra dire “sourire” — Mais c’est vrai qu’avec le virus couronné

Quand vous voyez ce genre d’écran, il y a 8 chances sur dix, que ce soit sur une base Jitsi. La fiche Wikipedia française est un peu incomplète, voir la version anglaise, car désormais, c’est un des clients WebRTC libre (open source) de référence.

L’avantage du libre, c’est que tout le monde peut le réutiliser, justement.

Voici la liste des serveurs WebRTC Jitsi libres d’utilisation, en Suisse:

26 mars 2020 : Framatalk n’est plus en surcharge d’utilisation
Pour faire face à l’augmentation de l’utilisation des Framatalk par les confiné·es, notre équipe technique a réalisé un travail d’optimisation logicielle, de redimensionnement de l’infrastructure technique et de répartition des demandes parmi un ensemble d’hébergeurs éthiques et solidaires. Merci pour cet effort partagé.
Framasoft n’est pas un service public, et ne souhaite pas s’y substituer. C’est une association loi 1901 dont les services sont des ressources communes. Ils peuvent être utilisés par des personnes qui, souvent, n’ont pas d’autres moyens (dont des malades isolé·es de leur famille). Prenez soin de ne pas monopoliser cette ressource afin qu’elle reste partagée 😉.
UPDATE 2021: Firefox est supporté désormais!Et pour les CHATONS en Suisse, souscrire ici: www.OpenRomandie.ch

Nous avons un acteur majeur WebRTC en Suisse romande avec Free-solutions (Claude Stabile) depuis des années. Le serveur Jitsi de Tech4good.ch est aussi sponsorisé et hébergé chez free-solutions, qui assure des installations mutualisées ou dédiées, avec des outils avancés de coopération, messagerie et partages par équipes, plus d’infos ici [TK à venir]… Contacter notre association si besoin de faire le vôtre, ou bien rejoindre le crowdfunding en Suisse, avant son lancement, mais surtout avant la fin: http://HerosLocaux.ch/openromandie avec OpenRomandie. [plus d’info? http://callme.kotte.net]

Conditions Avantages techniques

Sur les autres solutions Zoom, Skype, Webex, etc…

Voici un article plus détaillé sur les offres du marché:

Spécifications pour https://vidconf.tech4good.ch/ et de façon générale aux dernières versions de Jitsi.

Cette solution a été retenue par Open Romandie, les conseillers numériques d’ICT-a.ch, par LiiP aussi, et par plein d’autres acteurs en et hors Suisse romande.

  • permet d’assurer la connexion de postes dans les 3 types de systèmes (Windows, Macintosh, Linux)
  • Sans requérir l’installation d’un logiciel client spécifique ni de disposer des droits “admin”
  • La solution (et celle de Free-solutions, webconf et Switch) réside en Suisse et garantie la confidentialité des sessions, et se trouve donc sous juridiction en Suisse. (Sauf Raksha, pas certain car on sait pas qui c’est)

Toutefois, elle nécessite :

  • Un navigateur web Internet (Browser) compatible avec le standard WebRTC à base Chromium comme Google Chrome, Opera, et la version Chromium de Microsoft Edge, ainsi que Firefox (enfin!).
    Safari d’Apple et iPad et iPhone, ne supportent pas encore la pleine compatibilité WebRTC. https://fr.wikipedia.org/wiki/WebRTC
  • Que le réseau puisse accéder au port standard WebRTC 10000 (UDP) sur Internet, et multiples ports standards et normalement ouverts.

Tutoriel, Manuel d’utilisation

Tuto vidéo (exemple sur Suricat.tv, idem sur les autres serveurs)

https://www.youtube.com/playlist?list=PL7zQ4pEEwtfbW3Xatt036BgFoH3wIDV0b (il y aussi une seconde vidéo pour plus de configuration sur c elien)

Ce n’est pas exhaustif, mais c’est suffisant, merci à Tracim…

Mode opératoire de base (blogué)

Ouvrir une session Internet sur l’URL de ton serveur Jitsi: exemple https://vidconf.tech4good.ch/MonCodeAmoi en remplaçant MonCodeAmoi par un truc perso et si tu deviens le premier de la salle virtuelle, tu en deviens l’animateur (avec la petite étoile en bas à droite sur ta vignette)

Cela évite de passer par la page d’accueil, et de créer une salle directement (ou la rejoindre si pas vide) — En plus c’est pratique, tu peux la mettre en favori!

ATTENTION: Que des Lettres, chiffres, -, _ ou . Pas d’accents, et les majuscules/minuscules seront équivalents, les @ sont supprimés.
Le premier de la salle en devient l’animateur! ⭐ (l’étoile en bas à droite)

On va t’expliquer tous les trucs après ;-)

Dès maintenant, tu peux l’utiliser sans regarder la suite!

Enjoy e-Meeting et webconf! 😄

Tu as besoin de tout savoir avant de jouer? OK, c’est à la suite… [Pour référence: Plan d’entraînement/formation]

Utilisation depuis un mobile

  • iPhone, iPad, uniquement en passant par un client Jitsi Meet, à configurer sur le serveur https://vidconf.tech4good.ch/ (ou bien le nom de ton autre serveur) — Faut pas demander à Apple d’être compatible et standard 😡
  • Android nativement avec un navigateur Chrome, et généralement le navigateur qui est intégré (99% une base chromium), en standard 😁
Tu tapes ou cliques sur le lien reçu, avec la bonne URL de la salle virtuelle à rejoindre, et c’est tout!
Alors première chose, tu vas te mettre en plein écran: Menu … (1) View full screen (2)

NB: Le petit chiffre bleu (8️⃣) indique 8 messages non lus dans le ‘chat’(flux de messages). Ici, la salle rejointe conserve ses messages, d’où leurs présences, mais fais gaffe, les salles gratuites purgent tout à la fin, alors penses à copier tes notes dans le “chat” avant de quitter (si tu en as besoin)!

Si tu es allergique à l’anglais, tu peux passer en germain, spanish, pas FR 🤐

Menu … (1) Settings (2) More, Language, et je peux pas dérouler depuis un smartphone 😭, cela fonctionne bien depuis un ordinateur 😁

NB. Certains serveurs vont t’imposer d’installer le client Jitsi.meet, y compris sur un mobile Androïd, c’est ainsi, pas toi qui décide quand c’est le serveur d’un autre (demande-nous de te faire le tien propre www.OpenRomandie.ch ;-)

Mais c’est bien aussi, avec l’application cliente, tu pourras changer la langue en français cette fois!

Par défaut, l’application est configurée pour utiliser le serveur US http://meet.jit.si/ et il faut donc le changer pour mettre le bon serveur chez toi ou chez nos serveurs mis en libre accès public en Suisse: ex. https://vidconf.tech4good.ch/ (Settings/Paramètres: URL server)

Avec le client “Jitsi Meet”, sur Andoïd comme sur iOS (iPhone, iPad), il se met normalement tout seul dans la langue configurée sur ton smartphone.

Au lancement initial, tu dois lui indiquer le nom de la “salle” virtuelle que tu veux rejoindre (et si tu te rates, tu vas en créer une autre, vide…)

Rappel: Pas d’accents ni d’espaces!

Dès que tu entres dans une salle tu seras en connexion avec les participants avec ou sans la caméra si tu as pris l’option ‘voix’

Sur le mobile, en mode “Tile” (mosaïque) là on est seulement 2! Un Androïd et un Opera!
On peut basculer sur le smartphone du mode “tile” (Mosaïque) au monde “normal” et faire défiler les participants sur la droite, pour sélectionner celui à visionner, celui qui parle est censé s’afficher tout seul.
Sur le Smartphone: Menu ... (superposés), "More options" (oui même en langue française 😣), "Quitter le mode mosaïque"

Le nombre de participants en mode vidéo va être plafonnée (9 par défaut), et la vidéo s’activera pour celui qui parlera, mais nous pouvons créer des salles de 30 à 50 personnes… Ou plus sur un serveur dédié. Claude Stabile annonce 500 à 1000 personnes sur un vieux serveur reconditionné, voir plus… (Mais 1 à 10 Gb sur ton accès Internet!) — On peut réduire les performances pour plus.

En mode mosaïque sur l’ordinateur — On peut le quitter en désactivant le petit damier de 4 🔳, 3ème bouton du bas en partant de la droite.
Affichage en mode normal, avec 4 personnes.

Réglages utilisateur de base (1ère choses à faire)

Changer la langue?

  1. Menu …
  2. Settings
  3. More
  4. Language
  5. French pour le français (ou autre)
  6. OK
Tu peux dérouler l’ascenseur des langues avec la roulette de la souris (dommage que cela ne déroule pas sur le mobile: TK penser à chercher ou en faire le “feature request”…)

Récupérer le bon lien (URL) pour l’invitation

  • Tu peux déterminer le nom de cette “salle” à l’avance, mais assures-toi qu’elle soit bien “vide”, en la conservant ouverte au plus tôt.
  • Tu devrais inclure l’URL d’invitation dans l’agenda,dans l’email, et dans le SMS, https://vidconf.tech4good.ch/pkotte pour que les gens puissent facilement la retrouver…
  • Tu peux la copier depuis la barre d’adresse de ton navigateur, ou bien via le second bouton (ℹ) en partant de la droite.

Te présenter au collectif! Ton nom + bonjour!

  1. Tu cliques au milieu de ta vignette (à droite ou dans la mosaïque)
  2. Tu changes le nom pour mettre ton pseudo, ton prénom, ou comment les autres doivent t’appeler (si nombreux prénoms identiques, penses à mettre la lettre de ton nom de famille par exemple, ou ton organisation ‘Pascal de LiN’)
ChangeMe est parfois le nom par défaut, mais c’est pour que tu ne le laisses pas, et le change!

Et on peut dire bonjour aux nouveaux arrivants (par un signe de la main pour pas couper celui qui cause). Mais pour celui qui vient d’arriver, il est de bon aloi, de venir se présenter dans le “fil du chat” (et cela se prononce ‘tchat’): Je traduis: dans la fenêtre de discussions écrites avec les messages courts!

  1. Tu actives le (tchat) quand il y a des messages “non lus” pour les voir
  2. Ou pour venir te présenter et dire bonjour, quand tu arrives (tu peux poser l’URL de ton blog ou ton organisation, ou ton projet…)
Et si tu ne veux pas passer pour un “Blaireau”, tu penses à changer ton “nom”! Sinon ce sera “ChangeMe” qui va se présenter aux autres… Je vais d’ailleurs changer le nom par défaut “ChangeMe” pour mettre “Blaireau” à la place ou “Bamby”, mais ce ne sera pas cool pour les usagers sur mobiles, les pauvres…

Bonnes pratiques!

  • Désactiver le micro quand on ne parle pas (il existe des gadgets “push to talk” pour forcer à rester en mode silencieux et activer volontairement le mode “je parle”)
  • Lever la main pour prendre la parole (2nd icône en partant de la gauche), et finalement prendre la parole car personne n’a vu que tu avais levé la main, en faisant gentiment remarquer que cela fait 5mn que tu avais le bras en l’air et que tu commençais à fatiguer 😋. (Tu peux aussi le faire réellement devant la caméra, c’est plus visible que la petite bulle bleue). C’est mieux si la personne qui anime et donne la parole est clairement définie au départ, mais techniquement, c’est la personne avec la petite étoile ⭐. Si ce n’est pas la bonne personne, c’est ballot, il faut que tout le monde raccroche en même temps la session, sauf la bonne personne animatrice, pour y revenir 10 secondes après. Elle devrait alors avoir récupéré l’⭐. L’animateur est censé entrer un peu en avance, et en premier! [à noter que sur le site http://meet.jit.si aux US, le problème a été réglé en donnant tous les droits à tout le monde — Tout le monde peux rendre silencieux les autres, voir les “jeter” de la session — Pas sûr que ce soit une super bonne idée avec certaines cohortes d’apprentissage!]
  • Penser à réactiver le micro, quand tu parles!
  • Empathie: Proposer à ceux qui apparaissent en “rouge” et ne doivent pas “capter” grand chose de la conversation, de basculer en mode “bande passante réduite” pour améliorer son entente, et son écoute… Sinon, plus simple: Tu coupes la caméra! C’est encore le + efficace.
  • L’animateur doit utiliser son pouvoir de faire taire “mute”, le ou les interlocuteurs bruyants (bug double micro, effet Larsen, fonds sonores…) et soit l’annoncer vocalement, soit sur le ‘chat’ pour que la ou les personnes (‘private message’ le cas échéant) qu’elle doit réactiver son micro quand elle prendra la parole, et la remercier de penser à le couper, quand c’est fini. NB. La fonction “mute everyone else” doit être utilisée sur la vignette de la personne qui doit prendre la parole afin de faire taire toutes les autres.

Gérer la session

  • Pour la rejoindre il faut ouvrir l’URL de son adresse dans un navigateur compatible “Chromium”
  • Pour la quitter tu cliques sur le gros bouton rouge du milieu “Raccrocher
  • Tu peux activer ou désactiver ton micro comme ta caméra.

NB. Il est nécessaire de les avoir autorisés dans le navigateur, qui va te demander une confirmation pour le micro, comme la caméra. Et si as dis non par réflexe, c’est bien, mais il va te falloir raccrocher et revenir pour dire d’accord cette fois… Sinon cela ne va pas être facile de te voir ou de t’entendre…

Le micro On/Off, Raccrocher, La caméra On/Off

Réglages pour optimiser la qualité

Activer le mode “bande passante réduite sur le client”

Mobile: Menu … “Activer le mode bande passante réduite” — Ordinateur: Menu … “Manage video quality”
  • Sur le mobile, cela va désactiver ta caméra, et l’image reçue sera plutôt minable, mais au moins, tu devrais avoir plus de chance d’entendre, et de te faire entendre.
  • Sur l’ordinateur: Tu peux tenter de graduellement diminuer pour passer de HD vers SD, voir directement comme pour le mobile, basculer en “low bandwidth” (faible bande passante), alors cela désactivera ta caméra. Si tu es le présentateur, et que tu vas devoir montrer quelque chose depuis ton écran que tu vas partager, et bien il sera plus judicieux de ne pas descendre en dessous de SD (Moyenne Définition), voir rester en HD si écritures…

Actions collectives manuelles:

En cas de baisse de qualité par manque de “bandes passantes” (icone de débits en haut à gauche des vignettes sont normalement verts, ils passent au jaune, ou rouge: Perte de signaux)

  • Désactiver toutes les caméras inutiles pour libérer de la “bande passante”
  • Pensez à couper les micros quand vous ne parlez pas ou plus. (Et le réactiver en prenant la parole, si possible sur invitation de l’animateur, avec la main levée par le bouton et l’icône bleu)

Cela permet d’éviter de demander à tout le monde d’activer le mode “bande passante réduite” et ce qui revient au même, à peu près.

Les fonctions avancées

Le partage d’écran

Il est possible de partager un des écrans (si on en a plusieurs) une des fenêtres d’une application, voir un onglet dans le navigateur web Opera ou Chrome (ou Edge).

TK

Partager une vidéo Youtube

Pas de bol, marche pas avec Peertube.ch :( Mais c’est OK avec des vidéos Youtube…

Lister les intervenants dans la session

Speakers stats… Et non, tu peux pas faire copier/coller du texte, obligé de faire un “screenshot”…

Debug:

Pas d’image (émise)

TK

Pas de son (reçu)

TK

On m’entend pas (pas de son émis)

TK

Si le microphone fonctionne, puis plus:

  • Le réactiver en passant par le menu “Settings” (ou paramètres) dans le menu … en bas à droite.
  • Brancher votre portable sur le secteur (surtout les macs)

En cas de dysfonctionnement

Me tenir informé de toutes les difficultés rencontrées, avec mes remerciements. Pascal.KOTTE@CloudReady.ch

Autres versions de Jitsi avec les serveurs de démo de webconf.ch et Switch:

Tu remplaces MonCodeAmoi avec un truc perso!

Autres tutoriels de collègues sur le web:

— Annexe pour les plus Geeks de nos lecteurs uniquement…

Et Firefox alors? 😭 — OK résolu! 😍

C’était un comble, la navigateur parmi les premiers à avoir mis en oeuvre des fonctionnalités WebRTC, ne semblait plus correctement compatible: 2013/2014

Et puis depuis la version 49 (2016/2017) Firefox Hello, c’est fini

Et donc pendant tout 2020, impossible de faire fonctionner correctement jitsi avec Firefox, mais c’est désormais corrigé.

Quand aux alternatives citées:

  • Talky ok mais pubs et partage d’écran qui ne marche pas toujours,
  • Appear.in c’est fini, c’est devenu whereby.com (sur Amazon AWS) merci Marie-Pierre Vidonne
  • webex a été racheté par Cisco, font des trucs cools, mais pas libres,
  • Le site Jitsi (le contributeur principal du code source) reste libre, mais toujours US — C’est le serveur qui est configuré par défaut sur multiple solutions

C’est “open source” et libre, et donc on peut se faire nos propres serveurs Jitsi.

C’était quoi le problème avec Firefox ?

Ben j’ai pas trop regardé… Si tu as des infos, je suis preneur!

2020–03–19: Damencho

Chrome has simulcast enabled, which is missing in Firefox and this is the main big difference and that’s why chrome will be the recommendation. There used to be performance issues with Firefox, but this got fixed by the mozilla team at some point.

Et j’ai beau activer les options webrtc, cela ne passe pas avec la dernière version de Jitsi, et pas non plus en p2p sur Meet.jit.si
Firefox sur d’autres instances de Jitsi, cela passe encore, avec pas mal de ressources côté client (CPU et bande passante, bien plus qu’avec une base Chromium), mais avec certaines instances de Jitsi, cela bloque audios et vidéos complètement, comme avec du vieux Edge (pas encore chromiumisé)

--

--

Published in QuickLearn

Le numérique accessible, à tous ! Formations accélérées, mais sereines.

Written by Pascal Kotté

Réducteur de fractures numériques, éthicien digital, Suisse romande.