97b8da5195
Implemented three fully functional interactive demos showcasing the core Tractatus services in action. ## Interactive Demonstrations ### 1. Classification Demo (/demos/classification-demo.html) - **Purpose**: Demonstrate InstructionPersistenceClassifier - **Features**: - Real-time instruction classification - Visual quadrant display (STRATEGIC/OPERATIONAL/TACTICAL/SYSTEM/STOCHASTIC) - Persistence level visualization (HIGH/MEDIUM/LOW/VARIABLE) - Explicitness scoring with storage threshold - 5 example instructions for testing - **Educational Value**: Shows how instructions are analyzed and categorized ### 2. The 27027 Incident (/demos/27027-demo.html) - **Purpose**: Visualize real-world failure and Tractatus prevention - **Features**: - 8-step animated timeline - Progressive disclosure of incident - Code examples showing the error - Tractatus prevention mechanism explained - Playback controls with progress tracking - **Educational Value**: Concrete case study of context degradation failure ### 3. Boundary Enforcement Simulator (/demos/boundary-demo.html) - **Purpose**: Interactive decision boundary testing - **Features**: - 6 realistic scenarios (3 allowed, 3 blocked) - Real-time boundary checks - Visual ALLOWED/BLOCKED verdicts - Reasoning explanations - Alternative approaches for blocked decisions - Code examples for each scenario - **Educational Value**: Shows what can/cannot be automated ## Technical Implementation - **Pure JavaScript**: No frameworks, lightweight and fast - **Tailwind CSS**: Consistent styling across all demos - **Responsive Design**: Works on mobile and desktop - **Accessibility**: Semantic HTML, keyboard navigation - **Mock Data**: Uses realistic classification logic ## User Experience Each demo includes: - Clear navigation between demos - Educational context and explanations - Interactive elements for hands-on learning - Code examples showing actual framework usage - Visual feedback for all interactions ## Documentation Integration Demos linked from: - Homepage hero section - Interactive demos section - Framework documentation ## Next Steps These demos provide: 1. ✅ Tangible framework demonstration 2. ✅ Educational value for all three audiences 3. ✅ Marketing material for framework adoption 4. ⚠️ Foundation for video tutorials (future) 5. ⚠️ Basis for conference presentations (future) --- 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> |
||
|---|---|---|
| .. | ||
| demos | ||
| js | ||
| docs-viewer.html | ||
| docs.html | ||
| index.html | ||