Process Safety Infographic Generator

Problem

For process safety training, incident reviews, and technical sharing, teams often need to turn HAZOP, nitration safety, major hazard judgments, and accident investigations into a single readable visual artifact. Hand-written HTML can scatter the key points and still suffer from text overflow, unclear color semantics, missing regulatory sources, and poor html2canvas exports.

Workflow

The skill accepts a keyword or article as input. It first searches a process safety knowledge base, then supplements the result with public sources from government or industry bodies, extracts 3–7 key points, and organizes them into a narrative such as “hazard—control—regulation.” It then chooses a vertical or horizontal canvas based on information density: incident analysis favors timelines and violation checklists, process safety favors a “definition—hazard—control—regulatory red line” structure, and standard-based content favors “standard info—core clauses—key changes—implementation.” Finally, it renders HTML and can export a PNG using html2canvas.

It focuses on:
- Information hierarchy: title, anchor numbers, cards, and footnotes form a clear size contrast
- Color discipline: default light technical style, with Wong color-blind-safe palette when needed
- Source labeling: regulatory clauses, incident reports, and illustrative figures must be labeled
- Render checks: avoid text overflow, vertical label wrap, and export incompatibilities

Boundary

It is suitable for training infographics, safety sharing pages, and knowledge cards, not for replacing formal safety assessments. Numbers should come from retrieved results or user-provided data, and example values must be marked. If sources are weak, add authoritative material before generating.