PerfoTaller - 20/03/26: Altranet. Laboratori d'activitats i pensament crític per sobreviure col·lectivament a la caiguda d'internet comercial.
En# aquesta perfo-taller, Spideralex i B01 presentaran Altranet, un laboratori per entendre com desapareixerà l'internet comercial, aprofundir en allò que perdrem quan això passi i explorar altres protocols tècnics per comunicar-nos. Una col·laboració Donestech + Startdown Lab.
<!DOCTYPE html><html lang="es"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Altranet — Taller</title> <link href="https://fonts.googleapis.com/css2?family=Space+Mono:ital,wght@0,400;0,700;1,400&family=Playfair+Display:ital,wght@0,700;1,700&display=swap" rel="stylesheet"> <style> :root { --bg: #0a0a08; --bg2: #111110; --green: #b8f542; --amber: #f5a623; --pink: #ff6b9d; --white: #f0ede6; --muted: #6b6b60; --border: #2a2a24; --mono: 'Space Mono', monospace; --serif: 'Playfair Display', Georgia, serif; }
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { background: var(--bg); color: var(--white); font-family: var(--mono); font-size: 14px; line-height: 1.7; overflow-x: hidden; }
/* NOISE TEXTURE */ body::before { content: ''; position: fixed; inset: 0; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E"); pointer-events: none; z-index: 999; opacity: 0.4; }
/* HEADER */ header { border-bottom: 1px solid var(--border); padding: 3rem 2rem 2rem; display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 2rem; max-width: 1100px; margin: 0 auto; }
.header-tag { font-size: 11px; color: var(--green); letter-spacing: 0.15em; text-transform: uppercase; margin-bottom: 0.5rem; }
h1 { font-family: var(--serif); font-style: italic; font-size: clamp(3rem, 8vw, 6rem); line-height: 0.95; color: var(--white); letter-spacing: -0.02em; }
h1 span { color: var(--green); }
.header-meta { text-align: right; color: var(--muted); font-size: 12px; line-height: 2; }
.header-meta strong { color: var(--amber); display: block; font-size: 13px; }
/* INTRO BAND */ .intro-band { background: var(--green); color: var(--bg); padding: 1rem 2rem; font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; overflow: hidden; white-space: nowrap; }
.intro-band span { animation: marquee 20s linear infinite; display: inline-block; }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
/* MAIN LAYOUT */ main { max-width: 1100px; margin: 0 auto; padding: 0 2rem 4rem; }
/* SECTION BLOCK */ .block { display: grid; grid-template-columns: 180px 1fr; gap: 0 3rem; border-bottom: 1px solid var(--border); padding: 3rem 0; }
@media (max-width: 700px) { .block { grid-template-columns: 1fr; gap: 1rem; } header { grid-template-columns: 1fr; } .header-meta { text-align: left; } }
.block-index { position: relative; }
.block-number { font-family: var(--serif); font-style: italic; font-size: 5rem; line-height: 1; color: var(--border); position: absolute; top: -1rem; left: 0; }
.block-time { font-size: 11px; color: var(--green); letter-spacing: 0.1em; text-transform: uppercase; margin-top: 4.5rem; display: block; }
.block-label { font-size: 11px; color: var(--muted); letter-spacing: 0.1em; text-transform: uppercase; margin-top: 0.4rem; display: block; }
.block-content h2 { font-family: var(--serif); font-style: italic; font-size: clamp(1.4rem, 3vw, 2rem); color: var(--white); margin-bottom: 1.5rem; line-height: 1.2; }
.block-content h2 .accent { color: var(--amber); }
/* ITEMS */ .item { background: var(--bg2); border: 1px solid var(--border); border-left: 3px solid var(--green); padding: 1rem 1.2rem; margin-bottom: 0.8rem; transition: border-color 0.2s; }
.item:hover { border-left-color: var(--amber); }
.item-title { font-size: 12px; color: var(--amber); letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 0.4rem; }
.item p { color: #c8c5be; font-size: 13px; line-height: 1.65; }
.tag { font-size: 11px; padding: 0.3rem 0.7rem; border: 1px solid var(--border); color: var(--muted); letter-spacing: 0.06em; text-transform: uppercase; transition: all 0.2s; }
.tag:hover { border-color: var(--green); color: var(--green); }
.tag.highlight { border-color: var(--pink); color: var(--pink); }
/* MESAS GRID */ .mesas { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 0.6rem; margin: 1rem 0; }
.mesa { background: var(--bg2); border: 1px solid var(--border); padding: 0.8rem 1rem; font-size: 12px; color: var(--green); letter-spacing: 0.04em; transition: all 0.2s; }
.mesa:hover { background: var(--green); color: var(--bg); }
.mesa .mesa-label { font-size: 10px; color: var(--muted); display: block; margin-bottom: 0.3rem; text-transform: uppercase; letter-spacing: 0.08em; }
.mesa:hover .mesa-label { color: var(--bg); opacity: 0.6; }
/* NOTE BOX */ .note { background: #0f110a; border: 1px solid #2a3a1a; border-left: 3px solid var(--green); padding: 1rem 1.2rem; margin-top: 1rem; font-size: 12px; color: #8aaa6a; font-style: italic; }
/* PERFORMANCE SECTION */ .perf-block { background: linear-gradient(135deg, #0f0a12 0%, #0a0a08 100%); border: 1px solid #2a1a3a; border-left: 3px solid var(--pink); padding: 1.5rem; margin-bottom: 0.8rem; }
.perf-block .item-title { color: var(--pink); }
.perf-block p { color: #c0b8c8; }
/* SCROLLBAR */ ::-webkit-scrollbar { width: 4px; } ::-webkit-scrollbar-track { background: var(--bg); } ::-webkit-scrollbar-thumb { background: var(--border); } ::-webkit-scrollbar-thumb:hover { background: var(--green); }
/* ANIMATE ON LOAD */ .block { opacity: 0; transform: translateY(20px); animation: fadeUp 0.5s ease forwards; } .block:nth-child(1) { animation-delay: 0.1s; } .block:nth-child(2) { animation-delay: 0.2s; } .block:nth-child(3) { animation-delay: 0.3s; } .block:nth-child(4) { animation-delay: 0.4s; } .block:nth-child(5) { animation-delay: 0.5s; }
@keyframes fadeUp { to { opacity: 1; transform: translateY(0); } } </style></head><body>
<header> <div> <p class="header-tag">// Programa del taller</p> <h1><span>Altr</span>anet</h1> </div> <div class="header-meta"> <strong>Calafou</strong> **Donestech × Start Down Labs<br>
Labs** · con B01 y la comunidad<br> · Calafou, L'Anoia
*Duración total: <span style="color: var(--green); margin-top:0.3rem; display:block;">≈ 2h 15 min</span> </div> </header>min*
<div class="intro-band"> <span> ★ internet feminista ★ redes comunitarias ★ comunicación sin internet ★ resiliencia digital ★ altranet ★ guifi.net ★ calafou ★ sneakernet ★ radio libre ★ código morse ★ autonomía tecnológica ★ ★ internet feminista ★ redes comunitarias ★ comunicación sin internet ★ resiliencia digital ★ altranet ★ guifi.net ★ calafou ★ sneakernet ★ radio libre ★ código morse ★ autonomía tecnológica ★ </span> </div>---
## 0. <main>Introducción *(5 min)*
**Bienvenida** a <!-- BLOQUE 0 --> <div class="block"> <div class="block-index"> <span class="block-number">0</span> <span class="block-time">5 min</span> <span class="block-label">Apertura</span> </div> <div class="block-content"> <h2>Introducción: <span class="accent">bienvenidas</span></h2>
<div class="item"> <p class="item-title">Presentación</p> <p>Bienvenida por partecargo de Spider y B01. Presentación del espacio y de la red Wi-Fi de la termita, la infraestructura local que habitamos en Calafou.</p> </div>
<div class="item"> <p class="item-title">Nota técnica</p> <p>Filmamos el taller como parte de una exploración performativa y documental del proceso.</p> </div>
<div class="item"> <p class="item-title">**Objetivos del taller</p>
taller:** <p>Explorarexplorar colectivamente qué perdemos cuando desaparece internet comercial, conocer tecnologías alternativas de comunicación y especular juntas sobre otros internets posibles.</p> </div>
<div class="item"> <p class="item-title">**En Calafou ya vivimos en la Altranet</p>
Altranet.** <p>Este espacio es un ejemplo vivo: una intranet basada en el servidor Bandrui, conexión a través de Guifi.net y una comunidad que practica otra manera de estar en red.</p> </div>
<div class="note"> → Formato experimental. Esto no es una charla convencional: es un laboratorio. Probamos cosas. Nos equivocamos. Aprendemos juntas. </div> </div> </div>
<!---
## 11. --> <div class="block"> <div class="block-index"> <span class="block-number">1</span> <span class="block-time">30 min</span> <span class="block-label">Reflexión</span> </div> <div class="block-content"> <h2>¿Qué perdemos cuando desaparece <span class="accent">internet comercial</span>?</h2>comercial? *(30 min)*
<div class="item"> <p class="item-title">**Ronda inicial — colectiva</p>colectiva** <p>Cada persona dirá una cosa que ama de internet y una cosa que odia. Sin filtros, sin orden.</p> </div>
<div class="item"> <p class="item-title">**Ejercicio individual — cartografía del día</p>día** <p>Dibuja un día típico en tu vida, desde que te levantas hasta que te acuestas. Marca todos los momentos en que interactúas con algún dispositivo conectado a internet y señala qué haces en cada uno.</p> </div>
<div class="item"> <p class="item-title">**Ejercicio de prospectiva — el día después</p>después** <p>Ahora imagina que mañana internet desaparece sin dejar rastro. Marca los impactos: emocionales, concretos para ti a nivel personal, para tu red de afectos y para la sociedad en su conjunto.</p> </div>
<div class="item"> <p class="item-title">**Conversación colectiva</p>colectiva** <p>¿Qué es lo que realmente perdemos si internet tal y como lo conocemos desaparece?</p> </div> </div> </div>
<!---
## 22. --> <div class="block"> <div class="block-index"> <span class="block-number">2</span> <span class="block-time">20 min</span> <span class="block-label">Análisis</span> </div> <div class="block-content"> <h2>Posibles causas de las <spaninterrupciones class="accent">interrupciones</span></h2>*(20 min)*
<div class="item"> <p class="item-title">Presentación a cargo de Spideralex</p>
**Spideralex** <p>Panorama desobre los principales vectores de interrupción del internet comercial, con datos y ejemplos actuales.</p> </div>actuales:
- <div class="tags"> <span class="tag">Censura e *internet shutdowns</span>shutdowns*
- Libertad <spanen class="tag">Internetinternet freedom</span>(*internet freedom*)
- <span class="tag">Exclusión algorítmica</span> <span class="tag">Decisiones automatizadas</span> y exclusión algorítmica
- <span class="tag">Ataques cibernéticos</span>
- <span class="tag">Vulnerabilidades técnicas</span>
- <span class="tag">Dependencia energética</span> y cortes eléctricos
- <span class="tag highlight">Centros de datos que fallan</span> </div> </div> </div>
<!---
## 33. --> <div class="block"> <div class="block-index"> <span class="block-number">3</span> <span class="block-time">45 min</span> <span class="block-label">Exploración</span> </div> <div class="block-content"> <h2>Recuperar y explorar otras formas de <spancomunicación class="accent">comunicación</span></h2>*(45 min)*
<div class="item"> <p class="item-title">**Lluvia de ideas colectiva</p>colectiva** <p>Pedimos a las asistentes que compartan otras formas de comunicación existentes cuando no hay internet. Las apuntamos juntas en la pizarra.</p> </div>
<div class="item" style="border-left-color: var(--amber);"> <p class="item-title">**Cada mesa es una colectividad tecnológica</p>tecnológica:**
| Mesa | Colectividad |
|------|-------------|
| 1 <div| class="mesas"> <div class="mesa"><span class="mesa-label">Mesa</span>——server</div> |
| 2 <div| class="mesa"><spanVedetas class="mesa-label">Mesa</span>Vedetas</div>|
| 3 <div| class="mesa"><spanNovamente class="mesa-label">Mesa</span>Novamente</div>|
| 4 <div| class="mesa"><spanCEDIPC class="mesa-label">Mesa</span>CEDIPC</div> <div class="mesa"><span class="mesa-label">Mesa</span>S-Net</div> <div class="mesa"><span class="mesa-label">Mesa</span>Sneakernet</div> </div> <p style="font-size:11px; color: var(--muted); margin-top:0.5rem;">CEDIPC: *(Comité de Estudio sobre la Desaparición del Internet Patriarcal y Capitalista</p>Capitalista)* |
| 5 </div>| S-Net |
| 6 | Sneakernet |
<div class="item"> <p class="item-title">**El sobre — instrucciones por mesa</p>mesa** <p>Cada mesa recibe un sobre con:
- 5 herramientas o protocolos para comunicarse sin internet,internet
- unUn código QR que dirige a una herramienta o contenidos,a eunos instruccionescontenidos
- Instrucciones para probar la comunicación desconectada.</p> </div>desconectada
> <div class="note" style="margin-top: 0.8rem;"> **Herramientas disponibles:** Bluetooth · Código Morse · PirateBox · Sneakernet · Dead Drops / Burnstation · Red comunitaria libre Guifi.net · Servidor local / intranet · Radio FM · Walkie Talkie · Radio CB · LoRa · SSTV *(Slow Scan Television) </div> </div> </div>*
<!---
## 44. --> <div class="block" style="border-bottom: none;"> <div class="block-index"> <span class="block-number">4</span> <span class="block-time">35 min</span> <span class="block-label">Performance</span> </div> <div class="block-content"> <h2>Performance jam <spancolectiva class="accent">colectiva</span></h2>*(35 min)*
<div class="perf-block"> <p class="item-title">**Fldigi — sonificación y cifrado</p>cifrado** <p>Pasamos mensajes y audios por Fldigi, un programa de módem que genera ruidos y cifra o descifra mensajes usando protocolos de radioafición: CW, PSK, MFSK, RTTY, Hell, DominoEX, Olivia y Throb. También puede calibrar tarjetas de sonido con señales de tiempo y hacer mediciones de frecuencia.</p> </div>
<div class="perf-block"> <p class="item-title">**Cantamos código</p>código** <p>La voz como protocolo. El cuerpo como transmisor. Exploramos qué significa cantar datos.</p> </div>
<div class="perf-block"> <p class="item-title">**Lectura sonora de Altranet</p>Altranet** <p>Se leen extractos del libro <em>Altranet</em>*Altranet* mezclados con los sonidos que genera la herramienta: capas de texto, ruido y señal que se superponen y dialogan.</p> </div> </div> </div>
</main>---
*Donestech · <footer> <div class="footer-logos"> <span>Donestech</span> <span>Start Down Labs</span> <span>B01</span> <span>Guifi.net</span> </div> <div class="footer-note"> Calafou · L'Anoia<br>
B01 · <spanGuifi.net style="color:· var(--green);">altranet</span> </div> </footer>Calafou*
</body></html>