2604-arte-digital-portfolio-talk-cYbLqLNT.js

js bbo.do collected 2026-10-09 22:07:49 UTC 59,549 bytes, 1 lines download raw bytes

1import{u as s,D as t}from"./app-DUJwWUAM.js";import{g as n,d as a,n as e,l as o,G as p}from"./vue-vendor-CiCZ1pRF.js";const l={class:"prose m-auto"},c={__name:"2604-arte-digital-portfolio-talk",setup:c=>(s({title:"Arte Digital @ EBA",meta:[{property:"og:title",content:"Arte Digital @ EBA"},{name:"twitter:title",content:"Arte Digital @ EBA"}]}),(s,c)=>(p(),n("div",l,[a("div",null,[e(t,{cloudStorage:!0,penEmoji:"ðï¸"}),e(t,{strokeColor:"red",penEmoji:"ðï¸",tipOffsetX:5,tipOffsetY:43,cloudStorage:!0}),e(t,{strokeColor:"rgba(0, 255, 255, 0.5)",strokeWidth:25,penEmoji:"ð",tipOffsetX:5,tipOffsetY:43,cloudStorage:!0}),e(t,{strokeColor:"rgba(0,0,0,1)",eraserMode:!0,strokeWidth:80,penEmoji:"ð§¹",cloudStorage:!0})]),c[0]||(c[0]=o('<hr><h2 id="my-work-projects" tabindex="-1"><span class="cut mono-2 wght-1 slnt-0 step-3">M</span><span class="cut mono-1 wght-1 slnt-4 step-1">y</span> <span class="cut mono-3 wght-2 slnt-3 step-3">W</span><span class="cut mono-5 wght-1 slnt-2 step-3">o</span><span class="cut mono-5 wght-5 slnt-1 step-2">r</span><span class="cut mono-0 wght-3 slnt-2 step-2">k</span> <span class="cut mono-3 wght-5 slnt-1 step-0">&amp;</span> <span class="cut mono-5 wght-2 slnt-1 step-1">P</span><span class="cut mono-0 wght-3 slnt-0 step-0">r</span><span class="cut mono-4 wght-5 slnt-3 step-2">o</span><span class="cut mono-1 wght-2 slnt-3 step-2">j</span><span class="cut mono-0 wght-5 slnt-5 step-0">e</span><span class="cut mono-1 wght-2 slnt-0 step-0">c</span><span class="cut mono-2 wght-1 slnt-3 step-1">t</span><span class="cut mono-5 wght-4 slnt-2 step-2">s</span> <a class="header-anchor" href="#my-work-projects" aria-hidden="true">#</a></h2><h3 id="this-portfolio-site" tabindex="-1"><span class="cut mono-5 wght-0 slnt-3 step-1">T</span><span class="cut mono-3 wght-0 slnt-1 step-0">h</span><span class="cut mono-4 wght-4 slnt-5 step-1">i</span><span class="cut mono-0 wght-5 slnt-2 step-2">s</span> <span class="cut mono-3 wght-3 slnt-1 step-3">P</span><span class="cut mono-3 wght-5 slnt-4 step-2">o</span><span class="cut mono-2 wght-1 slnt-1 step-2">r</span><span class="cut mono-5 wght-0 slnt-0 step-0">t</span><span class="cut mono-3 wght-1 slnt-1 step-3">f</span><span class="cut mono-5 wght-4 slnt-3 step-2">o</span><span class="cut mono-4 wght-1 slnt-0 step-2">l</span><span class="cut mono-0 wght-5 slnt-0 step-0">i</span><span class="cut mono-5 wght-4 slnt-2 step-0">o</span> <span class="cut mono-4 wght-0 slnt-2 step-1">S</span><span class="cut mono-4 wght-1 slnt-3 step-0">i</span><span class="cut mono-0 wght-0 slnt-0 step-2">t</span><span class="cut mono-1 wght-5 slnt-4 step-3">e</span> <a class="header-anchor" href="#this-portfolio-site" aria-hidden="true">#</a></h3><ul><li><strong>Live site</strong>: <a href="https://bbo.do" target="_blank" rel="noopener">bbo.do</a></li><li><strong>Source</strong>: <a href="https://github.com/bodobraegger/bodobraegger.github.io" target="_blank" rel="noopener">github.com/bodobraegger/bodobraegger.github.io</a></li><li>Built with Vue.js, Vite, UnoCSS</li><li>DrawablePen component: draw on pages, share via URL hash, or save to Supabase for real-time collaboration</li></ul><p>The portfolio functions as both documentation and artwork. Itâs not a static CV but an evolving space where projects live alongside notes, experiments, and interactive elements. The DrawablePen component you see at the top of this page is an example: visitors can leave marks, scribbles, annotations. These persist locally, can be shared instantly via URL, or synced in real-time using Supabase for collaborative drawing sessions.</p><h3 id="chatango-live-chat" tabindex="-1"><span class="cut mono-1 wght-3 slnt-4 step-2">C</span><span class="cut mono-1 wght-3 slnt-0 step-2">h</span><span class="cut mono-1 wght-1 slnt-2 step-1">a</span><span class="cut mono-3 wght-5 slnt-5 step-1">t</span><span class="cut mono-2 wght-4 slnt-3 step-3">a</span><span class="cut mono-4 wght-1 slnt-5 step-3">n</span><span class="cut mono-0 wght-0 slnt-0 step-1">g</span><span class="cut mono-4 wght-4 slnt-0 step-2">o</span> <span class="cut mono-3 wght-0 slnt-4 step-0">L</span><span class="cut mono-2 wght-2 slnt-0 step-2">i</span><span class="cut mono-0 wght-2 slnt-4 step-0">v</span><span class="cut mono-2 wght-1 slnt-5 step-2">e</span> <span class="cut mono-5 wght-4 slnt-3 step-2">C</span><span class="cut mono-1 wght-2 slnt-0 step-3">h</span><span class="cut mono-4 wght-3 slnt-5 step-2">a</span><span class="cut mono-3 wght-0 slnt-2 step-3">t</span> <a class="header-anchor" href="#chatango-live-chat" aria-hidden="true">

1#</a></h3><p>On most pages of bbo.do, thereâs a small live chat widget in the corner, the siteâs own, built on Supabase. This creates an always-on, (anonymous) communication channel between anyone browsing the site. Itâs a nod to guestbooks, shoutboxes, IRC, graffiti.</p><p>The chat collapses into a minimal ticker by default, scrolling recent messages. Visitors can expand it to participate. Thereâs no login required, no data collection beyond the conversation itself. Itâs a way to maintain presence and availability without the mediation of corporate social platforms.</p><p>This connects to broader questions in net art about liveness, presence, and the social dimension of websites; and false nostalgia towards a retrospective of a more open, inclusive and participatory internet.</p><h3 id="bidi-bidirectional-translator" tabindex="-1"><span class="cut mono-2 wght-5 slnt-3 step-2">b</span><span class="cut mono-0 wght-1 slnt-2 step-3">i</span><span class="cut mono-4 wght-1 slnt-5 step-1">d</span><span class="cut mono-5 wght-4 slnt-4 step-0">i</span> <span class="cut mono-1 wght-0 slnt-1 step-0">-</span> <span class="cut mono-3 wght-0 slnt-3 step-0">b</span><span class="cut mono-5 wght-3 slnt-4 step-3">i</span><span class="cut mono-1 wght-1 slnt-5 step-0">d</span><span class="cut mono-0 wght-2 slnt-5 step-0">i</span><span class="cut mono-5 wght-0 slnt-1 step-3">r</span><span class="cut mono-2 wght-4 slnt-0 step-0">e</span><span class="cut mono-5 wght-4 slnt-2 step-3">c</span><span class="cut mono-1 wght-0 slnt-0 step-1">t</span><span class="cut mono-1 wght-4 slnt-3 step-0">i</span><span class="cut mono-1 wght-4 slnt-4 step-3">o</span><span class="cut mono-2 wght-1 slnt-2 step-2">n</span><span class="cut mono-5 wght-0 slnt-4 step-3">a</span><span class="cut mono-3 wght-4 slnt-4 step-0">l</span> <span class="cut mono-4 wght-1 slnt-4 step-0">t</span><span class="cut mono-0 wght-2 slnt-2 step-1">r</span><span class="cut mono-3 wght-1 slnt-4 step-3">a</span><span class="cut mono-0 wght-1 slnt-2 step-3">n</span><span class="cut mono-4 wght-3 slnt-4 step-1">s</span><span class="cut mono-2 wght-5 slnt-0 step-0">l</span><span class="cut mono-4 wght-4 slnt-4 step-1">a</span><span class="cut mono-1 wght-3 slnt-4 step-3">t</span><span class="cut mono-3 wght-4 slnt-1 step-3">o</span><span class="cut mono-3 wght-2 slnt-2 step-2">r</span> <a class="header-anchor" href="#bidi-bidirectional-translator" aria-hidden="true">#</a></h3><ul><li><strong>Live</strong>: <a href="https://bbo.do/projects/bidi" target="_blank" rel="noopener">bbo.do/projects/bidi</a></li><li>Crowd-sourced translation tool - type in either language box</li><li>Community contributions shape the database over time</li></ul><p>bidi treats translation as a collaborative act rather than a strictly technical problem to be solved. Unl

1ike machine translation which aims for accuracy and consistency, bidi embraces the messiness of human-contributed translations. Unexpected meanings, jokes, cultural references, and occasional nonsense all become part of the emergent system.</p><h3 id="rj-bd-rio-beach-water-quality" tabindex="-1"><span class="cut mono-3 wght-1 slnt-3 step-3">r</span><span class="cut mono-0 wght-2 slnt-4 step-0">j</span><span class="cut mono-4 wght-1 slnt-0 step-0">-</span><span class="cut mono-5 wght-1 slnt-2 step-1">b</span><span class="cut mono-1 wght-3 slnt-0 step-2">d</span> <span class="cut mono-2 wght-1 slnt-2 step-1">-</span> <span class="cut mono-0 wght-5 slnt-5 step-3">r</span><span class="cut mono-1 wght-5 slnt-5 step-0">i</span><span class="cut mono-0 wght-3 slnt-5 step-3">o</span> <span class="cut mono-3 wght-4 slnt-5 step-0">b</span><span class="cut mono-2 wght-0 slnt-4 step-2">e</span><span class="cut mono-3 wght-0 slnt-0 step-2">a</span><span class="cut mono-5 wght-2 slnt-2 step-1">c</span><span class="cut mono-3 wght-3 slnt-1 step-3">h</span> <span class="cut mono-5 wght-2 slnt-1 step-0">w</span><span class="cut mono-0 wght-4 slnt-3 step-2">a</span><span class="cut mono-2 wght-4 slnt-4 step-2">t</span><span class="cut mono-3 wght-0 slnt-1 step-2">e</span><span class="cut mono-0 wght-3 slnt-5 step-2">r</span> <span class="cut mono-5 wght-0 slnt-4 step-3">q</span><span class="cut mono-2 wght-3 slnt-4 step-1">u</span><span class="cut mono-2 wght-4 slnt-0 step-0">a</span><span class="cut mono-5 wght-2 slnt-1 step-1">l</span><span class="cut mono-3 wght-3 slnt-4 step-2">i</span><span class="cut mono-4 wght-3 slnt-4 step-3">t</span><span class="cut mono-4 wght-3 slnt-2 step-0">y</span> <a class="header-anchor" href="#rj-bd-rio-beach-water-quality" aria-hidden="true">#</a></h3><ul><li><strong>Live</strong>: <a href="https://bbo.do/rj-bd" target="_blank" rel="noopener">bbo.do/rj-bd</a></li><li><strong>Source</strong>: <a href="https://github.com/bodobraegger/rj-bd" target="_blank" rel="noopener">github.com/bodobraegger/rj-bd</a></li><li>Auto-parses INEA PDF bulletins every Monday via GitHub Actions</li><li>25 beaches with color-coded status (PrÃ³pria/ImprÃ³pria/AtenÃ§Ã£o)</li><li>Vanilla JS + Leaflet.js, sub-50KB bundle</li></ul><p>This project emerged from a practical need: INEA publishes beach water quality data, but only as PDF bulletins that arenât easily searchable or comparable over time. rj-bd automates the extraction and presents the data as an interactive map.</p><h3 id="the-real-walter-der-wahre-walter" tabindex="-1"><span class="cut mono-4 wght-1 slnt-3 step-1">T</span><span class="cut mono-1 wght-0 slnt-2 step-2">h</span><span class="cut mono-0 wght-0 slnt-5 step-0">e</span> <span class="cut mono-0 wght-4 slnt-4 step-1">R</span><span class="cut mono-4 wght-5 slnt-4 step-3">e</span><span class="cut mono-1 wght-3 slnt-4 step-3">a</span><span class="cut mono-5 wght-5 slnt-1 step-0">l</span> <span class="cut mono-1 wght-1 slnt-2 step-1">W</span><span class="cut mono-2 wght-4 slnt-0 step-2">a</span><span class="cut mono-4 wght-5 slnt-1 step-0">l</span><span class="cut mono-3 wght-0 slnt-3 step-3">t</span><span class="cut mono-3 wght-2 slnt-2 step-3">e</span><span class="cut mono-0 wght-0 slnt-1 step-2">r</span> <span class="cut mono-4 wght-0 slnt-5 step-2">(</span><span class="cut mono-0 wght-2 slnt-4 step-1">D</span><span class="cut mono-4 wght-1 slnt-5 step-0">e</span><span class="cut mono-2 wght-5 slnt-1 step-1">r</span> <span class="cut mono-0 wght-2 slnt-1 step-0">W</span><span class="cut mono-5 wght-5 slnt-5 step-1">a</span><span class="cut mono-4 wght-5 slnt-5 step-0">h</span><span class="cut mono-0 wght-4 slnt-3 step-1">r</span><span class="cut mono-3 wght-2 slnt-5 step-2">e</span> <span class="cut mono-1 wght-5 slnt-5 step-1">W</span><span class="cut mono-3 wght-3 slnt-0 step-1">a</span><span class="cut mono-4 wght-5 slnt-2 step-3">l</span><span class="cut mono-2 wght-0 slnt-5 step-2">t</span><span class="cut mono-0 wght-1 slnt-4 step-1">e</span><span class="cut mono-4 wght-5 slnt-4 step-0">r</span><span class="cut mono-1 wght-2 slnt-2 step-0">)</span> <a class="header-anchor" href="#the-real-walter-der-wahre-walter" aria-hidden="true">

1#</a></h3><ul><li><strong>Live</strong>: <a href="https://bbo.do/der-wahre-walter" target="_blank" rel="noopener">bbo.do/der-wahre-walter</a></li><li><strong>Source</strong>: <a href="https://github.com/bodobraegger/der-wahre-walter" target="_blank" rel="noopener">github.com/bodobraegger/der-wahre-walter</a></li><li>Web implementation of the Swiss card game by Urs Hostettler, based on the Fichenskandal!</li><li>Pure HTML/CSS/JS, works offline via service worker</li><li>Related: <a href="https://web.archive.org/web/20160325012209/http://wiki.glamwiki.ch/index.php?title=Der_wahre_Wikinger" target="_blank" rel="noopener">der wahre Wikinger</a> (Wikipedia-based variant)</li></ul><h3 id="slugs-msc-thesis-project" tabindex="-1"><span class="cut mono-4 wght-5 slnt-4 step-1">S</span><span class="cut mono-1 wght-0 slnt-4 step-2">l</span><span class="cut mono-5 wght-1 slnt-5 step-2">u</span><span class="cut mono-3 wght-2 slnt-1 step-0">g</span><span class="cut mono-4 wght-3 slnt-3 step-1">s</span> <span class="cut mono-5 wght-3 slnt-4 step-1">(</span><span class="cut mono-0 wght-1 slnt-0 step-2">M</span><span class="cut mono-2 wght-2 slnt-1 step-2">S</span><span class="cut mono-0 wght-3 slnt-5 step-3">c</span> <span class="cut mono-4 wght-2 slnt-2 step-2">T</span><span class="cut mono-0 wght-3 slnt-1 step-3">h</span><span class="cut mono-1 wght-3 slnt-0 step-2">e</span><span class="cut mono-2 wght-3 slnt-0 step-1">s</span><span class="cut mono-3 wght-5 slnt-1 step-3">i</span><span class="cut mono-3 wght-4 slnt-3 step-0">s</span> <span class="cut mono-0 wght-5 slnt-2 step-2">P</span><span class="cut mono-1 wght-3 slnt-5 step-1">r</span><span class="cut mono-0 wght-5 slnt-3 step-1">o</span><span class="cut mono-1 wght-2 slnt-0 step-0">j</span><span class="cut mono-4 wght-1 slnt-2 step-2">e</span><span class="cut mono-4 wght-4 slnt-4 step-0">c</span><span class="cut mono-5 wght-3 slnt-1 step-3">t</span><span class="cut mono-1 wght-1 slnt-2 step-2">)</span> <a class="header-anchor" href="#slugs-msc-thesis-project" aria-hidden="true">#</a></h3><ul><li><strong>Live</strong> (barely playable): <a href="https://bbo.do/slugs" target="_blank" rel="noopener">bbo.do/slugs</a></li><li>Part of MSc Computer Science thesis work on gender differences in Computer Science under <a href="https://www.manukapur.com/" target="_blank" rel="noopener">Prof. Manu Kapur</a>.</li><li>Experimental game/interactive experience with pedagogical roots, aimed to produce an environment for <a href="https://www.manukapur.com/productive-failure/" target="_blank" rel="noopener">productive failure</a>.</li></ul><hr><h2 id="visual-practice-cctv" tabindex="-1"><span class="cut mono-3 wght-3 slnt-5 step-3">V</span><span class="cut mono-2 wght-4 slnt-3 step-0">i</span><span class="cut mono-3 wght-3 slnt-1 step-2">s</span><span class="cut mono-2 wght-3 slnt-0 step-1">u</span><span class="cut mono-3 wght-3 slnt-2 step-0">a</span><span class="cut mono-5 wght-2 slnt-0 step-2">l</span> <span class="cut mono-4 wght-4 slnt-4 step-3">P</span><span class="cut mono-3 wght-1 slnt-3 step-0">r</span><span class="cut mono-4 wght-0 slnt-0 step-1">a</span><span class="cut mono-1 wght-3 slnt-5 step-3">c</span><span class="cut mono-5 wght-2 slnt-0 step-0">t</span><span class="cut mono-1 wght-4 slnt-3 step-0">i</span><span class="cut mono-2 wght-1 slnt-2 step-0">c</span><span class="cut mono-2 wght-0 slnt-2 step-3">e</span> <span class="cut mono-4 wght-4 slnt-0 step-1">&amp;</span> <span class="cut mono-3 wght-5 slnt-0 step-0">C</span><span class="cut mono-2 wght-4 slnt-5 step-3">C</span><span class="cut mono-0 wght-0 slnt-5 step-1">T</span><span class="cut mono-1 wght-2 slnt-3 step-3">V</span> <a class="header-anchor" href="#visual-practice-cctv" aria-hidden="true">#</a></h2><h3 id="visuals-live-feeds" tabindex="-1"><span class="cut mono-3 wght-2 slnt-4 step-1">V</span><span class="cut mono-1 wght-5 slnt-3 step-3">i</span><span class="cut mono-1 wght-5 slnt-1 step-2">s</span><span class="cut mono-4 wght-1 slnt-3 step-1">u</span><span class="cut mono-4 wght-3 slnt-2 step-1">a</span><span class="cut mono-5 wght-5 slnt-2 step-2">l</span><span class="cut mono-2 wght-2 slnt-5 step-2">s</span> <span class="cut mono-3 wght-5 slnt-1 step-3">&amp;</span> <span class="cut mono-1 wght-1 slnt-5 step-1">L</span><span class="cut mono-3 wght-5 slnt-0 step-0">i</span><span class="cut mono-5 wght-0 slnt-5 step-2">v</span><span class="cut mono-1 wght-5 slnt-4 step-2">e</span> <span class="cut mono-5 wght-0 slnt-1 step-2">F</span><span class="cut mono-2 wght-0 slnt-1 step-3">e</span><span class="cut mono-3 wght-4 slnt-0 step-3">e</span><span class="cut mono-4 wght-0 slnt-2 step-2">d</span><span class="cut mono-0 wght-1 slnt-3 step-3">s</span> <a class="header-anchor" href="#visuals-live-feeds" aria-hidden="true">

1#</a></h3><p>My digital visual practice spans photography, curation, and live-coded video synthesis. I work with found footage, satellite imagery, and live feeds from webcams and surveillance cameras. The outputs range from still images to real-time performances to recordings, installations and stills.</p><p>For live performances and events I create visuals that incorporate:</p><ul><li>Live-coded Hydra sketches</li><li>CCTV camera feeds from around the world</li><li>Satellite imagery</li><li>Found footage from documentaries and films</li><li>Webcam streams</li></ul><p>The temporal and geographical dimension of live feeds adds something that pre-recorded material canât.</p><h3 id="cctv-surveillance-camera-art" tabindex="-1"><span class="cut mono-3 wght-1 slnt-2 step-3">C</span><span class="cut mono-4 wght-0 slnt-3 step-2">C</span><span class="cut mono-4 wght-5 slnt-5 step-3">T</span><span class="cut mono-1 wght-1 slnt-2 step-2">V</span> <span class="cut mono-5 wght-1 slnt-3 step-1">&amp;</span> <span class="cut mono-5 wght-1 slnt-1 step-1">S</span><span class="cut mono-2 wght-1 slnt-4 step-0">u</span><span class="cut mono-5 wght-5 slnt-4 step-1">r</span><span class="cut mono-4 wght-5 slnt-0 step-1">v</span><span class="cut mono-1 wght-1 slnt-0 step-1">e</span><span class="cut mono-2 wght-0 slnt-1 step-1">i</span><span class="cut mono-3 wght-2 slnt-5 step-3">l</span><span class="cut mono-2 wght-0 slnt-1 step-3">l</span><span class="cut mono-0 wght-5 slnt-1 step-0">a</span><span class="cut mono-3 wght-2 slnt-5 step-1">n</span><span class="cut mono-2 wght-4 slnt-2 step-2">c</span><span class="cut mono-3 wght-5 slnt-5 step-2">e</span> <span class="cut mono-5 wght-2 slnt-0 step-0">C</span><span class="cut mono-1 wght-3 slnt-3 step-1">a</span><span class="cut mono-1 wght-0 slnt-4 step-3">m</span><span class="cut mono-2 wght-0 slnt-4 step-3">e</span><span class="cut mono-2 wght-5 slnt-1 step-0">r</span><span class="cut mono-4 wght-2 slnt-5 step-0">a</span> <span class="cut mono-2 wght-3 slnt-2 step-3">A</span><span class="cut mono-5 wght-1 slnt-5 step-3">r</span><span class="cut mono-3 wght-3 slnt-3 step-2">t</span> <a class="header-anchor" href="#cctv-surveillance-camera-art" aria-hidden="true">#</a></h3><p>Iâve been collecting and exploring publicly accessible surveillance cameras, webcams, and unsecured network devices. These searches reveal cameras left open - sometimes intentionally (public webcams), sometimes accidentally (misconfigured security systems). The resulting material is a kind of found footage archive of mundane life: offices, parking lots, baby monitors, chicken coops, astronomical observatories, alpine ski resorts, wind turbine control panels, fish tanks.</p><p><strong>Some interesting finds:</strong></p><div class="table-wrapper"><table><thead><tr><th>Description</th><th>URL</th></tr></thead><tbody><tr><td>Controllable lake camera</td><td><a href="http://209.216.188.4:81/view/viewer_index.shtml?id=21057" target="_blank" rel="noopener">http://209.216.188.4:81/view/viewer_index.shtml?id=21057</a></td></tr><tr><td>Baby zoo / fish cam</td><td><a href="http://myfishcam.homedns.org:444/multi.html" target="_blank" rel="noopener">http://myfishcam.homedns.org:444/multi.html</a></td></tr><tr><td>Chickens</td><td><a href="http://213.144.145.239:8090/" target="_blank" rel="noopener">http://213.144.145.239:8090/</a></td></tr><tr><td>Controllable Zurich camera</td><td><a href="http://213.3.59.218:81/cgi-bin/guestimage.html" target="_blank" rel="noopener">http://213.3.59.218:81/cgi-bin/guestimage.html</a></td></tr><tr><td>AstrofÃsica de Canarias</td><td><a href="http://webcam3.tt.iac.es/view/view.shtml?id=355" target="_blank" rel="noopener">http://webcam3.tt.iac.es/view/view.shtml?id=355</a></td></tr><tr><td>Flaine ski resort</td><td><a href="http://193.251.72.159:8091/mjpg/video.mjpg" target="_blank" rel="noopener">http://193.251.72.159:8091/mjpg/video.mjpg</a></td></tr><tr><td>Wind turbine control</td><td><a href="https://185.156.235.214/awp/mainPage.html" target="_blank" rel="noopener">https://185.156.235.214/awp/mainPage.html</a></td></tr><tr><td>Etna volcanic stream</td><td><a href="https://www.ct.ingv.it/sezioniesterne/StreamingEtna.php" target="_blank" rel="noopener">https://www.ct.ingv.it/sezioniesterne/StreamingEtna.php</a></td></tr></tbody></table></div><p><strong>Image backup discoveries</strong> - sometimes search engines index unprotected file directories containing photo backups:</p><ul><li>Arctic research expedition photos</li><li>Mediterranean vacation archives</li><li>

1Random personal collections</li></ul><p><strong>Webcam collections:</strong></p><ul><li><a href="http://www.insecam.org/en/bycountry/ch/" target="_blank" rel="noopener">insecam.org</a> - aggregator of open cameras by country</li><li><a href="https://shodian.io" target="_blank" rel="noopener">Shodan</a> - search engine for internet-connected devices</li></ul><h3 id="events-parties-elektrosmog-braui-regula-â¦" tabindex="-1"><span class="cut mono-5 wght-3 slnt-3 step-3">E</span><span class="cut mono-3 wght-5 slnt-2 step-0">v</span><span class="cut mono-2 wght-1 slnt-1 step-3">e</span><span class="cut mono-4 wght-0 slnt-2 step-0">n</span><span class="cut mono-0 wght-0 slnt-0 step-3">t</span><span class="cut mono-5 wght-0 slnt-2 step-2">s</span> <span class="cut mono-0 wght-3 slnt-4 step-3">&amp;</span> <span class="cut mono-4 wght-2 slnt-1 step-0">P</span><span class="cut mono-1 wght-4 slnt-3 step-2">a</span><span class="cut mono-0 wght-1 slnt-3 step-3">r</span><span class="cut mono-1 wght-0 slnt-5 step-2">t</span><span class="cut mono-0 wght-3 slnt-1 step-0">i</span><span class="cut mono-1 wght-1 slnt-2 step-0">e</span><span class="cut mono-3 wght-2 slnt-5 step-0">s</span><span class="cut mono-3 wght-3 slnt-4 step-0">:</span> <span class="cut mono-5 wght-3 slnt-1 step-1">E</span><span class="cut mono-1 wght-3 slnt-5 step-1">l</span><span class="cut mono-4 wght-5 slnt-5 step-1">e</span><span class="cut mono-3 wght-2 slnt-4 step-1">k</span><span class="cut mono-3 wght-0 slnt-4 step-2">t</span><span class="cut mono-1 wght-2 slnt-2 step-0">r</span><span class="cut mono-0 wght-5 slnt-2 step-2">o</span><span class="cut mono-2 wght-4 slnt-4 step-3">s</span><span class="cut mono-1 wght-1 slnt-0 step-0">m</span><span class="cut mono-4 wght-2 slnt-4 step-1">o</span><span class="cut mono-0 wght-2 slnt-1 step-3">g</span><span class="cut mono-1 wght-2 slnt-0 step-2">,</span> <span class="cut mono-2 wght-5 slnt-3 step-3">B</span><span class="cut mono-0 wght-4 slnt-2 step-3">r</span><span class="cut mono-4 wght-0 slnt-2 step-1">a</span><span class="cut mono-0 wght-5 slnt-3 step-3">u</span><span class="cut mono-1 wght-1 slnt-0 step-1">i</span><span class="cut mono-4 wght-0 slnt-2 step-0">,</span> <span class="cut mono-0 wght-2 slnt-5 step-0">R</span><span class="cut mono-4 wght-2 slnt-3 step-2">e</span><span class="cut mono-1 wght-3 slnt-5 step-1">g</span><span class="cut mono-3 wght-5 slnt-1 step-1">u</span><span class="cut mono-0 wght-0 slnt-1 step-2">l</span><span class="cut mono-1 wght-0 slnt-1 step-3">a</span><span class="cut mono-3 wght-3 slnt-1 step-3">,</span> <span class="cut mono-4 wght-1 slnt-3 step-2">â¦</span> <a class="header-anchor" href="#events-parties-elektrosmog-braui-regula-â¦" aria-hidden="true">#</a></h3><p>I organized and provided visuals for different series of events. These were underground electronic music events where I performed live visuals, music, often incorporating CCTV feeds, live-coded Hydra sketches, and processed found footage.</p><p>The event context changes how visual work functions - it becomes environmental, immersive, responsive to music and crowd energy. The work isnât precious or archival, ephemera.</p><h3 id="samples-source-material" tabindex="-1"><span class="cut mono-5 wght-5 slnt-5 step-1">S</span><span class="cut mono-0 wght-5 slnt-2 step-3">a</span><span class="cut mono-3 wght-1 slnt-1 step-3">m</span><span class="cut mono-4 wght-0 slnt-5 step-3">p</span><span class="cut mono-4 wght-3 slnt-1 step-0">l</span><span class="cut mono-5 wght-2 slnt-0 step-2">e</span><span class="cut mono-1 wght-4 slnt-2 step-0">s</span> <span class="cut mono-3 wght-2 slnt-2 step-0">&amp;</span> <span class="cut mono-4 wght-2 slnt-4 step-2">S</span><span class="cut mono-3 wght-4 slnt-1 step-3">o</span><span class="cut mono-0 wght-1 slnt-1 step-3">u</span><span class="cut mono-3 wght-0 slnt-0 step-2">r</span><span class="cut mono-0 wght-2 slnt-4 step-1">c</span><span class="cut mono-1 wght-0 slnt-5 step-2">e</span> <span class="cut mono-0 wght-3 slnt-1 step-1">M</span><span class="cut mono-0 wght-4 slnt-5 step-3">a</span><span class="cut mono-4 wght-4 slnt-5 step-0">t</span><span class="cut mono-1 wght-2 slnt-0 step-3">e</span><span class="cut mono-4 wght-0 slnt-5 step-2">

1r</span><span class="cut mono-4 wght-3 slnt-1 step-2">i</span><span class="cut mono-4 wght-0 slnt-3 step-1">a</span><span class="cut mono-1 wght-1 slnt-2 step-0">l</span> <a class="header-anchor" href="#samples-source-material" aria-hidden="true">#</a></h3><p>My approach to both audio and visual work centers on found material:</p><ul><li><strong>Documentaries</strong> - primary source for both music sampling and visual work</li><li><strong>Films</strong> - commercial and art cinema, used as raw material</li><li><strong>YouTube</strong> - especially archival footage, using queries like <code>before:2006-01-01 zurich</code> to find early uploads</li><li><strong>Live feeds</strong> - webcams, CCTV, satellite imagery for temporal/geographical specificity</li><li>Interesting YouTube archaeology: <a href="https://walzr.com/IMG_0001" target="_blank" rel="noopener">walzr.com/IMG_0001</a> - collection of the first videos people uploaded</li></ul><h3 id="modular-synthesis" tabindex="-1"><span class="cut mono-3 wght-1 slnt-5 step-3">M</span><span class="cut mono-0 wght-3 slnt-2 step-3">o</span><span class="cut mono-0 wght-0 slnt-0 step-2">d</span><span class="cut mono-2 wght-3 slnt-0 step-2">u</span><span class="cut mono-0 wght-0 slnt-2 step-3">l</span><span class="cut mono-0 wght-2 slnt-4 step-3">a</span><span class="cut mono-0 wght-2 slnt-1 step-1">r</span> <span class="cut mono-5 wght-0 slnt-2 step-1">S</span><span class="cut mono-2 wght-0 slnt-1 step-0">y</span><span class="cut mono-3 wght-4 slnt-3 step-2">n</span><span class="cut mono-4 wght-0 slnt-0 step-3">t</span><span class="cut mono-0 wght-0 slnt-3 step-3">h</span><span class="cut mono-3 wght-4 slnt-0 step-2">e</span><span class="cut mono-5 wght-0 slnt-4 step-1">s</span><span class="cut mono-5 wght-1 slnt-1 step-0">i</span><span class="cut mono-4 wght-1 slnt-5 step-2">s</span> <a class="header-anchor" href="#modular-synthesis" aria-hidden="true">#</a></h3><p>As my music practice evolved from software-based production, I got into hardware, including eurorack modular synthesizers. The modular approach mirrors some of the same principles as live coding: signal flow, patching, real-time manipulation, happy accidents.</p><h3 id="activism" tabindex="-1"><span class="cut mono-2 wght-4 slnt-1 step-3">A</span><span class="cut mono-3 wght-4 slnt-5 step-0">c</span><span class="cut mono-3 wght-5 slnt-5 step-2">t</span><span class="cut mono-1 wght-0 slnt-3 step-0">i</span><span class="cut mono-5 wght-0 slnt-4 step-3">v</span><span class="cut mono-4 wght-4 slnt-0 step-1">i</span><span class="cut mono-2 wght-1 slnt-1 step-1">s</span><span class="cut mono-5 wght-0 slnt-5 step-1">m</span> <a class="header-anchor" href="#activism" aria-hidden="true">#</a></h3><p>Beyond digital work, Iâve been involved in activism and physical interventions - documentation exists in my personal archive from 2021. This work operates in a different register than the digital projects: bodies in space, risk, collective action and is strictly political. The documentation is photographic, not meant for public circulation.</p><hr><h2 id="music-live-coding" tabindex="-1"><span class="cut mono-3 wght-2 slnt-2 step-0">M</span><span class="cut mono-5 wght-3 slnt-1 step-0">u</span><span class="cut mono-1 wght-3 slnt-4 step-2">s</span><span class="cut mono-1 wght-5 slnt-3 step-1">i</span><span class="cut mono-1 wght-1 slnt-1 step-0">c</span> <span class="cut mono-5 wght-0 slnt-3 step-0">&amp;</span> <span class="cut mono-5 wght-1 slnt-2 step-0">L</span><span class="cut mono-0 wght-0 slnt-3 step-0">i</span><span class="cut mono-0 wght-1 slnt-4 step-2">v</span><span class="cut mono-0 wght-0 slnt-2 step-1">e</span> <span class="cut mono-1 wght-5 slnt-1 step-3">C</span><span class="cut mono-1 wght-3 slnt-2 step-1">o</span><span class="cut mono-0 wght-5 slnt-4 step-3">d</span><span class="cut mono-1 wght-4 slnt-5 step-3">i</span><span class="cut mono-4 wght-2 slnt-2 step-0">n</span><span class="cut mono-1 wght-3 slnt-2 step-2">g</span> <a class="header-anchor" href="#music-live-coding" aria-hidden="true">#</a></h2><h3 id="my-music-production" tabindex="-1"><span class="cut mono-4 wght-4 slnt-0 step-3">M</span><span class="cut mono-1 wght-2 slnt-2 step-0">y</span> <span class="cut mono-4 wght-4 slnt-3 step-0">M</span><span class="cut mono-4 wght-1 slnt-3 step-1">u</span><span class="cut mono-4 wght-5 slnt-4 step-3">s</span><span class="cut mono-1 wght-4 slnt-5 step-1">i</span><span class="cut mono-2 wght-2 slnt-4 step-2">c</span> <span class="cut mono-1 wght-5 slnt-2 step-2">P</span><span class="cut mono-1 wght-4 slnt-5 step-2">

1r</span><span class="cut mono-3 wght-3 slnt-2 step-3">o</span><span class="cut mono-0 wght-3 slnt-0 step-0">d</span><span class="cut mono-2 wght-2 slnt-3 step-0">u</span><span class="cut mono-0 wght-5 slnt-4 step-3">c</span><span class="cut mono-4 wght-4 slnt-4 step-2">t</span><span class="cut mono-1 wght-3 slnt-1 step-0">i</span><span class="cut mono-2 wght-3 slnt-1 step-3">o</span><span class="cut mono-2 wght-3 slnt-1 step-0">n</span> <a class="header-anchor" href="#my-music-production" aria-hidden="true">#</a></h3><ul><li><strong>Recordings</strong>: <a href="https://www.dropbox.com/scl/fo/p5vygqgq5qsfwwpfh2pqj/ACA2BkjYRDzF8yofAAANC6c?rlkey=1tm91vg4653v364ahislfbo6j&amp;st=23qycqhj&amp;dl=0" target="_blank" rel="noopener">Dropbox folder</a></li><li>Started 2012 with Cubase</li><li>Journey through sampling, hip hop, experimental electronic, modular synths, live coding, live performance</li></ul><p>My production practice often works within conceptual constraints - limiting source material to see what emerges from restriction.</p><h3 id="live-coding-notes-hydra-sketches" tabindex="-1"><span class="cut mono-2 wght-5 slnt-4 step-0">L</span><span class="cut mono-5 wght-5 slnt-4 step-3">i</span><span class="cut mono-1 wght-2 slnt-2 step-3">v</span><span class="cut mono-2 wght-3 slnt-0 step-1">e</span> <span class="cut mono-0 wght-0 slnt-0 step-1">C</span><span class="cut mono-3 wght-5 slnt-2 step-2">o</span><span class="cut mono-5 wght-1 slnt-2 step-2">d</span><span class="cut mono-1 wght-5 slnt-5 step-3">i</span><span class="cut mono-5 wght-3 slnt-0 step-0">n</span><span class="cut mono-4 wght-2 slnt-4 step-3">g</span> <span class="cut mono-3 wght-0 slnt-3 step-2">N</span><span class="cut mono-2 wght-5 slnt-2 step-3">o</span><span class="cut mono-5 wght-1 slnt-4 step-0">t</span><span class="cut mono-2 wght-1 slnt-1 step-2">e</span><span class="cut mono-5 wght-3 slnt-1 step-0">s</span> <span class="cut mono-0 wght-5 slnt-0 step-0">&amp;</span> <span class="cut mono-2 wght-5 slnt-3 step-3">H</span><span class="cut mono-4 wght-3 slnt-2 step-0">y</span><span class="cut mono-5 wght-3 slnt-1 step-3">d</span><span class="cut mono-1 wght-5 slnt-4 step-3">r</span><span class="cut mono-5 wght-4 slnt-4 step-1">a</span> <span class="cut mono-5 wght-2 slnt-2 step-0">S</span><span class="cut mono-1 wght-4 slnt-4 step-3">k</span><span class="cut mono-3 wght-4 slnt-5 step-1">e</span><span class="cut mono-4 wght-5 slnt-4 step-3">t</span><span class="cut mono-2 wght-2 slnt-4 step-3">c</span><span class="cut mono-0 wght-2 slnt-5 step-1">h</span><span class="cut mono-3 wght-2 slnt-0 step-2">e</span><span class="cut mono-0 wght-2 slnt-3 step-3">s</span> <a class="header-anchor" href="#live-coding-notes-hydra-sketches" aria-hidden="true">#</a></h3><ul><li><strong>Notes page</strong>: <a href="https://bbo.do/notes/2504-livecoding-examples" target="_blank" rel="noopener">bbo.do/notes/2504-livecoding-examples</a></li><li>Collection of Hydra sketches with direct links to run in browser</li><li>Each sketch includes the code and a link to open it directly in the Hydra editor</li></ul><p>Live coding as a practice collapses the distinction between composing and performing. You write code in real-time, in front of an audie

1nce, and the output is immediate. Mistakes are visible. The process is the performance.</p><hr><h2 id="hydra-live-coding-visuals" tabindex="-1"><span class="cut mono-1 wght-0 slnt-3 step-3">H</span><span class="cut mono-5 wght-2 slnt-5 step-3">y</span><span class="cut mono-0 wght-4 slnt-5 step-3">d</span><span class="cut mono-0 wght-2 slnt-0 step-2">r</span><span class="cut mono-1 wght-3 slnt-1 step-2">a</span> <span class="cut mono-3 wght-4 slnt-0 step-3">-</span> <span class="cut mono-4 wght-0 slnt-5 step-2">L</span><span class="cut mono-1 wght-4 slnt-2 step-1">i</span><span class="cut mono-2 wght-2 slnt-0 step-0">v</span><span class="cut mono-3 wght-3 slnt-0 step-2">e</span> <span class="cut mono-1 wght-2 slnt-2 step-1">C</span><span class="cut mono-4 wght-5 slnt-0 step-0">o</span><span class="cut mono-0 wght-1 slnt-3 step-1">d</span><span class="cut mono-3 wght-3 slnt-1 step-0">i</span><span class="cut mono-5 wght-4 slnt-0 step-0">n</span><span class="cut mono-0 wght-2 slnt-3 step-1">g</span> <span class="cut mono-2 wght-2 slnt-5 step-2">V</span><span class="cut mono-2 wght-1 slnt-4 step-3">i</span><span class="cut mono-1 wght-3 slnt-4 step-1">s</span><span class="cut mono-1 wght-3 slnt-0 step-0">u</span><span class="cut mono-5 wght-0 slnt-0 step-0">a</span><span class="cut mono-1 wght-2 slnt-0 step-2">l</span><span class="cut mono-4 wght-1 slnt-3 step-3">s</span> <a class="header-anchor" href="#hydra-live-coding-visuals" aria-hidden="true">#</a></h2><p>Hydra is a browser-based environment for live coding video synthesis, created by <a href="https://ojack.xyz/" target="_blank" rel="noopener">Olivia Jack</a>. You write JavaScript-like code, and it generates real-time visuals - no compilation, no waiting. Change a number and the visual changes instantly.</p><p>The system is built around a small set of sources (oscillators, noise, shapes, gradients, webcam input) that you can transform (rotate, scale, pixelate, kaleidoscope) and combine (blend, multiply, modulate). The modular, chainable syntax means complex visuals emerge from simple operations.</p><h3 id="docs-source" tabindex="-1"><span class="cut mono-5 wght-5 slnt-0 step-0">D</span><span class="cut mono-1 wght-3 slnt-4 step-3">o</span><span class="cut mono-4 wght-1 slnt-0 step-3">c</span><span class="cut mono-2 wght-0 slnt-3 step-3">s</span> <span class="cut mono-4 wght-2 slnt-3 step-0">&amp;</span> <span class="cut mono-2 wght-1 slnt-5 step-1">S</span><span class="cut mono-2 wght-1 slnt-4 step-0">o</span><span class="cut mono-1 wght-2 slnt-1 step-1">u</span><span class="cut mono-5 wght-2 slnt-2 step-0">r</span><span class="cut mono-2 wght-2 slnt-5 step-3">c</span><span class="cut mono-3 wght-1 slnt-5 step-1">e</span> <a class="header-anchor" href="#docs-source" aria-hidden="true">#</a></h3><div class="table-wrapper"><table><thead><tr><th>Resource</th><th>URL</th></tr></thead><tbody><tr><td><strong>Editor</strong></td><td><a href="https://hydra.ojack.xyz" target="_blank" rel="noopener">https://hydra.ojack.xyz</a></td></tr><tr><td><strong>Documentation</strong></td><td><a href="https://hydra.ojack.xyz/docs" target="_blank" rel="noopener">https://hydra.ojack.xyz/docs</a></td></tr><tr><td><strong>Functions</strong></td><td><a href="https://hydra.ojack.xyz/docs/docs/reference" target="_blank" rel="noopener">https://hydra.ojack.xyz/docs/docs/reference</a></td></tr><tr><td><strong>Tutorial Book</strong></td><td><a href="https://hydra-book.glitch.me" target="_blank" rel="noopener">https://hydra-book.glitch.me</a></td></tr><tr><td><strong>Source Code</strong></td><td><a href="https://github.com/hydra-synth/hydra" target="_blank" rel="noopener">https://github.com/hydra-synth/hydra</a></td></tr></tbody></table></div><h3 id="other-live-coding-tools" tabindex="-1"><span class="cut mono-2 wght-2 slnt-1 step-1">O</span><span class="cut mono-2 wght-3 slnt-0 step-1">t</span><span class="cut mono-1 wght-1 slnt-3 step-1">h</span><span class="cut mono-4 wght-1 slnt-1 step-1">e</span><span class="cut mono-5 wght-0 slnt-5 step-3">r</span> <span class="cut mono-5 wght-5 slnt-4 step-2">L</span><span class="cut mono-0 wght-5 slnt-1 step-0">i</span><span class="cut mono-4 wght-4 slnt-4 step-0">v</span><span class="cut mono-0 wght-1 slnt-5 step-3">e</span> <span class="cut mono-2 wght-2 slnt-5 step-3">C</span><span class="cut mono-1 wght-2 slnt-3 step-2">o</span><span class="cut mono-0 wght-2 slnt-1 step-0">d</span><span class="cut mono-5 wght-4 slnt-1 step-1">i</span><span class="cut mono-1 wght-5 slnt-3 step-2">n</span><span class="cut mono-2 wght-1 slnt-3 step-2">g</span> <span class="cut mono-5 wght-3 slnt-1 step-3">T</span><span class="cut mono-2 wght-2 slnt-5 step-0">o</span><span class="cut mono-4 wght-0 slnt-4 step-3">o</span><span class="cut mono-0 wght-2 slnt-4 step-1">l</span><span class="cut mono-0 wght-2 slnt-0 step-3">s</span> <a class="header-anchor" href="#other-live-coding-tools" aria-hidden="true">

1#</a></h3><ul><li><strong>Strudel</strong> - live coding music in the browser: <a href="https://strudel.cc" target="_blank" rel="noopener">strudel.cc</a></li><li><strong>TidalCycles</strong> - Haskell-based music live coding: <a href="https://tidalcycles.org" target="_blank" rel="noopener">tidalcycles.org</a></li><li><strong>Sonic Pi</strong> - live coding music for education and performance: <a href="https://sonic-pi.net" target="_blank" rel="noopener">sonic-pi.net</a></li><li><strong>SuperCollider</strong> - audio synthesis and algorithmic composition: <a href="https://supercollider.github.io" target="_blank" rel="noopener">supercollider.github.io</a></li><li><strong>TOPLAP</strong> - live coding community and resources: <a href="https://toplap.org" target="_blank" rel="noopener">toplap.org</a></li></ul><hr><h2 id="reference-artists-works" tabindex="-1"><span class="cut mono-3 wght-1 slnt-3 step-2">R</span><span class="cut mono-4 wght-2 slnt-5 step-2">e</span><span class="cut mono-3 wght-5 slnt-3 step-1">f</span><span class="cut mono-5 wght-4 slnt-3 step-1">e</span><span class="cut mono-5 wght-4 slnt-2 step-1">r</span><span class="cut mono-1 wght-2 slnt-3 step-3">e</span><span class="cut mono-1 wght-0 slnt-0 step-0">n</span><span class="cut mono-1 wght-2 slnt-3 step-1">c</span><span class="cut mono-2 wght-5 slnt-1 step-3">e</span> <span class="cut mono-1 wght-4 slnt-4 step-2">A</span><span class="cut mono-0 wght-0 slnt-0 step-3">r</span><span class="cut mono-5 wght-5 slnt-4 step-3">t</span><span class="cut mono-4 wght-0 slnt-0 step-2">i</span><span class="cut mono-5 wght-1 slnt-1 step-0">s</span><span class="cut mono-3 wght-2 slnt-1 step-0">t</span><span class="cut mono-1 wght-4 slnt-2 step-0">s</span> <span class="cut mono-4 wght-1 slnt-4 step-2">&amp;</span> <span class="cut mono-4 wght-1 slnt-4 step-0">W</span><span class="cut mono-4 wght-1 slnt-0 step-0">o</span><span class="cut mono-4 wght-1 slnt-2 step-0">r</span><span class="cut mono-3 wght-4 slnt-3 step-1">k</span><span class="cut mono-4 wght-4 slnt-2 step-1">s</span> <a class="header-anchor" href="#reference-artists-works" aria-hidden="true">#</a></h2><h3 id="surveillance-vision-control" tabindex="-1"><span class="cut mono-4 wght-5 slnt-5 step-1">S</span><span class="cut mono-5 wght-0 slnt-0 step-0">u</span><span class="cut mono-3 wght-4 slnt-5 step-1">r</span><span class="cut mono-3 wght-2 slnt-5 step-3">v</span><span class="cut mono-0 wght-0 slnt-5 step-0">e</span><span class="cut mono-1 wght-5 slnt-1 step-0">i</span><span class="cut mono-5 wght-5 slnt-3 step-3">l</span><span class="cut mono-3 wght-4 slnt-3 step-1">l</span><span class="cut mono-4 wght-5 slnt-2 step-1">a</span><span class="cut mono-0 wght-2 slnt-0 step-2">n</span><span class="cut mono-0 wght-4 slnt-4 step-1">c</span><span class="cut mono-1 wght-1 slnt-0 step-3">e</span><span class="cut mono-2 wght-1 slnt-1 step-3">,</span> <span class="cut mono-3 wght-3 slnt-3 step-0">V</span><span class="cut mono-1 wght-2 slnt-2 step-1">i</span><span class="cut mono-2 wght-3 slnt-3 step-2">s</span><span class="cut mono-4 wght-1 slnt-0 step-0">i</span><span class="cut mono-5 wght-2 slnt-0 step-3">o</span><span class="cut mono-2 wght-5 slnt-4 step-2">n</span><span class="cut mono-4 wght-0 slnt-0 step-2">,</span> <span class="cut mono-0 wght-3 slnt-0 step-0">C</span><span class="cut mono-4 wght-2 slnt-0 step-3">o</span><span class="cut mono-4 wght-2 slnt-2 step-2">n</span><span class="cut mono-3 wght-1 slnt-5 step-3">t</span><span class="cut mono-3 wght-0 slnt-3 step-0">r</span><span class="cut mono-1 wght-5 slnt-2 step-2">o</span><span class="cut mono-3 wght-3 slnt-4 step-0">l</span> <a class="header-anchor" href="#surveillance-vision-control" aria-hidden="true">#</a></h3><p><strong>Xu Bing - Dragonfly Eyes</strong> (2017)</p><ul><li>Feature film constructed entirely from surveillance camera footage found online</li><li>Narrative fiction assembled from non-fiction fragments</li><li>Authorship, privacy, and the omnipresence of recording</li><li><a href="https://www.youtube.com/watch?v=JVcnp7RHO8Q" target="_blank" rel="noopener">Trailer on YouTube</a></li></ul><p><strong>!Mediengruppe Bitnik</strong> - <a href="https://wwwwwwwwwwwwwwwwwwwwww.bitnik.org/" target="_blank" rel="noopener">bitnik.org</a></p><ul><li>Swiss art collective working with hacking, surveillance, and network interventions</li><li><strong>Random Darknet Shopper</strong> (2014) - Bot given $100/week to buy random items from darknet markets. Purchased ecstasy, counterfeit goods, a Hungarian passport. Raises questions about agency, legality, and algorithmic action.</li><li><strong>CCTV - A Trail of Images</strong> - Interventions with surveillance cameras, making visible the infrastru

1cture of watching</li><li><strong>Download Finished</strong> - Exploring digital distribution, piracy, and the circulation of cultural goods online</li></ul><p><strong>Manu Luksch - Faceless</strong> (2007)</p><ul><li>Science fiction film made entirely from CCTV footage</li><li>Luksch obtained the footage through UK data protection law (Subject Access Requests), where citizens have the right to request footage of themselves</li><li>Faces of others are blurred by law, creating an eerie, anonymous visual language</li><li><strong>Manifesto for CCTV Filmmakers</strong> - Guidelines for making films from surveillance footage</li></ul><p><strong>Jill Magid - Evidence Locker</strong> (2004)</p><ul><li>31-day performance using Liverpoolâs citywide CCTV network</li><li>Magid wrote love letters to the police, asking them to record her with the cameras</li><li>The footage became a film, the letters became a book</li><li>Intimacy and surveillance, seduction and control</li><li><a href="https://jillmagid.com/projects/evidence-locker-2" target="_blank" rel="noopener">jillmagid.com/projects/evidence-locker</a></li></ul><p><strong>Julia Scher - Security by Julia</strong></p><ul><li>Pioneer of surveillance art since the 1980s</li><li>Installations that put viewers under surveillance, making them aware of being watched</li><li><strong>Maximum Security Society</strong> - Interrogating the normalization of surveillance</li><li><a href="https://www.artforum.com/features/securityland-218780/" target="_blank" rel="noopener">Artforum article</a></li></ul><p><strong>

1Hito Steyerl - How Not to Be Seen: A Fucking Didactic Educational .MOV File</strong> (2013)</p><ul><li>Video essay on visibility, invisibility, and image resolution</li><li>Satirical tutorial on disappearing from surveillance systems</li><li>Explores the politics of representation in the age of digital imaging</li><li><a href="https://www.moma.org/collection/works/181784" target="_blank" rel="noopener">MoMA Docs</a></li></ul><p><strong>Ai Weiwei</strong></p><ul><li><strong>WeiweiCam</strong> (2012) - After being placed under house arrest, Ai set up 24/7 webcams streaming from his studio. Turning surveillance back on itself - if youâre going to watch me, everyone can watch.</li><li><strong>Hansel &amp; Gretel</strong> (2017) - Installation with Herzog &amp; de Meuron at Park Avenue Armory. Visitors were tracked by drones and thermal cameras, their images displayed on screens. Made visible the invisible infrastructure of tracking.</li></ul><h3 id="networks-webrings-independent-web" tabindex="-1"><span class="cut mono-5 wght-3 slnt-0 step-2">N</span><span class="cut mono-4 wght-0 slnt-3 step-3">e</span><span class="cut mono-1 wght-4 slnt-0 step-0">t</span><span class="cut mono-4 wght-1 slnt-1 step-1">w</span><span class="cut mono-3 wght-5 slnt-5 step-3">o</span><span class="cut mono-1 wght-0 slnt-3 step-0">r</span><span class="cut mono-5 wght-2 slnt-1 step-2">k</span><span class="cut mono-4 wght-2 slnt-0 step-1">s</span><span class="cut mono-2 wght-0 slnt-0 step-0">,</span> <span class="cut mono-4 wght-5 slnt-0 step-3">W</span><span class="cut mono-2 wght-0 slnt-5 step-2">e</span><span class="cut mono-0 wght-3 slnt-5 step-0">b</span><span class="cut mono-1 wght-0 slnt-1 step-3">r</span><span class="cut mono-5 wght-4 slnt-5 step-2">i</span><span class="cut mono-2 wght-0 slnt-3 step-1">n</span><span class="cut mono-4 wght-3 slnt-3 step-0">g</span><span class="cut mono-2 wght-5 slnt-2 step-2">s</span><span class="cut mono-0 wght-1 slnt-2 step-0">,</span> <span class="cut mono-2 wght-5 slnt-0 step-2">I</span><span class="cut mono-0 wght-5 slnt-3 step-2">n</span><span class="cut mono-0 wght-4 slnt-4 step-0">d</span><span class="cut mono-2 wght-0 slnt-0 step-1">e</span><span class="cut mono-1 wght-4 slnt-2 step-2">p</span><span class="cut mono-1 wght-5 slnt-2 step-0">e</span><span class="cut mono-4 wght-4 slnt-3 step-0">n</span><span class="cut mono-0 wght-2 slnt-4 step-2">d</span><span class="cut mono-5 wght-3 slnt-0 step-3">e</span><span class="cut mono-5 wght-5 slnt-0 step-3">n</span><span class="cut mono-5 wght-2 slnt-4 step-3">t</span> <span class="cut mono-4 wght-0 slnt-1 step-3">W</span><span class="cut mono-1 wght-3 slnt-0 step-1">e</span><span class="cut mono-4 wght-0 slnt-5 step-3">b</span> <a class="header-anchor" href="#networks-webrings-independent-web" aria-hidden="true">#</a></h3><p><strong>Devine Lu Linvega - XXIIVV</strong></p><ul><li><a href="https://wiki.xxiivv.com/" target="_blank" rel="noopener">wiki.xxiivv.com</a> - Personal wiki documenting tools, projects, philosophy</li><li><a href="https://webring.xxiivv.com/" target="_blank" rel="noopener">webring.xxiivv.com</a> - Webring connecting independent artists, developers, and researchers</li><li><a href="https://github.com/XXIIVV" target="_blank" rel="noopener">github.com/XXIIVV</a></li><li>Part of the <a href="https://merveilles.town" target="_blank" rel="noopener">Merveilles</a> community - a collective interested in sustainability, craftsmanship, and independent technology</li><li>Represents an alternative vision of the web: personal, handmade, interconnected but not centralized</li></ul><p>The webring format is a throwback to early web culture, preceding search engines, where sites linked to each other in loops, creating discovery paths outside of search engines and algorithms. XXIIVVâs webring connects sites that share certain values: independence, craft, sustainability, experimentation.</p><h3 id="fiction-i-like" tabindex="-1"><span class="cut mono-2 wght-3 slnt-5 step-1">F</span><span class="cut mono-4 wght-5 slnt-0 step-3">i</span><span class="cut mono-1 wght-0 slnt-0 step-2">c</span><span class="cut mono-1 wght-3 slnt-3 step-0">t</span><span class="cut mono-2 wght-5 slnt-5 step-0">i</span><span class="cut mono-2 wght-0 slnt-5 step-2">o</span><span class="cut mono-5 wght-2 slnt-0 step-0">n</span> <span class="cut mono-3 wght-5 slnt-3 step-2">I</span> <span class="cut mono-4 wght-0 slnt-5 step-3">l</span><span class="cut mono-0 wght-0 slnt-4 step-1">i</span><span class="cut mono-0 wght-5 slnt-0 step-3">k</span><span class="cut mono-0 wght-5 slnt-4 step-0">e</span><span class="cut mono-3 wght-1 slnt-2 step-3">!</span> <a class="header-anchor" href="#fiction-i-like" aria-hidden="true">

1#</a></h3><p><strong>Robert M. Pirsig - Zen and the Art of Motorcycle Maintenance: An Inquiry into Values</strong> (1974)</p><ul><li>Philosophical novel about a motorcycle journey and an inquiry into &quot;Quality&quot;</li><li>Reconciling rational, technical thinking with intuitive, aesthetic understanding</li><li>For anyone working at the intersection of technology and art - how do we evaluate what we make? What makes something good?</li></ul><p><strong>William Gibson - Pattern Recognition</strong> (2003)</p><ul><li>Novel about Cayce Pollard, a &quot;coolhunter&quot; with an allergic sensitivity to branding</li><li>She becomes obsessed with mysterious film footage appearing anonymously online</li><li>Prescient about viral media, online communities, digital obsession, and the way images circulate in networks</li><li>Gibsonâs earlier work - <strong>Neuromancer</strong> (1984), <strong>Count Zero</strong> (1986) - coined &quot;cyberspace&quot;, cyberpunk</li></ul><p>Both books are useful, even if polemic, for thinking about the relationship between humans and technology, the search for meaning in mediated environments, and the aesthetics of systems.</p><hr><h2 id="links-summary" tabindex="-1"><span class="cut mono-1 wght-5 slnt-1 step-2">L</span><span class="cut mono-0 wght-3 slnt-2 step-0">i</span><span class="cut mono-5 wght-4 slnt-5 step-3">n</span><span class="cut mono-5 wght-2 slnt-1 step-2">k</span><span class="cut mono-0 wght-3 slnt-3 step-0">s</span> <span class="cut mono-2 wght-3 slnt-0 step-0">S</span><span class="cut mono-4 wght-5 slnt-4 step-1">u</span><span class="cut mono-4 wght-0 slnt-1 step-3">m</span><span class="cut mono-1 wght-1 slnt-3 step-2">m</span><span class="cut mono-5 wght-4 slnt-2 step-2">a</span><span class="cut mono-4 wght-0 slnt-5 step-1">r</span><span class="cut mono-3 wght-2 slnt-2 step-2">y</span> <a class="header-anchor" href="#links-summary" aria-hidden="true">#</a></h2><h3 id="my-projects" tabindex="-1"><span class="cut mono-4 wght-0 slnt-2 step-1">M</span><span class="cut mono-3 wght-3 slnt-5 step-0">y</span> <span class="cut mono-5 wght-2 slnt-1 step-2">P</span><span class="cut mono-5 wght-3 slnt-4 step-0">r</span><span class="cut mono-5 wght-3 slnt-3 step-3">o</span><span class="cut mono-3 wght-5 slnt-2 step-3">j</span><span class="cut mono-0 wght-3 slnt-2 step-3">e</span><span class="cut mono-5 wght-3 slnt-2 step-0">c</span><span class="cut mono-3 wght-0 slnt-5 step-0">t</span><span class="cut mono-1 wght-1 slnt-4 step-2">s</span> <a class="header-anchor" href="#my-projects" aria-hidden="true">#</a></h3><p>you are on the portfolio already! go <a href="../">up</a>, or to the <a href="../../">root</a>, or the <a href="../../projects">projects page</a>.</p><h3 id="cctv-surveillance-resources" tabindex="-1"><span class="cut mono-3 wght-4 slnt-2 step-1">C</span><span class="cut mono-1 wght-1 slnt-2 step-0">C</span><span class="cut mono-4 wght-4 slnt-2 step-3">T</span><span class="cut mono-0 wght-0 slnt-0 step-0">V</span> <span class="cut mono-3 wght-0 slnt-1 step-0">&amp;</span> <span class="cut mono-1 wght-2 slnt-0 step-0">S</span><span class="cut mono-1 wght-4 slnt-2 step-1">u</span><span class="cut mono-1 wght-3 slnt-2 step-3">r</span><span class="cut mono-1 wght-2 slnt-1 step-3">v</span><span class="cut mono-2 wght-5 slnt-3 step-3">e</span><span class="cut mono-1 wght-4 slnt-4 step-1">i</span><span class="cut mono-1 wght-1 slnt-1 step-1">l</span><span class="cut mono-3 wght-5 slnt-4 step-2">l</span><span class="cut mono-2 wght-0 slnt-3 step-0">a</span><span class="cut mono-2 wght-1 slnt-5 step-2">n</span><span class="cut mono-2 wght-3 slnt-2 step-2">c</span><span class="cut mono-3 wght-2 slnt-4 step-2">e</span> <span class="cut mono-5 wght-2 slnt-2 step-2">R</span><span class="cut mono-5 wght-3 slnt-1 step-0">e</span><span class="cut mono-0 wght-5 slnt-2 step-1">s</span><span class="cut mono-0 wght-2 slnt-3 step-0">o</span><span class="cut mono-5 wght-3 slnt-1 step-2">u</span><span class="cut mono-0 wght-1 slnt-4 step-2">r</span><span class="cut mono-5 wght-2 slnt-2 step-1">c</span><span class="cut mono-3 wght-4 slnt-1 step-0">e</span><span class="cut mono-4 wght-5 slnt-2 step-1">s</span> <a class="header-anchor" href="#cctv-surveillance-resources" aria-hidden="true">

1#</a></h3><div class="table-wrapper"><table><thead><tr><th>Resource</th><th>Link</th></tr></thead><tbody><tr><td>Insecam (camera aggregator)</td><td><a href="http://www.insecam.org/en/bycountry/ch/" target="_blank" rel="noopener">http://www.insecam.org/en/bycountry/ch/</a></td></tr><tr><td>Shodan (device search)</td><td><a href="https://www.shodan.io" target="_blank" rel="noopener">https://www.shodan.io</a></td></tr><tr><td>Etna Volcanic Stream</td><td><a href="https://www.ct.ingv.it/sezioniesterne/StreamingEtna.php" target="_blank" rel="noopener">https://www.ct.ingv.it/sezioniesterne/StreamingEtna.php</a></td></tr><tr><td>YouTube first uploads</td><td><a href="https://walzr.com/IMG_0001" target="_blank" rel="noopener">https://walzr.com/IMG_0001</a></td></tr></tbody></table></div><h3 id="hydra-live-coding" tabindex="-1"><span class="cut mono-5 wght-4 slnt-3 step-0">H</span><span class="cut mono-4 wght-5 slnt-5 step-0">y</span><span class="cut mono-3 wght-4 slnt-2 step-0">d</span><span class="cut mono-2 wght-2 slnt-0 step-0">r</span><span class="cut mono-0 wght-4 slnt-2 step-0">a</span> <span class="cut mono-5 wght-5 slnt-2 step-2">&amp;</span> <span class="cut mono-1 wght-3 slnt-5 step-3">L</span><span class="cut mono-2 wght-4 slnt-3 step-0">i</span><span class="cut mono-1 wght-0 slnt-3 step-3">v</span><span class="cut mono-3 wght-3 slnt-4 step-1">e</span> <span class="cut mono-3 wght-3 slnt-0 step-3">C</span><span class="cut mono-2 wght-5 slnt-1 step-2">o</span><span class="cut mono-4 wght-3 slnt-0 step-3">d</span><span class="cut mono-4 wght-3 slnt-0 step-0">i</span><span class="cut mono-2 wght-1 slnt-0 step-3">n</span><span class="cut mono-2 wght-0 slnt-5 step-3">g</span> <a class="header-anchor" href="#hydra-live-coding" aria-hidden="true">#</a></h3><div class="table-wrapper"><table><thead><tr><th>Tool</th><th>Link</th></tr></thead><tbody><tr><td>Hydra Editor</td><td><a href="https://hydra.ojack.xyz" target="_blank" rel="noopener">https://hydra.ojack.xyz</a></td></tr><tr><td>Hydra Docs</td><td><a href="https://hydra.ojack.xyz/docs" target="_blank" rel="noopener">https://hydra.ojack.xyz/docs</a></td></tr><tr><td>Hydra Functions</td><td><a href="https://hydra.ojack.xyz/functions/" target="_blank" rel="noopener">https://hydra.ojack.xyz/functions/</a></td></tr><tr><td>Hydra Book</td><td><a href="https://hydra-book.glitch.me" target="_blank" rel="noopener">https://hydra-book.glitch.me</a></td></tr><tr><td>Hydra GitHub</td><td><a href="https://github.com/hydra-synth/hydra" target="_blank" rel="noopener">https://github.com/hydra-synth/hydra</a></td></tr><tr><td>Strudel</td><td><a href="https://strudel.cc" target="_blank" rel="noopener">https://strudel.cc</a></td></tr><tr><td>TidalCycles</td><td><a href="https://tidalcycles.org" target="_blank" rel="noopener">https://tidalcycles.org</a></td></tr><tr><td>Sonic Pi</td><td><a href="https://sonic-pi.net" target="_blank" rel="noopener">https://sonic-pi.net</a></td></tr><tr><td>TOPLAP</td><td><a href="https://toplap.org" target="_blank" rel="noopener">https://toplap.org</a></td></tr></tbody></table></div><h3 id="reference-artists-works-1" tabindex="-1"><span class="cut mono-3 wght-1 slnt-3 step-2">R</span><span class="cut mono-4 wght-2 slnt-5 step-2">e</span><span class="cut mono-3 wght-5 slnt-3 step-1">f</span><span class="cut mono-5 wght-4 slnt-3 step-1">e</span><span class="cut mono-5 wght-4 slnt-2 step-1">r</span><span class="cut mono-1 wght-2 slnt-3 step-3">e</span><span class="cut mono-1 wght-0 slnt-0 step-0">n</span><span class="cut mono-1 wght-2 slnt-3 step-1">c</span><span class="cut mono-2 wght-5 slnt-1 step-3">e</span> <span class="cut mono-1 wght-4 slnt-4 step-2">A</span><span class="cut mono-0 wght-0 slnt-0 step-3">r</span><span class="cut mono-5 wght-5 slnt-4 step-3">t</span><span class="cut mono-4 wght-0 slnt-0 step-2">i</span><span class="cut mono-5 wght-1 slnt-1 step-0">s</span><span class="cut mono-3 wght-2 slnt-1 step-0">t</span><span class="cut mono-1 wght-4 slnt-2 step-0">s</span> <span class="cut mono-4 wght-1 slnt-4 step-2">&amp;</span> <span class="cut mono-4 wght-1 slnt-4 step-0">W</span><span class="cut mono-4 wght-1 slnt-0 step-0">o</span><span class="cut mono-4 wght-1 slnt-2 step-0">r</span><span class="cut mono-3 wght-4 slnt-3 step-1">k</span><span class="cut mono-4 wght-4 slnt-2 step-1">s</span> <a class="header-anchor" href="#reference-artists-works-1" aria-hidden="true">

1#</a></h3><div class="table-wrapper"><table><thead><tr><th>Artist/Work</th><th>Link</th></tr></thead><tbody><tr><td>Xu Bing - Dragonfly Eyes</td><td><a href="https://www.youtube.com/watch?v=A0fedg-Skns" target="_blank" rel="noopener">https://www.youtube.com/watch?v=A0fedg-Skns</a></td></tr><tr><td>!Mediengruppe Bitnik</td><td><a href="https://wwwwwwwwwwwwwwwwwwwwww.bitnik.org/" target="_blank" rel="noopener">https://wwwwwwwwwwwwwwwwwwwwww.bitnik.org/</a></td></tr><tr><td>Jill Magid - Evidence Locker</td><td><a href="https://jillmagid.com/projects/evidence-locker-2" target="_blank" rel="noopener">https://jillmagid.com/projects/evidence-locker-2</a></td></tr><tr><td>Julia Scher</td><td><a href="https://www.artforum.com/features/securityland-218780/" target="_blank" rel="noopener">https://www.artforum.com/features/securityland-218780/</a></td></tr><tr><td>Hito Steyerl - How Not to Be Seen</td><td><a href="https://www.moma.org/collection/works/181784" target="_blank" rel="noopener">https://www.moma.org/collection/works/181784</a></td></tr><tr><td>Devine Lu Linvega - XXIIVV</td><td><a href="https://wiki.xxiivv.com/" target="_blank" rel="noopener">https://wiki.xxiivv.com/</a></td></tr><tr><td>XXIIVV Webring</td><td><a href="https://webring.xxiivv.com/" target="_blank" rel="noopener">https://webring.xxiivv.com/</a></td></tr><tr><td>Merveilles</td><td><a href="https://merveilles.town" target="_blank" rel="noopener">https://merveilles.town</a></td></tr><tr><td>Roberta Caravalho</td><td><a href="https://www.robertacarvalho.art.br/" target="_blank" rel="noopener">https://www.robertacarvalho.art.br/</a></td></tr></tbody></table></div>',97))])))};export{c as default};

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.