Badge-Designer

Der Badge-Designer ist ein visueller, dreispaltiger Canvas-Editor, der in badges.ninja eingebaut ist und mit dem du professionelle Auszeichnungsbilder ohne jegliche externen Designtools erstellst.

Überblick

Der Designer öffnet sich direkt im Fenster Auszeichnung erstellen / bearbeiten. Er besteht aus drei Teilen:

• Linke Leiste — schaltet das mittlere Panel zwischen Vorlagen, Uploads, Elemente, Text, Attribute, QR-Codes und Ebenen um.
• Panel — die Werkzeuge für den ausgewählten Modus der Leiste.
• Leinwand — eine live editierbare Vorschau der Auszeichnung. Alles, was du hinzufügst, ist ein echtes, auswählbares Objekt, das du verschieben, umgestalten, neu anordnen oder löschen kannst.

Die Auszeichnungsdetails (Aussteller, Name, Beschreibung, Kriterien und der Teilen-Text) liegen direkt unter der Leinwand, sodass Design und Nachweisinformationen zusammen in einem Fenster wohnen — es gibt keinen separaten Schritt.

Mit einer Vorlage beginnen

Klicke in der Leiste auf Vorlagen, um die eingebauten Designs zu durchstöbern. Die Recognition-Familie liefert dir eine vollständig komponierte, professionelle Auszeichnung — einen geformten Rahmen plus editierbaren Platzhaltertext (Organisation, Titel, Untertitel und ein Verifizierungssiegel) — in acht Farbpaletten (Gold, Silber, Bronze, Blau, Grün, Karmesinrot, Violett, Graphit). Nutze den Kategorie-Filter, um die Liste einzugrenzen, oder Leere Leinwand, um bei null anzufangen.

Klicke auf eine Vorlage, um sie anzuwenden. Ihr Text wird zu normalen, editierbaren Ebenen, die du ändern oder entfernen kannst — nichts ist fest eingebrannt.

Elemente — Formen, Icons, Bänder & Hintergründe

Das Elemente-Panel legt Grafiken über deine Auszeichnung:

• Linien — horizontale / vertikale Linien.
• Formen — gefüllte und umrandete Rechtecke, abgerundete Rechtecke, Kreise und Dreiecke.
• Icons — 70 piktografische Icons (Auszeichnung, Gehirn, Zertifikat, Code, Krone, Diplom, Doktorhut, Medaille, Rakete, Schild mit Häkchen, Stern, Trophäe und viele mehr), durchsuchbar.
• Bänder — 28 dekorative Band-Overlays, gruppiert in Gerade / Spitz / Enden / Dekorativ.
• Basen — 80 umfärbbare Basisformen über mehrere Kategorien (Kreise, Schilde, Sechsecke, Sterne, Medaillen, Siegel, Kränze, Banner, geometrische Formen).

Jedes Icon, Band und jede Basis wird in der aktuellen Farbe eingefügt und kann jederzeit umgefärbt werden.

Hintergrundformen

Elemente → Hintergrundformen enthält 68 fertige Rahmen (die Bibliothek aus Form × Palette). Wendest du einen an, tauscht das den Hintergrundrahmen der Auszeichnung aus, während dein Text und deine Elemente darüber erhalten bleiben — praktisch, wenn du eine bestimmte Form-/Farbkombination ohne komponierte Vorlage möchtest.

Ein eigenes Bild hochladen

Nutze das Uploads-Panel, um dein eigenes Logo, Foto oder deine eigene Grafik hinzuzufügen. PNG, JPEG und SVG werden akzeptiert, bis zu 5 MB. Das Bild wird als normales Vordergrundobjekt eingefügt — es stapelt sich über das Design und löscht nie den Hintergrund. Um den Auszeichnungshintergrund zu ändern, wähle stattdessen eine Vorlage oder eine Hintergrundform.

Text hinzufügen & gestalten

Das Text-Panel bietet:

• Überschrift / Zwischenüberschrift / normalen Text hinzufügen — vorbemessene Textobjekte.
• Kombinationen — fertige Stapel wie Certificate of Achievement, Awarded to oder Verify at — jede Zeile bleibt unabhängig editierbar.

Wähle ein beliebiges Textobjekt aus, und die kontextbezogene Werkzeugleiste erscheint über der Leinwand:

• Schriftart — eine Bibliothek von 50 Schriftarten, gruppiert in Sans, Serif, Handschrift, Mono und System. Wähle eine aus dem Dropdown; jede Option zeigt eine Vorschau in ihrer eigenen Schrift.
• + Schrift — lade eine Markenschrift (TTF, WOFF, WOFF2, OTF) für die aktuelle Sitzung hoch.
• Schriftgröße — der − / + Stepper (oder Eingabe einer Zahl) skaliert den ausgewählten Text präzise, ohne an seinen Griffen zu ziehen.
• Farbe — legt die Füllung des ausgewählten Textes fest (und die Standard-Einfügefarbe für neue Formen/Icons).
• Ausrichtung — sechs Schaltflächen richten die Auswahl links / mittig / rechts und oben / mittig / unten relativ zur Leinwand aus.

Dynamische Attribute

Das Attribute-Panel fügt dynamische Tokens ein — , , , , , — als Textobjekte. Jedes Token wird je Empfänger:in zum Zeitpunkt der Vergabe aufgelöst, sodass ein einziges Design sich für alle personalisiert, denen du es ausstellst. So bringst du den Namen der Empfänger:in oder das Ausstellungsdatum auf die Auszeichnung selbst.

QR-Codes

Das QR-Codes-Panel fügt einen scanbaren Code ein, der an gebunden ist. Bei jeder ausgestellten Vergabe löst er sich zur öffentlichen Verifizierungsseite dieser Vergabe auf, sodass jede Person die gedruckte Auszeichnung scannen kann, um sie zu bestätigen.

Ebenen

Das Ebenen-Panel listet jedes Objekt auf der Leinwand auf. Von hier aus kannst du jede Ebene neu anordnen (nach vorn / nach hinten), aus-/einblenden, auswählen und löschen. Der Hintergrundrahmen ist unten fixiert und bleibt nicht-interaktiv, sodass die Vordergrundelemente alle Klicks für sich haben.

Rückgängig / Wiederherstellen (Ctrl+Z / Ctrl+Shift+Z) durchlaufen die letzten 20 Änderungen, und gestrichelte Einrast-Hilfslinien erscheinen, wenn du ein Objekt in die Nähe der Leinwandmitte ziehst.

Die Auszeichnung speichern

Es gibt keinen separaten „Export"-Schritt. Wenn Design und Details fertig sind:

• Auszeichnung erstellen erfasst die Leinwand als PNG, lädt sie auf IPFS hoch und speichert die Auszeichnung samt ihrem editierbaren Design — sodass beim erneuten Öffnen der Auszeichnung deine einzelnen Ebenen für weitere Bearbeitung wiederhergestellt werden.
• Entwurf speichern legt eine in Arbeit befindliche Auszeichnung serverseitig ab (geräteübergreifend). Entwürfe erscheinen in deiner Auszeichnungsliste mit einer Entwurf-Markierung, und du kannst jeden von ihnen später wieder aufnehmen.

Tipps für gutes Badge-Design

• Halte es einfach — klarer Text, minimale Überladung. Auszeichnungen werden oft klein dargestellt.
• Nutze hohen Kontrast — mache den Text vor dem Hintergrund lesbar.
• Benenne den Nachweis — Betrachter sollen ihn auf einen Blick verstehen.
• Quadratisches Format — Auszeichnungen wirken quadratisch am besten.
• Markenkonsistenz — nutze die Farben und Schriften deiner Organisation über alle Auszeichnungen hinweg wieder.
• Wiederverwendbare Designs speichern — jede Auszeichnung, die du erstellst, wird zugleich als Konto-Vorlage gespeichert, von der du das nächste Mal starten kannst (siehe Meine Vorlagen).