-
Notifications
You must be signed in to change notification settings - Fork 0
/
organigramm.html
62 lines (57 loc) · 2.98 KB
/
organigramm.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Buchführung</title>
<link rel="stylesheet" href="css/style.css">
<script src="js/html2canvas.min.js"></script>
<script src="js/js-yaml.min.js"></script>
<script src="js/kontenplan.js"></script>
<script src="js/clipboard.min.js"></script>
<script src="js/menu.js"></script>
</head>
<style>
h3 {
counter-increment: section;
}
h3::before {
content: counter(section) ". ";
}
</style>
<main>
<div w3-include-html="navigation.html"></div>
<h2>Organigramm erstellen</h2>
<div class="box">
<p>Um ein Modellorganigramm zu erstellen, können wir draw.io verwenden. Draw.io ist ein kostenloses Diagramm- und Zeichenprogramm, das sowohl lokal installiert als auch als Online-Dienst im Browser laufen kann. </p>
<ol>
<li>Schritt: Prompt eingeben und per KI erstellen lassen. Dazu verwenden wir entweder direkt <a href="https://www.drawio.com/">draw.io</a> und "Smarte Vorlage" oder zunächst eine textbasierte KI, zum Beispiel:
<br><code>Erstelle ein fiktives Organigramm mit 4 Ebenen (vertikal von oben nach unten) der Firma Anna-Konrad-Bikes E. Kfr. Formatiere als mermaid. Verwende deutsche Begriffe, konkrete Personennamen und die Standardbereiche: Einkauf, Verkauf, Produktion, Verwaltung. Jeder Bereich soll einen eigenen Leiter mit Namen und mehrere Teammitglieder haben. Füge an Verwaltung den Stab EDV mit einer eigenen Leitung und Team an. Die Felder sollen nicht zu breit werden, füge Zeilenumbrüche ein und trenne Personen und Bereiche.</code>
<br><br>Beispielergebnis: <br>
<pre><textarea readonly="readonly" cols="80" rows="12">
graph TD;
A[CEO<br>Anna Konrad] --> B[Verwaltung<br>Geschäftsführung<br>Lukas Schmidt];
A --> C[Einkauf<br>Leitung<br>Max Bauer];
A --> D[Verkauf<br>Leitung<br>Lena Müller];
A --> E[Produktion<br>Leitung<br>Jonas Wagner];
B --> F[EDV<br>Leitung<br>Sarah Weber];
F --> G[IT-Team<br>Jan Meier<br>Lisa Schneider];
C --> H[Einkaufsteam<br>Marie Fischer<br>Tom Becker];
D --> I[Verkaufsteam<br>Julia Braun<br>Tim Hoffmann];
E --> J[Produktionsteam<br>Simon Richter<br>Laura Schulz];
</textarea></pre><br><br>
</li>
<li>Schritt: <a href="https://www.drawio.com/">draw.io</a> öffnen und ein neues Diagramm erstellen. Das Beispielergebnis kopieren und unter "Anordnen --> Einfügen --> Erweitert --> Mermaid" einfügen.<br><br></li>
<li>Schritt (optional): Diagramm bearbeiten und nach Wunsch anpassen.<br><br></li>
<li>Schritt: Diagramm markieren und exportieren unter "Datei --> Exportieren als --> SVG (nur Markierung, transparenter Hintergrund)"
</li>
</ol>
</div>
Ergebnis:<img src="media/pic/organigramm.drawio.svg" style="width:100%">
</main>
<div w3-include-html="footer.html"></div>
<script>
includeHTML();
</script>
</body>
</html>