Neue Skills, Referenzen & OpenWiki-Doku integriert

Umfangreiche Erweiterung der Skill-Bibliothek: Neue Skills für Humanisierung (Englisch/PT-BR), Design-Validierung, AI-SEO und Coolify-Deployment inkl. Regelwerke, Presets, Pattern-Referenzen, Testfälle und Automatisierungsskripte. Zusätzliche Skills für Revenue-Centric Design, Pier Cloud, OKF, Lebenslauf- und LinkedIn-Optimierung sowie zahlreiche Referenzdateien, Checklisten und YAML/JSON/Markdown-Templates. Einführung einer vollständigen OpenWiki-Dokumentation mit Architektur-, Domain- und Workflow-Beschreibungen, zentralem Index und automatisierten Updates. Modularer Aufbau, restriktive Lizenzen und umfassende Qualitäts- und Evaluationsmechanismen für alle neuen Inhalte.
This commit is contained in:
Tim Krampitz
2026-07-26 14:00:58 +02:00
parent 070727d5cd
commit 01046b01e4
202 changed files with 31290 additions and 0 deletions

View File

@@ -0,0 +1,65 @@
PROMPT 9: The Design-to-Code Translator
You are a Design Engineer at Vercel, bridging design and development.
Convert this design into production-ready frontend code:
[DESIGN DESCRIPTION, WIREFRAME, OR COMPONENT SPECS]
Tech stack: [REACT/VUE/SV ELTE/NEXT.JS/TAILWIND/ETC.]
Deliverables:
1. COMPONENT ARCHITECTURE
## Component hierarchy tree
## Props interface definition (TypeScript)
## State management strategy
## Data flow diagram
2. PRODUCTION CODE
## Complete, copy-paste ready component code
## Responsive implementation (mobile-first)
## Accessibility attributes (ARIA labels, roles, states)
## Error boundaries and loading states
## Animation/transition implementation
3. STYLING SPECIFICATIONS
## CSS/Tailwind classes with design token mapping
## CSS variables for theming
## Dark mode implementation
## Responsive breakpoints
## Hover/focus/active states
4. DESIGN TOKEN INTEGRATION
## Color tokens mapped to CSS variables
## Typography tokens (font sizes, weights, line heights)
## Spacing tokens (padding, margin, gap)
## Shadow/elevation tokens
## Border radius tokens
5. ASSET OPTIMIZATION
## Image component with lazy loading
## SVG optimization strategy
## Icon system (SVG sprite or icon library)
## Font loading strategy
6. PERFORMANCE CONSIDERATIONS
## Code splitting recommendations
## Bundle size optimization
## Rendering optimization (React.memo, useMemo, etc.)
## Image optimization (next/image or equivalent)
7. TESTING STRATEGY
## Unit test cases (React Testing Library)
## Visual regression test scenarios
## Accessibility tests (axe-core)
## Responsive test cases
8. DOCUMENTATION
## JSDoc comments for all props
## Usage examples (3 variations)
## Do's and don'ts
## Changelog template
Include "Designer's Intent" comments explaining why certain code decisions preserve the design vision.