flowchart-creator
Twórz interaktywne schematy blokowe i diagramy procesów w HTML-u
Instalacja
Wybierz klienta i sklonuj repozytorium do odpowiedniego katalogu skilli.
Instalacja
O skillu
Skill do generowania schematów blokowych i diagramów procesów bezpośrednio w formacie HTML. Zawiera gotowe komponenty: węzły startowe i końcowe (zaokrąglone prostokąty), pola procesów, romby decyzyjne, strzałki łączące oraz opcjonalne swimlany do grupowania sekcji. Każdy element ma przypisane kolory ułatwiające czytanie: zielony dla startu, czerwony dla końca, niebieski dla procesów, pomarańczowy dla decyzji. Idealny do wizualizacji przepływów pracy, drzew decyzyjnych i sekwencji operacji.
Jak używać
Zainstaluj skill flowchart-creator w swoim środowisku Claude lub Copilot, wskazując repozytorium mhattingpete na GitHubie.
Poproś asystenta o utworzenie schematu blokowego, używając jednej z sugerowanych fraz: "Utwórz schemat blokowy dla [proces]", "Wygeneruj diagram przepływu procesu", "Zrób drzewo decyzyjne dla [przepływu pracy]" lub "Pokaż wizualizację przepływu pracy".
Skill automatycznie wygeneruje kod HTML zawierający strukturę SVG z węzłami i połączeniami. Węzły będą skolorowane zgodnie z typem: zaokrąglone prostokąty dla startu (zielony) i końca (czerwony), prostokąty dla procesów (niebieski), romby dla decyzji (pomarańczowy).
Otrzymany kod HTML możesz otworzyć bezpośrednio w przeglądarce. Diagram będzie responsywny dzięki atrybutowi viewBox w elemencie SVG.
Jeśli potrzebujesz swimlan do grupowania sekcji lub bardziej złożonej struktury, wskaż to w prośbie — skill dostosuje szablon HTML do Twoich wymagań.
Możesz edytować wygenerowany kod HTML, aby zmienić etykiety, pozycje węzłów, kolory lub dodać nowe elementy zgodnie z własnymi potrzebami.