Dieser Leitfaden zeigt dir alles, was du wissen musst, um mit PuzzleBuilder eine personalisierte Foto-Challenge zu erstellen — vom Einrichten deines Gitters bis zum Herunterladen oder Veröffentlichen deines fertigen Rätsels.

1. Was ist eine Foto-Challenge?

Eine Foto-Challenge ist ein fotobasiertes Frage-Antwort-Spiel. Du lädst eine Reihe von Fotos hoch, schreibst die richtige Antwort für jedes einzelne, und die Spieler versuchen sie zu erraten. Das Format funktioniert für viele Konzepte:

  • Wo waren sie? Fotos von Orten — die Spieler raten die Stadt oder das Land.
  • Welches Jahr? Fotos aus verschiedenen Momenten — die Spieler raten das Jahr.
  • Wie alt? Fotos in verschiedenen Altern — die Spieler raten das Alter auf jedem Foto.
  • Zeitreise, Errate den Ort, Benenne den Moment — das Konzept liegt bei dir.

Normalerweise zieht sich ein einzelnes Konzept durch die gesamte Challenge. Der Spieler sieht die Fotos und beantwortet bei jedem die gleiche Frage.

2. Erste Schritte

Um eine Foto-Challenge zu erstellen, benötigst du zuerst einen Anlass. Ein Anlass ist der Container für deine Rätsel — das kann eine Hochzeit, ein Geburtstag, eine Unterrichtsaktivität oder jedes andere Ereignis sein.

Falls du noch keinen Anlass erstellt hast:

  • Klicke auf + Neues Rätsel in deinem Dashboard.
  • Wähle einen vorhandenen Anlass oder erstelle einen neuen.
  • Wähle Foto-Challenge als Rätseltyp.

Sobald dein Anlass eingerichtet ist, öffnet sich der Foto-Challenge-Builder automatisch. Wenn du ein neues Rätsel zum ersten Mal öffnest, wirst du aufgefordert, eine Seitengröße und Ausrichtung zu wählen — diese kannst du später jederzeit im Size-Tab ändern.

3. Die Builder-Oberfläche

Der Foto-Challenge-Builder hat drei Hauptbereiche:

  • Linkes Panel: Vier Tabs — Challenge (dein Gitterlayout und die Antworten), Size (Seitenabmessungen), Templates (fertige Designs) und Layers (Elementliste und Werkzeuge für neue Elemente).
  • Zentrale Leinwand: Eine Live-Vorschau deines Rätseldesigns. Das Artboard innerhalb der Leinwand stellt die tatsächliche Seite dar — alles innerhalb seiner Grenzen erscheint in der heruntergeladenen Datei.
  • Rechtes Panel (Style & Content): Steuerelemente für das Foto-Gitter und für das ausgewählte Element.

In der oberen Symbolleiste findest du Save (mit einem Eingabefeld zur Benennung deines Rätsels), Guide (einen Link zu dieser Seite), Download und Publish. Darunter befinden sich Zoom-Steuerungen, eine Fit-Schaltfläche zum Anpassen der Leinwand an deinen Bildschirm und Umschalter für Hide Crop Marks, Hide Grid und Show Answers.

Du kannst auch irgendwo auf die Leinwand rechtsklicken, um ein Schnellmenü mit Verknüpfungen zu Save, Crop Marks, Grid, Answers und Download zu öffnen.

Um dich auf der Leinwand zu bewegen, halte Alt gedrückt und ziehe, oder drücke die mittlere Maustaste und ziehe. Du kannst auch mit dem Mausrad hinein- und herauszoomen.

Auf dem Mobilgerät

Auf mobilen Geräten passt sich der Builder an deinen Bildschirm an. Die linken und rechten Panels sind standardmäßig ausgeblendet und lassen sich über die Schaltflächen am oberen Bildschirmrand öffnen:

  • Tippe oben links auf Panel, um das linke Panel zu öffnen.
  • Tippe oben rechts auf Eigenschaften, um das Style & Content-Panel zu öffnen.
  • Die Aktionen Save, Guide, Download und Publish sind unter der ☰-Menüschaltfläche in der oberen Zeile gruppiert.

Auf dem Mobilgerät gibt es zudem einen Pan-Umschalter, um die Leinwand per Touch zu navigieren. Wenn Pan aktiviert ist, kannst du die Leinwand mit dem Finger ziehen, um dich zu bewegen. Wenn Pan deaktiviert ist, werden durch Tippen und Ziehen Elemente auf dem Artboard ausgewählt und verschoben.

4. Das Gitter einrichten

Öffne den Challenge-Tab im linken Panel. Oben findest du den Grid-Bereich, der steuert, wie viele Fotoplätze deine Challenge hat und wie sie angeordnet sind.

  • Number of Rows: Wähle zwischen 1 und 5 Zeilen.
  • Number of Items in a Row: Wähle zwischen 1 und 5 Elementen pro Zeile.

Klicke auf Apply Grid Layout, um die Leinwand zu aktualisieren. Das Artboard zeigt sofort die neue Anordnung leerer Fotoplätze.

Jeder Fotoplatz hat darunter Platz für eine Antwort (als Linie oder Kästchen-Layout, je nach deinen Style-Einstellungen). Die Gesamtzahl der Plätze ist Zeilen × Elemente pro Zeile — zum Beispiel ergeben 3 Zeilen mit 3 Elementen 9 Plätze.

5. Antworten schreiben

Unter dem Grid-Bereich befindet sich der Answers-Bereich mit einem Eingabefeld für jeden Platz in deinem Gitter. Gib die richtige Antwort für jedes Foto ein.

Antworten sind für das Online-Spiel erforderlich — so weiß das Spiel, ob die Vermutung eines Spielers richtig ist. Sie werden in der gedruckten Version nicht angezeigt, es sei denn, du lädst mit aktiviertem Show Answers in der Symbolleiste herunter (was hauptsächlich zur Vorschau nützlich ist).

6. Fotos hinzufügen

Leere Fotoplätze zeigen einen Double-click to add image-Platzhalter auf der Leinwand. Um ein Foto hinzuzufügen:

  • Doppelklicke auf einen leeren Platz.
  • Wähle eine Bilddatei von deinem Gerät.
  • Warte, bis der Upload abgeschlossen ist — ein Fortschrittsdialog zeigt Uploading Photo... Processing image...

Nach dem Hochladen füllt das Foto den Platz aus. Du kannst auch einen leeren Platz einmal anklicken, um ihn auszuwählen, und dann die Schaltfläche Upload Photo im rechten Panel verwenden.

Unterstützte Formate: JPEG, PNG, GIF, WebP. Maximale Dateigröße: 5 MB pro Foto.

Fotos anpassen

Klicke auf ein Foto (einmaliger Klick), um es auszuwählen. Das rechte Panel zeigt Foto-Steuerelemente:

  • Remove Photo: Entfernt das Foto vom Platz.
  • Size: Passe die Breite und Höhe des Fotos in Pixeln an. Verwende den Sperr-Umschalter, um das Seitenverhältnis beizubehalten. Klicke auf Fill Slot, um das Foto exakt auf den Platz einzupassen, oder auf Reset Size, um die ursprünglichen Abmessungen wiederherzustellen.
  • Flip: Spiegele das Foto horizontal oder vertikal.
  • Rotate: Gib einen Rotationswinkel in Grad ein oder klicke auf Reset, um zu 0° zurückzukehren.

Du kannst ein Foto auch innerhalb seines Platzes ziehen, um es neu zu positionieren, und es mit den Eckpunkten in der Größe ändern. Fotos können über die Plätze hinausgehen, aber die Teile außerhalb des Platzes werden abgeschnitten und sind in der endgültigen Ausgabe nicht sichtbar.

7. Das Foto-Gitter anpassen

Anders als bei anderen Rätsel-Buildern zeigt der Foto-Challenge-Builder die Gitter-Stiloptionen im rechten Panel auch dann an, wenn nichts ausgewählt ist. So kannst du das Erscheinungsbild des Gitters als Ganzes feinabstimmen.

Spacing

  • Gap: Der Abstand zwischen den Plätzen (0–100px).
  • Grid Padding: Der Abstand zwischen dem Gitter und den Rändern des Artboards (0–100px).

Slot

  • Border: Die Stärke des Rahmens jedes Platzes (0–10px).
  • Border Color: Die Farbe des Rahmens.
  • Gap: Der Abstand zwischen dem Rahmen und dem Foto darin (0–10px).

Answers

Wähle, wie der Antwortbereich unter jedem Foto aussehen soll. Verwende den Type-Umschalter, um zwischen zwei Stilen zu wechseln:

Line — Eine einfache Linie, auf die die Spieler ihre Antwort frei schreiben. Am besten für längere Antworten.

  • Top Space: Der Abstand zwischen dem Foto und der Linie (0–50px).
  • Line Thickness: 1–10px.
  • Line Style: Solid oder Dotted.
  • Line Color: Die Farbe der Linie.

Box — Eine Reihe von Buchstabenkästchen, eines pro Zeichen — wie ein kleines Kreuzworträtsel. Dieser Stil verleiht dem Spiel ein Rätsel-Gefühl und eignet sich gut für kurze Antworten.

  • Top Space: Der Abstand zwischen dem Foto und den Kästchen (0–50px).
  • Box Thickness: Rahmenstärke der Kästchen (0–5px).
  • Box Size: Die Größe jedes Zeichenkästchens (5–50px).
  • Box Border Color: Die Rahmenfarbe der Kästchen.
  • Box Bg Color: Die Hintergrundfarbe der Kästchen.
  • Gap between boxes: 1–10px.
  • Box corners: 0–10px (für abgerundete Ecken).

Wenn du eine Einstellung in Spacing, Slot oder Answers änderst, erscheint unter diesem Bereich eine Update Grid-Schaltfläche. Klicke darauf, um deine Änderungen auf die Leinwand anzuwenden.

8. Eine Seitengröße wählen

Klicke im linken Panel auf den Size-Tab, um deine Seitenabmessungen auszuwählen. Verfügbare Größen sind:

  • 5×7 in (Kartengröße) — 127 × 177,8 mm
  • 5,5×8,5 in (Half Letter) — 139,7 × 215,9 mm
  • 8,5×11 in (US Letter) — 215,9 × 279,4 mm
  • 11×17 in (Tabloid / Ledger) — 279,4 × 431,8 mm
  • 18×24 in (Mittleres Poster) — 457,2 × 609,6 mm
  • 24×36 in (Großes Poster) — 609,6 × 914,4 mm
  • 30×42 in (Riesenposter / Staffelei) — 762 × 1066,8 mm
  • A5 — 148 × 210 mm
  • A4 — 210 × 297 mm
  • A3 — 297 × 420 mm
  • A2 — 420 × 594 mm
  • A1 — 594 × 841 mm
  • A0 — 841 × 1189 mm

Du kannst auch zwischen Hochformat und Querformat wechseln. Klicke auf Apply Page Size, um die Leinwand zu aktualisieren.

Wenn du die Seitengröße änderst, wird dein Design automatisch auf die neuen Abmessungen angepasst. In den meisten Fällen solltest du danach die Positionen und Größen der Elemente feinabstimmen.

9. Eine Vorlage anwenden

Klicke auf den Templates-Tab, um fertige Designs zu durchsuchen. Jede Vorlage enthält ein vorgefertigtes Layout mit gestalteten Elementen — Titel, dekorative Formen und Gitter-Stilvoreinstellungen.

Wähle eine Vorlage aus und klicke auf Apply Template. Ein Bestätigungsdialog fragt dich um Bestätigung, da durch das Anwenden einer neuen Vorlage die dekorativen Elemente der aktuellen Vorlage ersetzt werden (einschließlich aller Anpassungen, die du daran vorgenommen hast). Deine Fotos und alle Elemente, die du selbst hinzugefügt hast, bleiben genau dort, wo sie sind.

10. Das Gesamtdesign anpassen

Über das Foto-Gitter hinaus kannst du andere Elemente auf der Leinwand hinzufügen und gestalten.

Inline-Textbearbeitung

Doppelklicke auf ein beliebiges Textelement auf der Leinwand, um seinen Inhalt direkt auf dem Artboard zu bearbeiten. Das gilt für Vorlagentitel und alle Textelemente, die du selbst hinzugefügt hast. Du kannst den Text auch über das Textfeld im Style & Content-Panel bearbeiten.

Größe, Rotation, Spiegeln und Ausrichtung

Jedes hinzugefügte Element hat die gleichen Kernsteuerungen im rechten Panel:

  • An Seite ausrichten: Rastet das Element an Left, Center, Right, Top, Middle oder Bottom der Seite ein.
  • Größe: Gib genaue Breite und Höhe in Pixel an.
  • Spiegeln: Spiegele das Element horizontal oder vertikal.
  • Rotieren: Gib einen Winkel in Grad ein oder klicke auf Reset, um zu 0° zurückzukehren.

Du kannst Elemente auch frei auf der Leinwand ziehen, ihre Größe mit den Eck- oder Kantenpunkten ändern und sie mit dem Rotationssteuerelement drehen, das unter einem ausgewählten Element erscheint.

Mehrfachauswahl-Ausrichtung

Wähle mehrere Elemente gleichzeitig aus, indem du Shift gedrückt hältst und jedes Element anklickst, oder indem du einen Auswahlrahmen über sie auf der Leinwand ziehst. Du kannst auch im Layers-Tab mehrere Elemente auswählen, indem du Shift gedrückt hältst und auf die Layer-Zeilen klickst.

Wenn mehrere Elemente ausgewählt sind, zeigt das rechte Panel zwei Sätze von Steuerelementen an: Align Elements richtet die ausgewählten Elemente relativ zueinander aus, und Align to Page richtet sie relativ zur Seite aus.

Neue Elemente hinzufügen

Öffne den Layers-Tab. Unten findest du den Bereich Add Element mit diesen Optionen:

  • Rechteck: Eine Form mit anpassbarer Füllfarbe und Eckenradius (für abgerundete Ecken).
  • Dreieck und Kreis: Formen mit anpassbarer Füllfarbe.
  • Linie: Eine gerade Linie mit anpassbarer Dicke und Farbe.
  • Text: Ein neues Textfeld mit vollständigen Typografiesteuerungen — Schriftart, Schriftstärke, Schriftstil, Farbe und Ausrichtung.
  • Bild: Lade deine eigenen dekorativen Bilder hoch (JPEG, PNG, GIF oder WebP — bis zu 5 Bilder, max. 5 MB pro Datei). Diese sind getrennt von den Fotoplätzen in deinem Gitter.

Du kannst bis zu 10 von jedem Form- oder Textelement hinzufügen. Jedes hinzugefügte Element erscheint in der Ebenenstruktur immer über dem Foto-Gitter — das Foto-Gitter bleibt im Hintergrund.

Ebenenverwaltung

Der Layers-Tab zeigt die Stapelreihenfolge aller Elemente auf der Leinwand. Beachte, dass die Fotoplätze und hochgeladenen Fotos selbst nicht in der Layers-Liste erscheinen — sie werden direkt über die Gitter-Einstellungen und die Leinwand verwaltet. Andere Elemente (Vorlagen-Dekorationen, deine hinzugefügten Formen und Texte) erscheinen normal und können per Drag-and-Drop neu angeordnet werden.

11. Beschnittmarken, Gitterlinien und Show Answers

Der Builder enthält drei Anzeige-Umschalter in der oberen Symbolleiste:

  • Hide/Show Crop Marks: Kleine Eckmarkierungen, die den sicheren Druckbereich anzeigen. Nützlich beim Drucken, um ein genaues Beschneiden zu gewährleisten.
  • Hide/Show Grid: Ein Hintergrundgitter, das dir hilft, Elemente beim Designen auszurichten.
  • Show/Hide Answers: Zeigt die richtige Antwort unter jedem Foto im Antwortbereich, damit du deine Einrichtung überprüfen kannst. Hinweis: Antworten sind nie in der heruntergeladenen Druckversion enthalten — dieser Umschalter dient nur zur Vorschau im Builder.

12. Deine Arbeit speichern

Klicke in der oberen Symbolleiste auf Save, um deinen aktuellen Fortschritt zu speichern. Dein Rätselname erscheint im Eingabefeld daneben — du kannst ihn jederzeit umbenennen. Beim Speichern wird alles bewahrt: deine Fotos, Antworten, das Gitterlayout, Designentscheidungen, Elementpositionen, die Vorlage, die Seitengröße und die Ausrichtung.

Dein Rätsel wird in deinem Konto gespeichert und du kannst jederzeit über dein Dashboard darauf zurückkehren.

13. Dein Rätsel herunterladen

Klicke in der oberen Symbolleiste auf Download, um den Download-Dialog zu öffnen. Du siehst drei Optionen:

  • PNG Preview: Ein Bild in Standardauflösung für schnelle Vorschauen und zum Teilen.
  • PNG High-Quality: Ein hochauflösendes Bild, das zum Drucken geeignet ist.
  • Print Ready PDF: Eine für professionelle Druckqualität optimierte PDF-Datei.

Die heruntergeladene Datei zeigt genau das, was sich innerhalb des Artboards befindet — Beschnittmarken, Gitterlinien und Antworten sind nicht enthalten. Die Spieler schreiben ihre Vermutungen beim Spielen der gedruckten Version in den Antwortbereich.

Downloads sind in allen kostenpflichtigen Paketen verfügbar. Nutzer des kostenlosen Plans können ihr Rätsel im Builder vorschauen, aber keine Dateien herunterladen.

14. Dein Rätsel online veröffentlichen

Klicke in der oberen Symbolleiste auf Publish, um den Veröffentlichungsdialog zu öffnen. Hier kannst du:

  • Einen öffentlichen Link erhalten: Eine eindeutige URL, die jeder öffnen kann, um deine Foto-Challenge online zu spielen.
  • Passwortschutz hinzufügen: Optional ein Passwort festlegen, damit nur eingeladene Gäste auf das Rätsel zugreifen können.
  • Punktestand und Bestenliste aktivieren: Aktiviere das Punktesystem, um die Punktzahl jedes Spielers, die Abschlusszeit, die verwendeten Hinweise und fehlgeschlagene Versuche zu verfolgen. Die Spieler werden auf einer Live-Bestenliste eingestuft, die auf der Rätselseite sichtbar ist.
  • Bestenliste für Spieler anzeigen: Wähle, ob die Spieler die Bestenliste und die Punktzahlen anderer Spieler sehen können.

Du kannst den öffentlichen Link kopieren, ihn über eine beliebige Messaging-App teilen oder das Rätsel jederzeit wieder zurückziehen.

Online-Spiel ist in allen kostenpflichtigen Paketen verfügbar. Nutzer des kostenlosen Plans können keine Rätsel veröffentlichen.

15. So funktioniert das Online-Spiel für Spieler

Wenn jemand deinen Rätsel-Link öffnet, sieht er einen Begrüßungsbildschirm mit dem Rätseltitel, deiner benutzerdefinierten Kopfzeile (falls eingerichtet) und einem Namenseingabefeld. Nach der Eingabe ihres Namens tippen sie auf Spiel starten.

Die Foto-Challenge wird je nach Gerät unterschiedlich angezeigt:

  • Auf großen Bildschirmen: Das von dir entworfene Gitterlayout wird unverändert angezeigt, mit allen Fotos in Zeilen und Spalten angeordnet.
  • Auf dem Mobilgerät: Fotos werden einzeln als Slider angezeigt, mit Thumbnails aller Fotos unten zur schnellen Navigation. Das aktive Foto wird in der Thumbnail-Leiste hervorgehoben.

Die Spieler tippen auf ein Foto, um das Antwortfeld zu öffnen. Sie tippen ihre Vermutung in eine Reihe von Buchstabenkästchen ein — ein Kästchen pro Zeichen — ähnlich wie bei einem Kreuzworträtsel. Wenn die Antwort mehrere Wörter enthält, enthalten die Kästchen Leerzeichen dazwischen. Auch Zahlen werden unterstützt. Jeder Fotoplatz beinhaltet:

  • Hinweis: Eine begrenzte Anzahl von Hinweisen deckt einen Buchstaben der Antwort auf.
  • Prüfen: Reicht die Vermutung ein. Richtige Antworten werden mit einem grünen Gradienten-Overlay auf dem Foto markiert; falsche Antworten erhalten ein rotes Gradienten-Overlay.
  • Abbrechen: Schließt das Antwortfeld, ohne einzureichen.

Das Spiel verfolgt auch die Zeit des Spielers, verwendete Hinweise und fehlgeschlagene Versuche, um eine Endpunktzahl zu berechnen.

Die Spieler müssen kein Konto erstellen oder etwas herunterladen. Das Spiel läuft vollständig in ihrem Browser auf jedem Gerät.

16. Tipps für eine großartige Foto-Challenge

  • Beginne mit 3×3 oder 3×4: Diese Layouts funktionieren auf den meisten Seitengrößen am besten und wirken substanziell, ohne überwältigend zu werden.
  • Verwende qualitativ hochwertige Fotos: Wenn du planst, das Rätsel zu drucken, können Bilder mit niedriger Auflösung verschwommen oder pixelig aussehen. Fotos können bis zu 5 MB groß sein, also gibt es Raum für scharfe, klare Bilder.
  • Halte dein Konzept konsistent: Spieler haben am meisten Spaß, wenn jedes Foto die gleiche Frage stellt — Wo wurde das aufgenommen? oder Wie alt waren sie? — statt Konzepte zu mischen.
  • Wähle Line oder Box für Antworten: Verwende Line für längere Antworten (vollständige Sätze, Ortsnamen mit mehreren Wörtern), wo die Spieler Platz brauchen, um frei zu schreiben. Verwende Box für kürzere Antworten — das verleiht ein Rätsel-Gefühl und macht die Challenge zu etwas, das einem Ratespiel näher kommt.
  • Tipp zum Online-Spiel: Die Wahl zwischen Line und Box wirkt sich nur auf die gedruckte Version aus. Online-Spieler tippen immer in Buchstabenkästchen, ähnlich wie bei einem Kreuzworträtsel.
  • Vorschau vor dem Veröffentlichen: Verwende Show Answers im Builder, um zu überprüfen, ob jedem Foto die richtige Antwort zugeordnet ist.
  • Teste die Online-Version: Öffne deinen eigenen Rätsel-Link und spiele ihn einmal durch, um sicherzustellen, dass die Fotos korrekt geladen werden und die Antworten akzeptiert werden.

Brauchst du Hilfe?

Wenn du Fragen hast oder auf Probleme beim Erstellen deiner Foto-Challenge stößt, kontaktiere unser Support-Team über die Hilfe-Seite.