La cascade

Ce workshop vise à faire découvrir les pratiques créatives de programmation pour le web. De manière très simple, cet atelier est l'occasion d'apprendre à programmer une page web artistique à l'aide des langages HTML et CSS. N'ayez pas peur de tomber dans la cascade, plongez !

Inventez votre zone autonome temporaire, votre île. Créons un archipel localisé dans le web. Cet espace d'existence instantanée est notre refuge.

Déroulé

Lundi

Présentation du workshop [références] + Initiation au langages HTML et CSS.

Consigne 1

Imaginez le paysage d'une île fictionnelle paradisiaque, cauchemardesque, grandiose, etc. Réfléchissez à sa taille, sa topologie, sa toponomie, sa végétation, ses villes, ses villages, ses routes et chemins. Dessinez sur le papier cette île [cartographie, vue panoramique, détail de paysage etc.]. Ensuite vous devrez décrire ce dessin avec des instructions précises et simples en imaginant qu'elles doivent être traduites en langages HTML et CSS.

exemple : Cette île est de forme ovoïde et occupe le centre de ma feuille ;

Mardi

Consigne 2

Les instruction que vous avez rédigés, sont redistribués à un·e camarade qui n'a pas vus votre dessin.
Vous possédez les instructions de votre camarade. Réalisez à l'aide du HTML et du CSS une page web représentation de l'île pensée par votre camarade.

Mercredi

Développement des pages et accompagnement

Jeudi

Consigne 3

- Il est temps que vous rendiez le travail réalisé — pour faire émerger l'île de votre camarade — lisible, modifiable et documenté. Il est temps que vous retrouviez votre île. Vous avez toute la matinée pour commenter [annoter, expliquer] le code que vous avez rédigé . Une fois cette étape réalisée, remettez l'île dont vous aviez la charge à sa·on créateur·ice.

- Après avoir récupéré votre île, vous devrez ajouter, modifier les espaces manquants et améliorer celle-ci. N'oubliez pas, ce travail est collaboratif, ne soyez pas tyrannique, n'effacez pas tous les efforts fournis par vos collègues.

Développement des pages et accompagnement

vendredi

Mise en commun des pages sur une page d'accueil
Restitution

Prérequis
Télécharger un éditeur de code.

VS codium [outil libre] ;
VS code ;
Sublime text ;
Pulsar ;
Pour générer un template HTML et CSS de départ https://lab.raphaelbastide.com/minutehack/

Références :

Hugo Hilaire et Lucien Prunenec, Au raz des rocs, https://aurazdesrocs.ccctrl.cc/ ;
Lena Weber, https://lenaweber.com/ ;
Yehwab Yen Song, https://www.yhsong.com ;
Raphaël Bastide, Where fears hide, https://where-fears-hi.de/ ;
Adel Faure

Ressources :