public/uni
2
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity
182 Commits 1 Branch 1 Tag
875721c2cd98eeed264e05d35384086fd25301ab
Commit Graph
20 Commits
Author SHA1 Message Date
libretech 875721c2cd 223015b phase 3: usb-c-drei-achsen demo (kap4 folie 21 zentraler aha-moment). drei spalten: stecker blau (form, USB-C, 24 pins, beidseitig), kabel orange (was elektrisch durchgeht: charge-only 5W / USB 2.0 480 Mbit + 60W / USB 3.2 Gen 2 10 Gbit + 100W / Thunderbolt 4 40 Gbit + 240W), protokoll lila (sprache: USB-PD / USB 2-4 / Thunderbolt 3-4 / DisplayPort Alt / HDMI Alt). konkretes szenario 'warum lädt der laptop nicht' zeigt wie die drei achsen unabhängig versagen können. verdict 'drei achsen, drei unabhängige fragen, drei gründe warum nicht funktioniert. checkfolge: stecker passt → kabel-spec → protokoll-support'. didaktisches kernkonzept: USB-C-verwirrung kommt daher dass studierende denken 'gleicher stecker = gleiche funktion' — falsch 2026-05-14 12:01:09 +02:00
libretech e85fd456c7 223015b phase 3: jpeg-pipeline demo (kap3 folie 11 'JPEG 6-schritte übersicht'). horizontal pipeline foto roh 36 MB → 6 schritte → JPEG 3.5 MB. schritte 1 farbraum RGB→Y'CbCr (blau lossless), 2 chroma-subsampling Cb&Cr auf ¼ (orange lossy), 3 8×8 blöcke (blau), 4 DCT frequenz-zerlegung (blau), 5 quantisierung hohe-frequenzen-raus (orange lossy), 6 huffman verlustfrei kürzen (blau). legende mit farb-code blau=lossless orange=lossy. verdict 'der quanten-schritt ist das ganze geheimnis von JPEG. schritte 1/3/4/6 verlieren nichts. schritt 2 wirft farb-detail weg. schritt 5 entscheidet wie viel frequenz-detail verloren geht (quality-stufe). niedrige quality = aggressivere schritt-5-quantisierung' 2026-05-14 11:53:37 +02:00
libretech e5b14b798d 223015b phase 3: raster-vs-vektor demo (kap3 folie 5-8 raster vs vektor). zwei-spalten häkchen-vergleich: raster (orange, PNG/JPEG/GIF) zeigt häkchen als 12 pixel-blöcke, zoom 4x macht pixelig, 2112 byte speicher 'pixelig - information ist erschöpft'. vektor (blau, SVG/PDF/schriftarten) zeigt häkchen als polyline-anweisung, zoom 4x bleibt scharf, ~80 byte 'scharf - wird neu berechnet'. verdict 'pixel festgenagelt vs vektor neu berechnet bei zoom. foto→raster (nicht neu berechnen), logo/icon/schrift→vektor (skalierbar ohne verlust)'. ersetzt 3 NEU-demos aus bogen (pixel-gitter, raster-zoom, vektor-skalierung) durch eine konsolidierte vergleichs-demo 2026-05-14 11:52:25 +02:00
libretech 67189df88c 223015b phase 3: summary-kap02 demo (kap2 folie 22 zusammenfassung). zwei spalten: verlustfrei grün (redundanz raus, umkehrbar, RLE/Huffman/Deflate, ZIP/PNG/FLAC/RAW, faktor 2x-5x) vs verlustbehaftet rot (irrelevanz raus, nicht umkehrbar, psychoakustik/psychovisualität, MP3/AAC/JPEG/H.264, faktor 10x-100x) mit key-value rows pro spalte (was passiert, umkehrbar, verfahren/trick, formate, faktor). drunter entscheidungsmatrix mit 6 szenarien mapped zu lossless/lossy (foto-archiv RAW lossless, spotify lossy, code-repo zip lossless, instagram jpeg lossy, studio-master flac lossless, youtube h.264 lossy). verdict 'lossless für archiv und code, lossy für streaming und anzeige. faustregel: werkzeug → lossless, konsum → lossy' 2026-05-14 11:43:43 +02:00
libretech fbd75994d4 223015b phase 3: psychovisualitaet-grafik demo (kap2 folie 14 'luminanz vor chrominanz'). zwei-spalten-vergleich: links 4:4:4 ohne subsampling (Y/Cb/Cr alle 100%, datenmenge 100%) vs rechts 4:2:0 JPEG/H.264 standard (Y 100%, Cb/Cr 25%, datenmenge 50%). beide spalten zeigen identisches sunset-bild — das auge sieht den unterschied nicht weil farb-auflösung nicht so scharf wahrgenommen wird wie helligkeit. verdict 'halbe datenmenge, identisches bild — JPEG/H.264/H.265/WebP reduzieren alle die farb-auflösung auf ein viertel. was wir nicht scharf sehen muss man nicht scharf speichern' 2026-05-14 11:42:30 +02:00
libretech 7ec889d51c 223015b phase 3: psychoakustik-grafik demo (kap2 folie 13 'was MP3 weglässt'). lautstärke-frequenz-chart: orange gestrichelte hörschwelle (in ruhe, niedrig bei 1-4 khz, hoch unten/oben), blauer 'masker' bei 1 khz 90 dB, blauer maskierungs-bereich als kegel um den masker, grüne dots 'bleibt' für töne außerhalb (hörbar), graue dots 'raus' für töne innerhalb des maskierungs-bereichs (unhörbar). achsen 20 hz - 20 khz log + 0 - 100 dB. legende inline. verdict 'MP3 kodiert nur was über der kombinierten schwelle liegt. ~90% daten weg ohne dass mensch im alltag etwas vermisst' 2026-05-14 11:41:12 +02:00
libretech 9d527aed7a 223015b phase 3: summary-organizer demo (kap1 folie 40 zusammenfassung). spiegelt pivot-signal-zu-byte aber mit beiden strangs ausformuliert: welt → byte (pink, links): sampling-rate, bittiefe, datenrate-formel, nyquist 2f, aliasing+moiré, 44.1 khz; byte → bedeutung (cyan, rechts): bit/byte/hex, 8 bit = 256 zustände, ASCII+UTF-8, magic number, KB vs KiB, hex im alltag. mitte: datei mit hex-bytes als verbindungsstück. verdict 'eine datei ist kein mysterium — eine reihe von zahlen mit zwei geschichten dran: eine erzählt woher die zahlen kommen, die andere was sie bedeuten. beide kennst du jetzt'. kap1-demos jetzt komplett (6 NEU: drei-dateien, kb-vs-kib, pivot, nyquist, aliasing-paar, summary) 2026-05-14 11:29:32 +02:00
libretech a12d9d2146 223015b phase 3: aliasing-paar demo (kap1 folie 37 'aliasing in audio + bild parallel'). zwei-spalten audio-orange / bild-blau, jeweils mit original (schnelle welle / dichte streifen) vs gesampelt (alias-welle mit faded original / breite moiré-bänder). audio: 18 khz → 22 khz sampling → 4 khz brumm. bild: 93 feine linien → 5 breite bänder. ear-eye-headlines: 'was das ohr hört' bzw 'was das auge sieht' machen pädagogisch klar dass es um wahrnehmung geht. verdict 'aliasing kennt keine modalität — es ist ein mathematischer fehler, kein technischer. egal ob ton/bild/video/radar/gps — sampling immer doppelt so dicht wie signal'. moiré via svg linear-gradient gefakt (echte moiré-darstellung in svg unmöglich da chromium subpixel-präzise rendert) 2026-05-14 11:27:40 +02:00
libretech fc941c6ac3 223015b phase 3: nyquist-diagram demo (kap1 folie 35 nyquist-theorem). drei vergleichs-cases mit derselben grundwelle (8 cycles über 880px svg): (1) aliasing rot f_s=0.9f, 8 sample-punkte sitzen mathematisch korrekt auf der welle und ergeben verbunden eine ganz andere langsamere kurve, (2) nyquist-grenze gelb f_s=2f, 16 punkte exakt auf peak/tal und zigzag-verbindung zeigt mathematisches minimum, (3) überabtastung grün f_s=8f mit 64 dichten punkten die der welle treu folgen wie eine CD. punkte mit python berechnet (y = 70 - 45*sin(2π*(x-20)/105) für jede sample-position). verdict erklärt 44,1 khz: ohr hört bis 20 khz, 2x20=40 plus 4,1 sicherheitsmarge 2026-05-14 11:25:50 +02:00
libretech 478966903a 223015b phase 3: pivot-signal-zu-byte demo (kap1 folie 27 strang-wechsel). 5-spalten layout welt → sampling+quantisierung (pink 'jetzt dran') → datei (dark center mit hex-bytes) → notation/encoding/format (grau durchgestrichen 'schon durch') → mensch. verdict 'die datei ist die mitte. beide wege führen durch sie hindurch' + erklärung rechts=gelernt links=jetzt. didaktisch: macht den strang-wechsel explizit sichtbar damit studierende nicht den faden verlieren wenn das thema von 'datei → bedeutung' zu 'welt → datei' kippt 2026-05-14 11:17:57 +02:00
libretech de166cf27d 223015b phase 3: kb-vs-kib demo (kap1 folie 25 'KB vs KiB — warum 931 GB?'). zwei panel-vergleich: marketing (1 TB blau, 10^12 byte) vs betriebssystem (931 GB orange, eigentlich 931 GiB), mit pfeil 'geteilt durch 2^30' dazwischen. math-box mit rechnung 10^12 ÷ 2^30 ≈ 931,3 GiB, plus zeile 'etikett: GB · anzeige: GB · bedeutung: zwei verschiedene dinge'. verdict 'es fehlt nichts. es wird nur in zwei sprachen gezählt' mit code-tag-erklärung GiB/GB. lebensweltanker: 1-TB-SSD-etikett, kein emoji 2026-05-14 11:16:43 +02:00
libretech 42ca2e5c83 223015b phase 3: drei-dateien demo (kap1 folie 3 'drei dateien — dasselbe innenleben'). drei spalten: foto/sprachnachricht/PDF mit jeweils thumbnail (svg sunset/waveform/document) + hex-strip mit erstem byte + magic-number in farbe markiert (89 50 4E 47 für PNG, 49 44 33 für ID3, 25 50 44 46 für %PDF) + ascii-übersetzung. verdict 'drei verschiedene dinge — eine sprache: jede datei beginnt mit ihrer visitenkarte (magic number)'. stilreferenz wie kap03-eroeffner (3-spalten-cards mit farbigen rahmen), keine emojis 2026-05-14 11:14:57 +02:00
libretech 1a79289349 223015b phase 3b: kap05-eroeffner (distribution+metadaten als 3-schichten-foto-szenario). smartphone-foto stuttgart→tokyo zeigt: inhalt (svg sunset-city), gepäck (echte EXIF mit kamera/belichtung/zeitstempel/GPS-koordinaten königstraße in pink/software/farbprofil), weg (route-strip mit DNS→TLS→CDN-edge-tokyo + HTTP/3 200 OK headers). drei verschiedene visuelle stile pro schicht (panel-grid + horizontaler strip), nicht pipeline wie kap04. GPS-koords als privacy-anker (mcafee-fall vorbereiten). verdict: eine datei = inhalt + gepäck + weg, drei schichten, eine datei. window 1280x860, no emojis 2026-05-14 11:12:06 +02:00
libretech 68c18ea631 223015b phase 3b: kap04-eroeffner committed (datei-reise als pipeline ssd→laptop→gpu→monitor→auge mit echten bandbreiten 3200 mb/s usb4, 7000 mb/s pcie 4.0, 2200 mb/s hdmi 2.1 und 4k-trailer 1.2 gb szenario). zeigt: speicher und schnittstelle sind keine zwei themen sondern zwei seiten desselben engpasses. rohbild-pixelstrom mit 1.4 gb/s niemals als datei. layout: stationen mit farbcodierten rahmen + links mit raten+protokoll dazwischen, scenario-box mit erklärung, verdict-pinkbox mit kernsatz 2026-05-14 11:08:16 +02:00
libretech f573e9d78b 223015b phase 3b: 2 konkrete eröffner-demos (statt schablone) + STATUS.md für branch-fortsetzung. kap02-eroeffner: FLAC vs MP3-128 mit synth-svg-wellenformen, echten dateigrößen (5.3 MB vs 0.48 MB), bitrate-vergleich, verdict-frage 'hört man den unterschied'. kap03-eroeffner: 3×3-tabelle bild/audio/video × roh/lossy-modern/lossy-aggressiv mit echten zahlen (foto 36MB→4MB→800KB, audio 5.3MB→720KB→240KB, video 12GB→94MB→45MB) + visuelle größenbalken + verdict mit reduktionsfaktoren ×45/×22/×270 und drei verschiedenen wahrnehmungs-tricks pro modalität. kap4+5 eröffner noch offen, status-doc beschreibt nächste schritte für branch-fortsetzung von unterwegs 2026-05-14 10:44:41 +02:00
libretech 1c8185ba10 223015b: 5 advance organizers verworfen — plump, gleichförmig, nicht erkenntnisgewinnend (alle nach gleicher schablone: header → topic-boxen → konvergenz-pinkbox, also nur kapitel-titel in diagramm-form statt struktur/spannung sichtbar machen). zusätzlich emoji-icons in mehreren demos (verstoß gegen no-emoji-konvention). neue strategie: pro kapitel eigene konkrete eröffner-grafik (nicht schablone), z.B. wellenform-vergleich FLAC/MP3 für kap2, JPEG-degradation-paar für kap3, datei-reise-pfad mit datenraten für kap4, foto-mit-EXIF-overlay für kap5. kap1 nutzt byte-fuer-byte als eröffner (kein zusätzliches organizer-bild nötig) 2026-05-14 03:19:06 +02:00
libretech ff21ce9d47 223015b phase 3a: 5 advance organizers gebaut (eröffnungs-folie pro kapitel) — kap01 welt→datei→mensch mit signal-rein/bedeutung-raus split, kap02 lossless vs lossy mit konvergenz zu wann-was, kap03 drei modalitäten (bild/audio/video) unter wahrnehmungs-lücken mit patent-politik-fußnote, kap04 wohnen-vs-reisen (speicher/schnittstellen) mit anwendungs-wahl, kap05 weg-vs-gepäck (distribution/metadaten) mit 'aufmerksamkeit für das was wir nicht sehen' als roter faden. stil-vorlage three-views.html + byte-fuer-byte.html (light-bg, colored-poles, pink-konvergenz, mono-code-blöcke). pro html: chromium-headless render 1280x680-800px, png visuell inspiziert 2026-05-14 03:02:43 +02:00
libretech f35789d943 223015b 01-grundlagen: encoding+hex strukturiert — encoding-strang (problem→ASCII→unicode→byte zählen) und darstellungs-strang (WTF!?→8-bit→hex→demos) getrennt statt verschachtelt, 3 brücken-folien (ASCII reicht für englisch / byte für byte als advance organizer / hex ist überall), byte-für-byte demo (3 fenster bin/hex/text mit binärdatei-vs-textdatei-marker), lv-original-vs-fake bild ersetzt leere folie zwischen lossless-titles, 'besser erkennen' → 'besser erkennbar', singular Byte plural in eigener brücke korrigiert 2026-05-13 22:53:45 +02:00
libretech a000cdbc8d 223015b: neuauflage ascii-tabelle + sync byte-nibble-hex/hex-dec-table aus c 
- ascii-table.html: 16x8 grid, kategorie-gefärbt (ctrl/digit/upper/lower/punct/del)
  hex+dezimal pro zelle, legende, beispiel-zeile
- byte-nibble-hex + hex-dec-table aus 223015c kopiert für slide-parität
 2026-04-26 22:04:36 +02:00
libretech 1d29a9f03c neue viz: three-views, why-8-bit, byte-flow (beide kurse) 
- three-views.html: bitstream/hex/bedeutung — gleiche bytes drei perspektiven (PNG-header)
- why-8-bit.html: speicher-adressierung byteweise, halbe byte unmöglich
- byte-flow.html: 1 byte = 8 bit = 2 hex = 1 ASCII (Hello, World!) jeder rahmen ein byte
- screenshots in beide assets/demos ordner
 2026-04-26 22:04:28 +02:00