Das Anlegen unseres beliebten Formats Finde-das-Paar geht einfach und intuitiv. Trotzdem beschreiben wir Ihnen in diesem Tutorial Schritt für Schritt, wie Sie selbstständig im contentbird Convert ein Finde-das-Paar anlegen.

Für Ihre Vorbereitung: Wie ist ein Finde-das-Paar aufgebaut?

Unser Spiel Finde-das-Paar besteht aus zwei Ebenen:

  1. Der Hintergrund: Dieser entspricht in der analogen Welt dem Untergrund, auf dem die Karten liegen. Hierfür benötigen Sie eine entsprechend große Grafik.

  2. Die Spielkarten: Ihr Finde-das-Paar kann aus beliebig vielen Spielkarten bestehen. Sie benötigen eine Grafik für die Rückseite der Karten und entsprechend viele Grafiken für die Motivbilder. Eine Besonderheit unseres Spiels: Sie können auch zusammenpassende Motivbilder suchen lassen, z. B. ein Bild eines Nationalgerichts und die passende Flagge dazu oder Promipaare.

Auf dem Hintergrund ziehen Sie die Spielfläche, auf der die Karten verteilt werden. Sie können den gesamten Hintergrund mit den Karten belegen lassen oder nur einen Teil. Letzteres ist z. B. sinnvoll, wenn Sie auf dem Hintergrund noch die Gewinne abbilden möchten.

Wie groß müssen die Grafiken sein?

Die Grafik für den Hintergrund muss mindestens so groß sein, wie das Finde-das-Paar auf Ihrer Webseite dargestellt werden soll.

Die Größe der Karten-Grafiken kann nicht so pauschal erklärt werden, da sich die Darstellung aus mehreren Faktoren berechnet: Größe der Spielfläche, Anzahl der Karten und angegebener Abstand zwischen den Karten. Wir empfehlen daher im Allgemeinen, die Grafiken für die Rückseite und die Motive in 200 x 200 px anzulegen.

Das Finde-das-Paar ist, wie jedes Format, responsiv. Sofern Ihre Webseite Responsive Design unterstützt, passt sich das Spiel der Browserbreite an. Das Seitenverhältnis des Formats sowie die Position und relative Größe der Karten werden dabei immer beibehalten.

Anlegen des Formats

Loggen Sie sich unter manager.contilla.de in den contentbird Convert ein und gehen Sie über die linke Navigation in Ihren Content-Editor. Dort wählen Sie die Kachel ?Finde-das-Paar?.

Hinweis: Wenn Sie ein Finde-das-Paar anlegen, befinden Sie sich zunächst im Assistenzmodus, d. h., Sie werden Schritt für Schritt durch die Erstellung geleitet und müssen nicht, wie im Folgenden beschrieben, über die Navigation gehen: Bei jedem Punkt erscheint unten ein Button mit ?weiter? o. Ä. Erst wenn Sie den Assistenzmodus verlassen (Sie klicken aktiv auf einen Menüpunkt in der Navigation, loggen sich aus oder schließen den Browser), erreichen Sie die einzelnen Bearbeitungspunkte über die Navigation.

Navigationspunkt ?Beschreibung?

Sprache
Wählen Sie unter ?Sprache? im Dropdown-Menü die Sprache aus, in der die festen Elemente des Finde-das-Paar angezeigt werden sollen (z. B. der Start-Button).

Name
Unter ?Name? geben Sie einen aussagekräftigen Namen für Ihr Finde-das-Paar ein, der Ihnen ermöglicht, es auch in Nachhinein noch in Ihrer Liste der Formate wiederzufinden. Diese finden Sie links oben auf Ihrem Dashboard oder unter dem Navigationspunkt ?Content-Übersicht?. Dieser Name darf nur einmal verwendet werden, daher ist es sinnvoll, beispielsweise das Datum mit anzugeben.

Titel
Unter ?Titel? können Sie einen abweichenden Titel vergeben. Dieser Titel kann optional in der Titelzeile des Finde-das-Paar angezeigt werden.

?Beschreibung? ist ein optionales internes Feld für Sie, das Sie leer lassen können

Interne Vermerke
Ganz unten unter ?Interne Vermerke? können Sie für sich oder Ihre Kollegen Notizen hinterlassen, z. B. für welche Aktion das Finde-das-Paar gedacht ist oder dass die Bilder noch vor der Veröffentlichung ausgetauscht werden müssen.

Navigationspunkt ?Einstellungen?

In den allgemeinen Einstellungen können Sie Features für Ihr Finde-das-Paar aktivieren.

Format-Titel anzeigen
In der Kopfzeile des Finde-das-Paar wird der Titel, den Sie unter ?Beschreibung? angegeben haben, angezeigt.

Stoppuhr
Auf dem Hintergrund des Spiels wird die gespielte Zeit angezeigt.

Spielzüge zählen
Auf dem Hintergrund des Spiels werden die ausgeführten Spielzüge angezeigt (ein Spielzug = zwei Klicks auf zwei verschiedene Karten).

Facebook-Share
Button auf der Abschlussseite, mit dem der User andere auf Facebook auffordern kann, ebenfalls das Finde-das-Paar zu spielen. (Den Text geben Sie später an.)

Neustart
Wenn der User auf den Start-Button auf dem Hintergrund klickt, beginnt das Spiel von vorne.

Lead-Generierung
Unverzichtbar, falls Sie ein Gewinnspiel machen. Aktivieren Sie die Lead-Generierung, um Kundendaten zu erfassen.

Anleitungen zum Hinzufügen eines Leadformulars und zum Exportieren der Leaddaten finden Sie in unserem Helpcenter hier.

Optionen in der Fußzeile
Hier definieren Sie, welche rechtlichen Informationen Sie in der Fußzeile anzeigen möchten: ?Datenschutzerklärung?, ?Impressum? und ?Teilnahmebedingungen?. Klicken Sie das Gewünschte an. Alle rechtlichen Informationen sind optional. Das Impressum ist nur notwendig, wenn die Webseite, auf der das Finde-das-Paar eingebunden ist, über kein Impressum verfügt. Gleiches gilt für die Datenschutzerklärung.

Wenn Sie eine der Checkboxen angeklickt und gespeichert haben, erscheint unter ?Einstellungen? der Untermenüpunkt ?Fußzeile?. Hier können Sie die passenden Informationen als PDF hinterlegen.



Whitelabeling
Unterdrücken Sie das ?powered by Contilla? in der Fußleiste. Sollten Sie dieses Feature nicht angezeigt bekommen, erkundigen Sie sich bei Ihrem Ansprechpartner bei contentbird Convert.

Klicken Sie wie nach jeder Bearbeitung auf ?speichern?.

Navigationspunkt ?Gestaltung?

Kopfzeile

Dieser Menüpunkt erscheint nur, wenn Sie unter ?Einstellungen? ?Format-Titel anzeigen? aktiviert haben. Geben Sie die Farben für den Hintergrund und die Schrift des Titels an und definieren Sie die Schriftgröße.

Allgemein

Abmessung des Spiels
Stellen Sie unter ?Abmessung des Spiels? ein, wie groß das Finde-das-Paar (exklusiv der Titelzeile) auf Ihrer Webseite angezeigt werden soll. Geben Sie die Breite und Höhe ein. Wenn Ihre Webseite responsive ist, geben Sie die maximalen gewünschten Maße des Spiels an.

Status-Elemente
Dies sind der Start-Button, die Anzeige Stoppuhr und der Anzahl der Züge. Legen Sie über das Drop-Down-Menü ?Position? fest, ob diese rechts oder links unten auf dem Hintergrundbild dargestellt werden sollen (?rechter Rand? bzw. ?linker Rand?) oder unter der Hintergrundgrafik (?unter Spielfeld?), welche Hintergrundfarbe diese haben soll (wird mit Transparenz dargestellt, falls auf dem Hintergrundbild) und welche Farben der Start-Button, der Text und der Text auf dem Button haben sollen.

Hinweis: Die Darstellung der Status-Elemente unterhalb der Hintergrundgrafik ist vor allem für die mobile Ansicht zu empfehlen.

Spielkarten
Geben Sie an, wie viele Spielkarten Sie verwenden möchten. Die Zahl betrifft die gesamte Anzahl der Karten: Möchten Sie z. B. 5 Kartenpaare suchen lassen, geben Sie hier 10 an.

Anschließend definieren Sie die Pixelwerte für:

  • den Abstand zwischen den Karten an (?Kartenabstand?)

  • für das Passepartout (?Passepartout-Breite?), falls eines gewünscht ist (betrifft nur die Motivbilder, die Rückseite der Karten hat kein Passepartout)

  • für die ?Breite der Umrandung? der Karten (betrifft die Motivbilder und die Rückseite)

Zudem können Sie die Option aktivieren: ?Gefundene Kartenpaare ausgegraut auf der Spielfläche belassen? (ansonsten verschwinden die gefundenen Kartenpaare einfach).

Mit der Option ?Ähnliche Kartenpaare? aktivieren Sie, dass die User zusammenpassende Paare suchen müssen (z. B. Nationalgericht + Flagge des Landes oder Promipaare).

Facebook-Vorschau
Wenn Sie unter ?Einstellungen? den Facebook-Share aktiviert haben, erscheint nach Lösung des Spiels ein Button zum Posten. Neben den Button kann der User auf die Vorschau klicken. Über ?Ausrichtung? legen Sie fest, wo diese Vorschau erscheinen soll.

Speichern Sie die allgemeine Gestaltung.

Spielfläche

Laden Sie bei ?Hintergrund? Ihre Grafik für den Hintergrund hoch (als JPG oder PNG), entweder per Drag?n?Drop oder über ?Datei auswählen?.

Bei ?Spielfläche? ziehen Sie mit der Maus den Bereich, auf dem die Karten platziert werden sollen. Der Bereich, auf dem ?Platzhalter? steht, gibt Ihnen eine ungefähre Orientierung, bis wohin die Status-Elemente mit dem Start-Button und der Stoppuhr ?hineinragen?.

Tipp: Die Größe und Anordnung der Karten berechnet sich aus der Anzahl der Karten, den von Ihnen angegebenen Kartenabstand und der Größe der Spielfläche, die Sie hier ziehen. Deswegen muss man die Größe der Spielfläche manchmal etwas variieren, bis man zum gewünschten Ergebnis gelangt. Öffnen Sie sich am besten, wenn Sie alle Bilder hochgeladen haben, die Einstellung der Spielfläche und den Testlauf parallel in einem Tab und probieren Sie ein wenig aus.

Speichern Sie die Spielfläche

Fußzeile

Geben Sie die Hintergrundfarbe, die Schriftfarbe und die Schriftgröße der Fußzeile an.

Navigationspunkt ?Inhalt?

Motive

Legen Sie die Motivbilder fest, also die Bilder, die vom User gefunden werden müssen.

Klicken Sie bei ?Neue Vorderseite anlegen? auf ?Anlegen?.

Unter ?Spielkarte? sehen Sie die Information, wie groß nach den aktuellen Einstellungen die Karten dargestellt werden.

Laden Sie die Grafik per Drag?n?Drop oder über ?Datei auswählen? hoch (als JPG oder PNG).

Falls Sie unter ?Gestaltung? ?Ähnliche Kartenpaare? aktiviert haben, können Sie ?Bild für die korrespondierende Spielkarte? anklicken und das passende Bild hochladen.

Um bestehende Motivbilder zu bearbeiten oder zu entfernen, gehen Sie auf ?Inhalt/Motive? und klicken beim entsprechenden Bild auf ?Bearbeiten? bzw. ?Entfernen?.

Deckblätter

Das Deckblatt ist die Rückseite der Karten. Das Hochladen, Bearbeiten und Entfernen funktioniert genauso wie bei den Motivbildern.

Wenn Sie mehrere Deckblätter hochladen, werden diese abwechselnd im Spiel dargestellt.

Abschluss

In dem Navigationspunkt ?Abschluss? geben Sie den Text ein, der nach der Lösung des Finde-das-Paar angezeigt wird und den Text für den Facebook-Post, der die User dazu anregen soll, das Spiel auf Facebook zu teilen.

Geben Sie unter ?Überschrift? einen Titel ein und darunter bei ?Nachricht? einen passenden Text.

Unter ?Facebook-Posting? sollten Sie einen Text wählen, der eine Aufforderung erhält, die der User in seinem Namen auf Facebook posten kann, um seine Freunde zu animieren, ebenfalls das Finde-das-Paar zu spielen. Den Facebook-Share aktivieren und deaktivieren Sie unter dem Punkt ?Einstellungen?. Sie haben die Möglichkeit, ein Bild pro Account für Facebook-Posts zu hinterlegen. Dieses sollte quadratisch sein, mindestens 300x300 px groß und ? da es sehr klein angezeigt wird ? nicht zu detailreich. Schicken Sie hierfür ein passendes Bild im Format JPG oder PNG an support@contilla.de.

Tipp 1: Fahren Sie mit der Maus über das blaue Fragezeichen, um Editierungsmöglichkeiten zum jeweiligen Text angezeigt zu bekommen. Sie haben z. B. die Möglichkeit, im Facebook-Post die gespielte Zeit des Users zu integrieren.

Tipp 2: Fügen Sie Ihrem Abschlusstext einen Link hinzu. Die Anleitung für die Linkintegration finden Sie hier.

Klicken Sie wie nach jeder Bearbeitung auf ?speichern? und schauen Sie sich unter dem Navigationspunkt ?Testlauf? Ihr Ergebnis an.

Navigationspunkt ?Testlauf?

Im Testlauf können Sie Ihr Finde-das-Paar bereits vor der Integration vollständig betrachten und durchklicken. Bitte beachten Sie, dass das abschicken eines Leads nicht im Testlauf getestet werden kann. Testen Sie dies bitte nach Ihrer Integration des Finde-das-Paar.

Hinweis: Im Testlauf ist es nicht möglich, alle Eigenschaften Ihrer Webseite zu berücksichtigen, sodass die Ansichten im Testlauf und auf Ihrer Webseite abweichen können (z. B. Schriftart, Zeilenabstände, Linkfarben).

Fehlersuche und Integration

Unter dem Navigationspunkt ?Live-Integration? können Sie das Finde-das-Paar auf Fehler prüfen, aktualisieren und integrieren.

Fehlersuche
im Menü ?Live-Integration? sollte ein grünes Häkchen mit dem Hinweis ?Ihr Format weist keine Probleme auf und kann aktualisiert werden.? erscheinen. Ansonsten werden Ihnen Warnhinweise angezeigt. Falls ein Warnhinweis angezeigt wird, können Sie diesen über den Pfeil links neben dem Hinweis weiter ausklappen, um Details zu erfahren und zu der Fehlerquelle zu springen.

Aktualisieren
Klicken Sie auf den Button ?Aktualisieren?, um ein bereits eingebundenes Finde-das-Paar, an dem Sie Änderungen vorgenommen haben, auch in der Live-Version auf den neusten Stand zu bringen. Alle Änderungen, die Sie im Finde-das-Paar vornehmen, werden erst nach dieser Aktualisierung in Ihrer Veröffentlichung übernommen.

Integration
Detaillierte Schritt-für-Schritt-Anleitungen zur Integration Ihrer Formate finden Sie hier.

Fehlerbehebung
Die ersten Schritte bei einer fehlerhaften Darstellung auf Ihrer Webseite finden Sie hier.

Übersicht Anforderungen

Hier noch einmal im Kurzen die Dinge, die Sie mindestens vorbereiten müssen, um ein Finde-das-Paar zu erstellen:

  • Grafiken: Grafik für Hintergrund (mindestens so groß, wie das Finde-das-Paar dargestellt werden soll), Grafiken für die Motivbilder (am besten 200 x 200 px), Grafik für die Rückseite der Spielkarten (am besten 200 x 200 px); alle Grafiken als JPG oder PNG

  • Texte: Abschluss: Überschrift und Nachricht, optional Text für Facebookposting

Wir wünschen Ihnen eine erfolgreiche Aktion!

Ihr contentbird Convert-Team

War diese Antwort hilfreich für Sie?