# Site internet et plan de Comm

# Read-me API comm



# Read-me site internet 2.0



# Plan de Comm mensuel

#### Plan de comm Actuel

<p class="callout info">*On a prévu un magnifique programme avec plein d'activités : comment le rend visible ?*</p>

- [ ] Affiche Canva
- [ ] Affiches physique au fablab (4 A3 et 10 A4 pour relais)
- [ ] Insertion Png et PDF de l'affiche dans la page actualité du site (ftp)
- [ ] Programmation affiche 
    - [ ] Facebook
    - [ ] Insta
    - [ ] Linkedin
    - [ ] X
    - [ ] Mattermost
- [ ] Rappel semaine via meta business suite
- [ ] Evenement Facebook
- [ ] Evenements Infolocale
- [ ] Evenement Portail asso ville (ne pas oublier de se logger [ici](https://wiki.fablab-lannion.org/associations.lannion.bzh/accueil))
- [ ] News letter via mailjet (ne pas oublier de mettre à jour les contacts via Hiboutik)

#### Nouveau plan de comm !

# Réels : transformer un png en video automatiquement

#### **Création d'un réel : transformer un png en vidéos de 5 secondes automatiquement avec FFmpeg**

<p class="callout info">Pourquoi on s’embête à faire ça ?  
==&gt; une publication du fablab est en moyenne vue 20 fois, un réel : plus de 300 fois !</p>

####   
[![image.png](https://wiki.fablab-lannion.org/uploads/images/gallery/2026-06/scaled-1680-/cZ014EFa562rAUQQ-image.png)](https://wiki.fablab-lannion.org/uploads/images/gallery/2026-06/cZ014EFa562rAUQQ-image.png)  


1. Coller son .png dans un dossier
2. Le renommer en en image.png
3. ouvrir le terminal depuis le dossier

```bash
sudo apt  install ffmpeg
ffmpeg -loop 1 -i image.png -c:v libx264 -t 5 -pix_fmt yuv420p -vf "split[bg][fg];[bg]scale=1080:1920:force_original_aspect_ratio=increase,crop=1080:1920,boxblur=20:20[bg_blurred];[fg]scale=1080:1920:force_original_aspect_ratio=decrease[fg_scaled];[bg_blurred][fg_scaled]overlay=(main_w-overlay_w)/2:(main_h-overlay_h)/2" output.mp4
```

##### Comment ça fonctionne ?

- `-loop 1 -i image.png` : Boucle l'image unique pour en faire une vidéo.
- `-t 5` : Fixe la durée de la vidéo à **5 secondes** (tu peux changer cette valeur).
- `-vf "..."` : Il sépare l'image en deux (`split`). Il prend l'arrière-plan (`bg`), l'agrandit, le recadre en 1080x1920 et lui applique un flou (`boxblur`). Ensuite, il prend l'avant-plan (`fg`), l'adapte pour qu'il rentre proprement dans le cadre, et le superpose au centre (`overlay`).
- `-pix_fmt yuv420p` : Assure une compatibilité maximale avec les smartphones et Instagram.

##### solution clés en main

<p class="callout success">Un dossier tout près à décompresser/utiliser ==&gt; [FFmpegisation.zip](https://wiki.fablab-lannion.org/attachments/33)</p>

# Générateur de programme

#### Le logiciel en question

Le programme qui suit a été conçu par Ewan Fougeyrollas, stagiaire en CIEL, que le Fablab remercie !  
Ce soft sert à créer et agencer automatiquement le programme mensuel des activités.  
Il suffit de saisir quelques données par activités, comme :

- Date / heure
- Titre[![image.png](https://wiki.fablab-lannion.org/uploads/images/gallery/2026-07/scaled-1680-/1OGdaoxd1QrrQoJ0-image.png)](https://wiki.fablab-lannion.org/uploads/images/gallery/2026-07/1OGdaoxd1QrrQoJ0-image.png)
- Contenu
- Photo
- ...

Le soft va alors être en capacité de faire 2 choses :

- Exporter en .png pour une version imprimable
- Exporter en JSON pour saisi dans le site

Le contenu du JSON doit être collé dans la page GitHub sur site internet, comme suit :

[![image.png](https://wiki.fablab-lannion.org/uploads/images/gallery/2026-07/scaled-1680-/cRqXCJtwCUm18ZlD-image.png)](https://wiki.fablab-lannion.org/uploads/images/gallery/2026-07/cRqXCJtwCUm18ZlD-image.png)

<p class="callout success">une fois sauvegardé (et une fois que Github aura eu le temps de faire la mise à jour) : La page "Accueil" du site contiendra les ateliers "Cette semaine au fablab" et le programme complet apparaîtra dans la page "Actualités".</p>

---

#### Comment l'installer ?

Vous trouverez le .zip ici ==&gt; [fablab-planningV3.0.zip](https://wiki.fablab-lannion.org/attachments/35)   
ou sur le Github du Fablab ici ==&gt;

##### 🪟 Windows

Première utilisation

1. Installe Node.js → [https://nodejs.org/](https://nodejs.org/) (version LTS)
2. Double-clique sur `installer.bat` (2-3 minutes)

Utilisation quotidienne

Double-clique sur `demarrer.bat` → Le navigateur s'ouvre automatiquement sur l'éditeur

---

##### 🐧 Linux

Première utilisation

```
chmod +x installer.sh demarrer.sh
./installer.sh

```

Utilisation quotidienne

```
./demarrer.sh

```

[![image.png](https://wiki.fablab-lannion.org/uploads/images/gallery/2026-07/scaled-1680-/5YZemhdbemonL5Ox-image.png)](https://wiki.fablab-lannion.org/uploads/images/gallery/2026-07/5YZemhdbemonL5Ox-image.png)

---


##### ⚠️ Important

**Ne jamais** ouvrir `fablab-planning-editor.html` en double-cliquant.

Toujours passer par `demarrer.bat` (Windows) ou `./demarrer.sh` (Linux).

---

##### Contenu du dossier

<table id="bkmrk-fichier-r%C3%B4le-fablab-"><thead><tr><th>Fichier</th><th>Rôle</th></tr></thead><tbody><tr><td>`fablab-planning-editor.html`</td><td>Éditeur visuel</td></tr><tr><td>`server.js`</td><td>Serveur Node.js + générateur PNG</td></tr><tr><td>`package.json`</td><td>Dépendances</td></tr><tr><td>`payload-juin-2026.json`</td><td>Exemple de planning Juin 2026</td></tr><tr><td>`installer.bat` / `installer.sh`</td><td>Installation (Windows / Linux)</td></tr><tr><td>`demarrer.bat` / `demarrer.sh`</td><td>Démarrage (Windows / Linux)</td></tr></tbody></table>

---

---

#### Feuille de route pour l’évolution du logiciel 

Restera à faire :

- [ ] Communication en direct (Via JSON) avec les API de Meta and co pour créer les évènements automatiquement
- [ ] Changer couleurs texte pour lisibilité
- [ ] passer les photos à gauche dans les tabs
- [ ]