Ein interaktiver, barrierefreier Leitfaden für forensische Software-Auswertung
- Überblick
- Features
- Projektstruktur
- Installation
- Verwendung
- Entwicklung
- Barrierefreiheit
- Roadmap
- Projekttagebuch
- Mitwirken
- Lizenz
Der AXIOM Forensische Leitfaden ist eine webbasierte, interaktive Anwendung zur Unterstützung von Polizeimitarbeitern bei der forensischen Auswertung mit Magnet AXIOM Examiner. Das Projekt kombiniert statische Anleitungen mit einem intelligenten, situationsabhängigen Assistenten ("Spürhund Rex"), der Benutzer durch komplexe Workflows führt.
- Polizeimitarbeiter ohne forensische IT-Kenntnisse
- IT-Laien in Ermittlungsbehörden
- Vorsichtige, nicht-experimentierfreudige Benutzer
- Ebene A: Statische Anleitung (klassischer Leitfaden mit progressiver Detailtiefe)
- Ebene B: Dynamischer Agent-Begleiter (kontextabhängige Führung und Erklärungen)
- Ebene 1 (Basis): Grundlegende Schritte und Übersicht
- Ebene 2 (Standard): Wichtigste Einstellungen und Erklärungen
- Ebene 3 (Vollständig): Alle Details, Optionen und Best Practices
- Situationsabhängiger KI-Begleiter
- JSON-basiertes Dialog-System
- Chat-Interface mit Quick-Actions
- Automatische Trigger bei Section-Eintritt
- Kontextuelle Einblendungen im Leitfaden
- Inline-Hilfe-Trigger
- Dynamisches Inhaltsverzeichnis
- Automatische Hervorhebung der aktiven Section
- Doppelklick zum Springen zu Abschnitten
- Kollabierbare Struktur
- Persistenter Notizblock (localStorage)
- Auto-Save Funktion
- Copy & Paste Support
- Sidebar rechts, ausklappbar
- History aller besuchten Abschnitte
- Zeitstempel (relativ/absolut umschaltbar)
- Klickbare Einträge zur Navigation
- localStorage-Persistenz
- 10+ wechselnde Tipps zu Tastenkombinationen
- Automatischer Wechsel alle 15 Sekunden
- Manuelle Navigation (vor/zurück)
- Ein-/ausblendbar
- Dynamische Anzeige der aktuellen Position
- Klickbar zum Zurückspringen
- Responsive Darstellung
- Aktive Sections: 100% Opazität
- Nicht-fokussierte Sections: 60% Opazität
- Intersection Observer für Performance
WebAssistantForensics/
│
├── README.md # Diese Datei
├── LICENSE # Lizenzinformationen
├── run-webserver.sh # Einen lokalen Webserver auf Port 9999 starten
│
├── src/ # Quellcode
│ ├── index.html # Haupt-HTML-Datei
│ ├── styles.css # Haupt-Styling
│ ├── script.js # Haupt-JavaScript
│ ├── agent.css # Agent-spezifisches Styling
│ ├── agent.js # Agent-Funktionalität
│ └── agent-dialogs.json # Agent Dialog-Daten (JSON)
│
├── assets/ # Medien und Ressourcen
│ ├── images/ # Screenshots, Mockups
│ ├── videos/ # Tutorial-Videos, GIFs
│ └── icons/ # Icons, Favicons
│
├── manuals/ # Implementationsleitfäden
│ ├── agent-implementation.md # Agent-Implementierung
│ ├── feature-documentation.md # Feature-Dokumentation
│ ├── json-structure.md # JSON-Struktur Spezifikation
│ └── testing-guide.md # Testing-Anleitung
│
├── project-diary/ # Projekttagebuch
│ ├── day_summary.001.md # Tag 1 Zusammenfassung
│ ├── day_summary.002.md # Tag 2 Zusammenfassung
│ ├── day_summary.00X.md # Tag X Zusammenfassung
│ └── prompts/ # Prompt-Archiv
│ ├── prompt_001_grundstruktur.md
│ ├── prompt_002_agent.md
│ └── ...
│
├── docs/ # Zusätzliche Dokumentation
│ ├── api/ # API-Dokumentation
│ ├── architecture/ # Architektur-Diagramme
│ └── user-guide/ # Benutzer-Handbuch
│
├── tests/ # Test-Dateien
│ ├── unit/ # Unit-Tests
│ ├── integration/ # Integrations-Tests
│ └── accessibility/ # Barrierefreiheit-Tests
│
└── build/ # Build-Output (optional)
├── dist/ # Produktions-Build
└── temp/ # Temporäre Build-Dateien
- index.html: Haupt-HTML mit vollständigem Leitfaden-Content
- styles.css: Alle Styles inkl. responsive Design
- script.js: Kern-Funktionalität (Navigation, Verlauf, Tipps, etc.)
- agent.css: Spürhund-spezifisches Styling (Chat, Trigger, etc.)
- agent.js: Agent-Engine und Dialog-Handling
- agent-dialogs.json: Dialog-Definitionen für den Agenten
Markdown-Dateien mit detaillierten Anleitungen für Entwickler:
- Implementierung neuer Features
- JSON-Struktur-Spezifikationen
- Testing-Szenarien
- Best Practices
Chronologische Dokumentation des Projektfortschritts:
- day_summary.XXX.md: Tägliche Zusammenfassungen
- prompts/: Verwendete Prompts und deren Antworten
Bilder, Videos, Icons für den Leitfaden
Erweiterte Dokumentation für verschiedene Zielgruppen
Automatisierte und manuelle Test-Suites
- Moderner Webbrowser (Chrome 90+, Firefox 88+, Edge 90+, Safari 14+)
- Kein Webserver erforderlich (läuft lokal)
- JavaScript muss aktiviert sein
-
Repository klonen/herunterladen
git clone [repository-url] cd axiom-forensic-guide -
Dateien lokal öffnen
- Navigieren Sie zu
/src/ - Öffnen Sie
index.htmldirekt im Browser - Fertig! Keine Build-Schritte erforderlich
- Navigieren Sie zu
Falls Sie die Dateien über einen Webserver bereitstellen möchten:
# Mit Python 3
cd src/
python -m http.server 9999
# Mit Node.js (http-server)
npx http-server ./src -p 9999
# Mit PHP
cd src/
php -S localhost:9999Dann öffnen Sie: http://localhost:9999
oder verwenden Sie das Script run-webserver.sh, um den Webserver mit NetCat, Node.js, Python 3, PHP, Busybox, Ruby oder WebFS zu starten.
- Leitfaden öffnen:
index.htmlim Browser öffnen - Detailgrad wählen: Buttons oben rechts (1/2/3) oder Alt+1/2/3
- Navigation nutzen:
- Hamburger-Menü (oben links) für alle Features
- Breadcrumb zur Orientierung
- Sidebar (links) für Inhaltsverzeichnis
- Spürhund aktivieren:
- Button rechts (🐕🦺) klicken
- Oder auf Inline-Trigger im Text klicken
- Notizen machen: Notizblock-Button rechts (📝)
| Kombination | Aktion |
|---|---|
Alt + 1 |
Detailgrad: Basis |
Alt + 2 |
Detailgrad: Standard |
Alt + 3 |
Detailgrad: Vollständig |
ESC |
Schließt geöffnete Overlays |
- HTML-Struktur in
index.html:
<section class="content-section"
id="section-mein-abschnitt"
data-section="mein-abschnitt"
data-title="Mein Abschnitt">
<div id="mein-abschnitt-intro" class="detail-level-1">
<h2 id="mein-abschnitt-heading">Mein Abschnitt</h2>
<p id="mein-abschnitt-intro-text">Basis-Text...</p>
</div>
<div id="mein-abschnitt-details" class="detail-level-2">
<p>Standard-Details...</p>
</div>
<div id="mein-abschnitt-advanced" class="detail-level-3">
<p>Vollständige Informationen...</p>
</div>
</section>- Agent-Dialog in
agent-dialogs.json:
{
"contexts": {
"mein-kontext": {
"id": "mein-kontext",
"initialMessage": "<p>Hilfe zu diesem Abschnitt...</p>",
"actions": [ /* ... */ ]
}
},
"sectionTriggers": {
"mein-abschnitt": {
"sectionId": "mein-abschnitt",
"contextId": "mein-kontext",
"autoOpen": false,
"showNotification": true
}
}
}Detaillierte Anleitungen finden Sie in /manuals/.
- Frontend: Vanilla HTML5, CSS3, JavaScript (ES6+)
- Storage: localStorage (Browser)
- APIs: Intersection Observer, Web Storage API
- Build: Keine Build-Tools erforderlich (optional: Minification)
- Semantisches HTML5
- ARIA-Attribute für Barrierefreiheit
- Eindeutige IDs nach Schema:
{section}-{element}-{nummer}
- BEM-ähnliche Namenskonvention
- Mobile-First Approach
- CSS Custom Properties für Themes (geplant)
- ES6+ Features
- Modulare Funktionen
- JSDoc-Kommentare für wichtige Funktionen
camelCasefür Variablen und FunktionenUPPER_CASEfür Konstanten
-
Branch erstellen
git checkout -b feature/mein-feature
-
Änderungen vornehmen
- Code schreiben
- Tests hinzufügen
- Dokumentation aktualisieren
-
Testen
- Browser-Tests (Chrome, Firefox, Edge, Safari)
- Mobile-Tests (iOS Safari, Chrome Android)
- Barrierefreiheit-Test mit Screenreader
-
Commit & Push
git add . git commit -m "feat: Mein neues Feature" git push origin feature/mein-feature
-
Pull Request erstellen
Debug-Modus aktivieren:
// In script.js
const DEBUG = true;
// In agent.js
const AGENT_DEBUG = true;Browser Console nutzen:
// Navigation testen
window.axiomGuide.scrollToSection('section-step2');
// Agent testen
window.agentAPI.open('format-decision');
// Verlauf anzeigen
console.log(sectionHistory);Das Projekt erfüllt die Anforderungen des Barrierefreiheitsstärkungsgesetzes (BFSG), das am 28. Juni 2025 in Kraft getreten ist.
- ✅ WCAG 2.1 Level AA konform
- ✅ ARIA 1.2 Spezifikation
- ✅ Tastaturnavigation vollständig
- ✅ Screenreader-kompatibel (NVDA, JAWS, VoiceOver)
- ✅ Kontrastverhältnisse mindestens 4.5:1
- ✅ Focus-Indikatoren deutlich sichtbar
- ✅ Reduced Motion Support
- ✅ High Contrast Mode Support
Alle Funktionen sind ohne Maus bedienbar:
Tab/Shift+Tab: Navigation zwischen ElementenEnter/Space: Aktivierung von Buttons/LinksESC: Schließen von OverlaysAlt + 1/2/3: Detailgrad wechseln
- Semantisches HTML mit korrekten Heading-Hierarchien
- ARIA-Labels für alle interaktiven Elemente
- ARIA-Live-Regions für dynamische Inhalte
- Alt-Texte für alle Bilder (sobald implementiert)
- WAVE Browser Extension
- axe DevTools
- Lighthouse
- NVDA Screenreader (Windows)
- VoiceOver (macOS/iOS)
Ziel: Erste lauffähige Version mit Beispiel
- Grundstruktur HTML/CSS/JS
- Beispiel-Leitfaden: HTML-Report-Erstellung
- 7 interaktive Features
- Spürhund-Assistent Framework
- Vollständiger Content für alle 8 Schritte
- Agent-Dialoge für Hauptabschnitte
- Screenshots/Videos integrieren
Zeitplan: Tag 1-10 (29.09.2025 - 10.10.2025)
Ziel: Vollständiger AXIOM-Leitfaden
- [~] Alle Workflow-Schritte vollständig dokumentiert
- 3 weitere Hauptabschnitte (Video, Bilder, Chat-Analyse)
- 50+ Agent-Dialoge
- Umfassendes Testing
- Performance-Optimierungen
- User-Feedback eingearbeitet
Zeitplan: Tag 11-30
Ziel: Produktionsreife für AXIOM
- Vollständige Dokumentation
- Video-Tutorials
- Benutzer-Handbuch
- Admin-Dokumentation
- Browser-Kompatibilität 100%
- Barrierefreiheit validiert
- Performance-Audit bestanden
Zeitplan: Tag 31-60
Ziel: Unterstützung für weitere forensische Software
- Template-System für neue Tools
- Cellebrite Physical Analyzer Leitfaden
- EnCase Forensic Leitfaden
- X-Ways Forensics Leitfaden
- Tool-übergreifende Best Practices
Zeitplan: Q1 2026
- Dark Mode
- Multi-Language Support (EN, FR)
- Export-Funktion (PDF, DOCX)
- Offline-PWA Version
- Kollaboration-Features
- KI-Integration (OpenAI API)
- Voice-Input/Output
- Gamification (Achievements, Badges)
Detaillierte Tages-Zusammenfassungen finden Sie unter /project-diary/:
- Tag 1 (29.09.2025): Grundstruktur, Features 1-7, Agent-Framework
- Tag 2 (30.09.2025): TBD
- Tag 3 (01.10.2025): TBD
Alle verwendeten Prompts sind archiviert unter /project-diary/prompts/ für Nachvollziehbarkeit und Lernzwecke.
Feedback und Bug-Reports sind willkommen! Bitte erstellen Sie ein Issue mit:
- Titel: Kurze Beschreibung
- Beschreibung: Detaillierte Erklärung
- Schritte zur Reproduktion: Bei Bugs
- Erwartetes Verhalten: Was sollte passieren?
- Tatsächliches Verhalten: Was passiert stattdessen?
- Browser/OS: Ihre Umgebung
- Screenshots: Falls relevant
- Forken Sie das Repository
- Erstellen Sie einen Feature-Branch
- Committen Sie Ihre Änderungen
- Pushen Sie zum Branch
- Erstellen Sie einen Pull Request
Bitte beachten Sie:
- Code-Konventionen einhalten
- Tests hinzufügen
- Dokumentation aktualisieren
- Commit-Messages nach Conventional Commits
Proprietary License - Alle Rechte vorbehalten.
Dieses Projekt ist für den internen Gebrauch in Strafverfolgungsbehörden bestimmt. Eine Weitergabe, Vervielfältigung oder kommerzielle Nutzung ist ohne ausdrückliche Genehmigung nicht gestattet.
Für Lizenzfragen kontaktieren Sie bitte: [Kontaktinformation]
- Projektleitung: Alexander Reintzsch
- Entwicklung: Alexander Reintzsch, Steffen ???
- Content: Alexander Reintzsch
- Testing: Steffen ???, Alexander Reintzsch
- Dokumentation: Alexander Reintzsch
- Claude AI (Anthropic): Unterstützung bei Entwicklung und Dokumentation (vor allem Frontend)
- Phoenix🔥 (DeepThink von DeepSeek): Unterstützung bei Entwicklung und Dokumentation (vor allem Backend)
- Magnet Forensics: AXIOM Examiner Dokumentation
- Community: Feedback und Testing
- E-Mail: [alexander.reintzsch@polizei.nrw.de]
- Issue Tracker: [GitHub Issues URL]
- Dokumentation:
/docs/oder [Online-Dokumentation URL]
Letztes Update: 10. Oktober 2025
Aktuelle Version: 0.1.68-alpha
Nächster Meilenstein: Version 0.2.0 (vollständiger Content)
Geschätzter Release: 30. Oktober 2025
- Implementierungsleitfäden
- API-Dokumentation
- Benutzer-Handbuch
- Testing-Guide
- JSON-Struktur Spezifikation
Made with ❤️ for Law Enforcement Professionals