name: bswi-infobrief
description: Erstellt schulische Dokumente im offiziellen BS:WI Corporate Design. Nutze diesen Skill für Arbeitsblätter, Handouts, Infobriefe, Formulare, E-Mails oder andere Unterlagen der BS:WI Hamburg. Unterstützt HTML, DOCX und PDF. Trigger-Phrasen: "Schuldokument", "Arbeitsblatt", "BS:WI", "Unterrichtsmaterial", "Handout", "Formular erstellen".
BS:WI Dokument-Generator
Erstellt professionelle Unterlagen im Corporate Design der Beruflichen Schule für Wirtschaft und Internationales Hamburg (BS:WI / BS05).
Verfügbare Templates
| Template | Datei | Verwendung |
|---|
| Arbeitsblatt | templates/arbeitsblatt.html | Übungen, Aufgaben, Tests |
| Infobrief | templates/infobrief.html | Newsletter, Mitteilungen |
| Handout | templates/handout.html | Kurzanleitungen, DaZ-geeignet |
| Formular | templates/formular.html | Anträge, Anmeldungen |
| E-Mail | templates/email.html | Professionelle E-Mails |
| Präsentation | templates/praesentation_guide.md | PowerPoint mit BSWI_Master.pptx |
Ausgabeformate
- HTML: Direkt im Browser, perfekt für digitale Nutzung
- DOCX: Word-Dokument mit
docx-generator.js
- PDF: Aus DOCX via LibreOffice konvertiert
Corporate Design Spezifikationen
Primärfarben (Blau-Palette)
| Name | HEX | Verwendung |
|---|
| Blau 1 | #1C3D71 | Headlines, Rahmen, Footer-Border |
| Blau 2 | #102141 | Dunkler Hintergrund |
| Blau 3 | #1266B0 | Untertitel, Links, Claim |
| Blau 4 | #008BC9 | Akzent-Ränder, Buttons |
| Blau 5 | #41C0F0 | Trennlinien, Highlights |
| Blau 6 | #A4DBF8 | Tabellen-Rahmen |
| Blau 7 | #EAF6FE | Hintergründe (Info-Boxen, Header) |
Sekundärfarben
| Name | HEX | Verwendung |
|---|
| Akzent | #E8FF00 | Neongelb für Warnungen, Need-to-know |
| Schwarz | #000000 | Text |
| Dunkelgrau | #666666 | Sekundärtext, Labels |
| Hellgrau | #F6F6F6 | Aufgaben-Box Hintergrund |
Typografie
- Schrift: Montserrat (Google Fonts), Fallback: Arial
- Titel: 15-18pt, Bold, Blau 1
- Untertitel: 10-12pt, Medium, Blau 3
- Fließtext: 11pt, Regular
- Footer: 8.5pt
Header-Layout (3-Spalten)
┌──────────────────────────────────────────────────────────┐
│ [LOGO] │ Titel (zentriert) │ Name: _______ │
│ │ Untertitel │ Datum: _______ │
├──────────────────────────────────────────────────────────┤
│ (2.5px Border Blau 1) │
Logo SVG (Inline)
<svg viewBox="0 0 692.7 566.9" xmlns="http://www.w3.org/2000/svg">
<defs>
<linearGradient id="g1" x1="399.7" y1="366.2" x2="1258.5" y2="80.8" gradientUnits="userSpaceOnUse">
<stop offset="0.3" stop-color="#41C0F0"/><stop offset="0.4" stop-color="#A4DBF8"/>
</linearGradient>
<linearGradient id="g2" x1="212.7" y1="462.7" x2="-54.8" y2="242.1" gradientUnits="userSpaceOnUse">
<stop offset="0.3" stop-color="#067AA7"/><stop offset="0.6" stop-color="#41C0F0"/><stop offset="1" stop-color="#A4DBF8"/>
</linearGradient>
<linearGradient id="g3" x1="241.1" y1="340.2" x2="423.9" y2="424.6" gradientUnits="userSpaceOnUse">
<stop offset="0.1" stop-color="#067AA7"/><stop offset="0.3" stop-color="#41C0F0"/><stop offset="1" stop-color="#A4DBF8"/>
</linearGradient>
<linearGradient id="g4" x1="515.2" y1="15.2" x2="280.7" y2="716.7" gradientUnits="userSpaceOnUse">
<stop offset="0.1" stop-color="#0E66AF"/><stop offset="0.7" stop-color="#1B3D71"/>
</linearGradient>
</defs>
<path d="M689.4 0 616.1 18.8C603.2 22.1 593.8 31.7 590.4 44.5L450.2 566.9 624.9 566.9 689.4 0Z" fill="url(#g1)"/>
<path d="M156.2 136.4 29.8 168.7C13.7 172.9 0 189.5 0 206.2L0 567 156.2 567 156.2 136.4Z" fill="url(#g2)"/>
<path d="M220.5 566.9 385.9 566.9 369.5 163.2 248.5 194.2 220.5 566.9Z" fill="url(#g3)"/>
<path d="M248.5 194.2 0 566.9 156.2 566.9 369.5 163.2 248.4 194.2ZM460.2 58.7 220.5 567 385.9 567 559.5 33.3 460.2 58.7ZM680 157.5 586.1 60.7 450.3 567 661.6 567 692.6 185.5C693.6 173 689.1 167 680 157.6Z" fill="url(#g4)"/>
</svg>
Logo PNG: Logo_BSWI_Quer_RGB.png (562x180px, Seitenverhältnis 3.12:1)
Footer-Layout
┌──────────────────────────────────────────────────────────┐
│ (2px Border Blau 1) │
│ Dirk Schulenburg · BS:WI Kompetent Zukunft Gestalten │
│ (kursiv, Blau 3) Seite X/Y │
└──────────────────────────────────────────────────────────┘
- Weißer Hintergrund
- Obere Trennlinie: 2px Blau 1
- Links: "Dirk Schulenburg · BS:WI" (grau)
- Mitte/Rechts: Claim kursiv in Blau 3
- Bei mehrseitigen Dokumenten: "Seite X von Y"
Design-Komponenten
Aufgaben-Box
.bswi-task {
background: #F6F6F6;
border: 2px solid #008BC9;
border-left-width: 6px;
border-radius: 10px;
padding: 14px 18px;
}
- Header mit Icon 📝, Titel und Punkte-Badge
- Hellgrauer Hintergrund
- Dicker Akzent-Rand links (Blau 4)
Info-Box / Tipp
.bswi-info {
background: #EAF6FE;
border-left: 5px solid #008BC9;
border-radius: 0 10px 10px 0;
padding: 12px 16px;
}
- Icon 💡 für Tipps, ✅ für Selbstkontrolle
- Blau 7 Hintergrund
Formel-Box
.formel-box {
background: #1C3D71;
color: #fff;
border-radius: 10px;
padding: 16px 20px;
text-align: center;
font-family: 'Times New Roman', serif;
font-style: italic;
}
Lernziele-Box
.lernziele-box {
background: linear-gradient(135deg, #EAF6FE 0%, #fff 100%);
border: 2px solid #008BC9;
border-radius: 12px;
}
- Icon 🎯
- Bullet-Liste mit Lernzielen
Tabellen
- Header: Blau 1 Hintergrund, weiße Schrift
- Zeilen: Zebra-Streifen mit Blau 7
- Rahmen: Blau 6
Eingabezeilen (Print)
.bswi-input-line { border-bottom: 1.5px solid #666; min-height: 2em; }
.bswi-input-line.short { width: 40%; }
.bswi-input-line.inline { width: 60px; display: inline-block; }
Mehrseitige Dokumente
HTML: Seitenumbrüche
.page {
width: 210mm;
height: 297mm;
page-break-after: always;
page-break-inside: avoid;
}
@media print {
.page { page-break-after: always; }
.page:last-child { page-break-after: auto; }
}
DOCX: Seitenumbrüche
new Paragraph({ children: [new PageBreak()] })
Seitenzahlen im Footer
- HTML: Manuell "Seite 1 von 2" in jeder
.page
- DOCX:
PageNumber.CURRENT und PageNumber.TOTAL_PAGES
DOCX-Erstellung
Verwende docx-generator.js für Word-Dokumente:
npm install docx
node docx-generator.js
Logo in DOCX (korrektes Seitenverhältnis)
new ImageRun({
data: logoBuffer,
transformation: { width: 112, height: 36 },
type: "png"
})
Header-Tabelle (3 Spalten)
new Table({
columnWidths: [2000, 5500, 2966],
rows: [
new TableRow({
children: [
new TableCell({ children: [logoImage] }),
new TableCell({ children: [title, subtitle] }),
new TableCell({ children: [nameField, dateField] })
]
})
]
})
PDF-Erstellung
python3 scripts/office/soffice.py --headless --convert-to pdf dokument.docx --outdir ./
Kontaktdaten
Dirk Schulenburg
BS:WI – Berufliche Schule für Wirtschaft und Internationales
Hinrichsenstraße 35 · 20535 Hamburg
dirk.schulenburg@bs05.hamburg.de
Tel: +49 40 428 976 - 0
www.bswi.hamburg
Claim
Kompetent Zukunft Gestalten
Bildsprache
Echt, freundlich, weltoffen, international
