Zum Inhalt springen

Design und Marke.

Farben, Schrift und Logo deines Shops in ShopBuilder ai — aus deinem BrandStudio oder selbst gewählt, mit Kontrastprüfung, damit alles lesbar bleibt.

VideoEigenes Design verwenden — und zurück
Auf dieser Seite

Das Design kommt aus deinem BrandStudio

Hast du im BrandStudio ai eine Marke gepflegt, übernimmt dein Laden sie von selbst: Farben, Schrift, Logo, Firmenangaben, Impressum und die Zeichen deiner sozialen Netzwerke für den Fuß der Seite. Änderst du die Marke, trägt der Laden sie kurz darauf von selbst; die Werkbank zeigt es, sobald du zu ihr zurückkommst.

Unter „Design“ steht dann oben „Design und Daten kommen aus BrandStudio“ und was genau übernommen wird. Farbfeld und Logo sind in diesem Zustand gesperrt. Wäre eine Markenfarbe im Laden schwer lesbar, nimmt der Laden an ihrer Stelle seine Vorgabe oder Schwarz oder Weiß, und der Kasten nennt die betroffene Farbe.

Gibt deine Marke keine Farben, Schrift oder Logo vor, sagt der Bereich auch das — mit dem Weg ins BrandStudio.

„Design“ von Café Lumen, der Laden folgt der Marke: oben der Kasten „Design und Daten kommen aus BrandStudio“ mit dem Knopf „Eigenes Design verwenden“, darunter das gesperrte Farbfeld, rechts die Vorschau in den Markenfarben.

Eigenes Design verwenden — und zurück

Soll der Laden anders aussehen als deine Marke, klickst du auf „Eigenes Design verwenden“. Der jetzige Stand wird dein Ausgangspunkt — nichts springt um —, und die Felder werden frei. Ab dann folgt der Laden der Marke nicht mehr.

Der Weg zurück ist „Zurück zur Marke“: Der Laden trägt wieder die Marke und folgt ihr auch, wenn du sie später änderst. Dein eigenes Farbfeld wird dabei beiseitegelegt; mit „Rückgängig: eigenes Design vom …“ holst du es zurück. Es gibt genau eine Stufe — das nächste „Zurück zur Marke“ ersetzt sie.

„Design“ von Café Lumen: Ana klickt auf „Eigenes Design verwenden“, die Felder werden frei und das Abzeichen „eigenes Design“ erscheint; dann klickt sie auf „Zurück zur Marke“, und der Knopf „Rückgängig: eigenes Design vom …“ steht bereit.
  1. Öffne „Design“.
  2. Klicke auf „Eigenes Design verwenden“.
  3. Für den Rückweg klicke auf „Zurück zur Marke“.

Farbfelder, eigene Farben, Schrift

Unter „Farbfeld und Schrift“ stehen acht „Fertige Farbfelder“, jedes mit einer passenden Schrift und auf Lesbarkeit geprüft. Ein Farbfeld belegt vier Rollen: „Seitengrund“, „Oberfläche“ der Karten, „Text“ und „Akzent“ für Knöpfe und Links.

Unter „Eigene Farben“ tippst du jede Rolle als Hex-Wert mit sechs Zeichen — #004D40 — oder wählst sie mit dem Farbwähler daneben; darunter wählst du die „Schrift“. Ein Klick auf ein Farbfeld speichert noch nichts: Die Maske sagt „Ungespeicherte Änderungen“, bis du auf „Aussehen speichern“ klickst.

„Auf die Vorgabe zurücksetzen“ nimmt deine eigenen Farben wieder weg. Der Laden trägt dann die Farben deiner Marke oder, ohne Marke, das erste der fertigen Farbfelder.

„Design“ mit eigenem Design: Ana tippt das Farbfeld „Sand“ an, die Vorschau wechselt die Farben, „Ungespeicherte Änderungen“ erscheint, und sie klickt auf „Aussehen speichern“.
  1. Wähle ein fertiges Farbfeld oder tippe eigene Farben.
  2. Prüfe unter „Lesbarkeit“ die drei Paare.
  3. Klicke auf „Aussehen speichern“.

Lesbarkeit wird gerechnet

Unter „Lesbarkeit“ rechnet die Werkbank für drei Paare den Kontrast aus: „Text auf dem Seitengrund“, „Text auf Karten“ und „Schrift auf Knöpfen“. Jedes Paar bekommt eine Zahl und ein Wort, von „Sehr gut lesbar“ bis „Nicht lesbar“.

Jedes Paar muss mindestens 4,5:1 erreichen, sonst lässt sich das Farbfeld nicht speichern, und die Werkbank sagt, welches Paar zu schwach ist. So bleibt dein Laden für alle lesbar, auch für Menschen, die schlecht sehen.

Der Kasten „Lesbarkeit“ mit drei Zeilen samt Kontrastzahl und Bewertung, eine davon „Knapp — schwer zu lesen“, darunter der Hinweis, dass der Laden dieses Farbfeld nicht annimmt.

Logo und Untertitel

Das Logo wählst du unter „Logo“ mit „Aus MediaStudio wählen“ aus deinen Bildern; es steht dann im Kopf jeder Seite deines Ladens. Ohne Logo steht dort der Name. Wie die Produktbilder wird es nicht kopiert: Tauschst du es im MediaStudio aus, wechselt es im Laden mit, und solange es im Laden steht, lässt es sich dort nicht löschen. „Logo entfernen“ nimmt es aus dem Laden.

Der „Untertitel“ ist ein Satz unter dem Namen deines Ladens — „Frisch geröstet in Lissabon“. Er gehört dir und wird nicht übersetzt; leer lassen ist in Ordnung.

„Design“ von Café Lumen: Ana klickt unter „Logo“ auf „Aus MediaStudio wählen“ und tippt das Logo an — „Logo übernommen.“ erscheint —, trägt als Untertitel „Frisch geröstet in Lissabon“ ein und klickt auf „Speichern“.
  1. Klicke unter „Logo“ auf „Aus MediaStudio wählen“ und tippe dein Logo an.
  2. Trage unter „Untertitel“ deinen Satz ein und klicke auf „Speichern“.

Die Vorschau

Neben den Feldern zeigt eine Vorschau deinen Laden so, wie deine Käufer ihn sehen: Logo, Name, Untertitel und eines deiner Produkte mit Bild, Preis und Knopf, in der gewählten Schrift. Auf schmalen Bildschirmen klappst du sie mit „Vorschau“ auf.

Sie ist nur Darstellung — kaufen lässt sich darin nichts, und veröffentlicht wird nichts. Deine Käufer sehen neue Farben erst, wenn du gespeichert hast.

Die Vorschau neben dem Farbfeld: Kopf mit Logo und „Café Lumen“, der Untertitel und eine Karte „Lumen Blend“ mit Bild, Preis und Knopf in der Akzentfarbe.

Passende Anleitungen und nächste Schritte

Das Tool kennenlernen: ⁦ShopBuilder ai⁩

Hilf uns, KENJTEC zu verbessern

Google Analytics hilft uns, die Website zu verbessern. Google erhält Nutzungs- und Gerätedaten; eine Verarbeitung in den USA ist möglich.

Freiwillig. Deine Wahl gilt 180 Tage und ist jederzeit in den Cookie-Einstellungen änderbar.

Datenschutzerklärung