Einführung in erweitertes Branding

  • Aktualisiert

7.2.jpg

Sobald die Funktion „Deep Branding“ für Ihr Unternehmen verfügbar ist, navigieren Sie zum Dashboard des Events, das Sie an Ihren Unternehmensstil anpassen möchten, wählen Sie Setup > Thema und klicken Sie auf „erweitertes Einstellungen anzeigen“.

Sobald Deep Branding für Ihre Organisation verfügbar ist, navigieren Sie zum Dashboard der Veranstaltung, die Sie mit Ihrer Marke versehen möchten, wählen Sie Einrichtung > Thema, legen Sie Ihre Primärfarbe fest und drücken Sie Speichern. Danach können Sie Erweiterte Einstellungen anzeigen auswählen, wodurch die zusätzlichen Optionen für die Anpassung geöffnet werden.

Hinweis: Wenn Sie Ihre Primärfarbe nicht einstellen, funktionieren die anderen Einstellungen nicht.

theme.png

Werfen Sie weiter unten einen Blick auf die verschiedenen Plattformelemente, deren Farbe Sie ändern können, sowie auf die entsprechenden HEX-Codes.

Hinweis: Beim Hinzufügen eines neuen Hex-Farbcodes muss der vollständige Code samt der davorstehenden Raute „#“ eingegeben werden, zum Beispiel #000000 für Schwarz. Fehlt das Vorzeichen „#“, kann dies zu unerwarteten Ergebnissen in der Hopin-Schnittstelle führen.

Fortschrittstimer

So sieht diese Funktion in Hopin aus

Screen_Shot_2020-07-14_at_9.46.17_AM.png

Entsprechende HEX-Codes

Screen_Shot_2020-07-14_at_9.46.28_AM.png

 

Tooltip

So sieht diese Funktion in Hopin aus

Screen_Shot_2020-07-14_at_9.47.11_AM.png

Entsprechende HEX-Codes

Screen_Shot_2020-07-14_at_9.47.23_AM.png

 

Eingabe

So sieht diese Funktion in Hopin aus

Screen_Shot_2020-07-14_at_9.47.36_AM.png

Entsprechende HEX-Codes

Screen_Shot_2020-07-14_at_9.47.47_AM.png

 

Suchen

So sieht diese Funktion in Hopin aus

Screen_Shot_2020-07-14_at_9.48.02_AM.png

Entsprechende HEX-Codes

Screen_Shot_2020-07-14_at_9.48.13_AM.png

 

Symbole

So sieht diese Funktion in Hopin aus

Screen_Shot_2020-07-14_at_9.48.27_AM.png

Entsprechende HEX-Codes

Screen_Shot_2020-07-14_at_9.48.40_AM.png

 

Eingabe

So sieht diese Funktion in Hopin aus

Screen_Shot_2020-07-14_at_9.49.31_AM.png

Entsprechende HEX-Codes

Screen_Shot_2020-07-14_at_9.49.41_AM.png

 

Schaltfläche (Sekundär)

So sieht diese Funktion in Hopin aus

Screen_Shot_2020-07-14_at_9.48.59_AM.png

Entsprechende HEX-Codes

Screen_Shot_2020-07-14_at_9.49.20_AM.png

 

Suche

So sieht diese Funktion in Hopin aus

Screen_Shot_2020-07-14_at_9.50.06_AM.png

Entsprechende HEX-Codes

Screen_Shot_2020-07-14_at_9.50.34_AM.png

 

Karte „Läuft gerade“ (Rezeptionsseite)

So sieht diese Funktion in Hopin aus

Screen_Shot_2020-07-28_at_9.55.12_AM.png

Entsprechende HEX-Codes

aa1e0153d5c5e27e507d93a9569e0e6c.png

 

Symbole

So sieht diese Funktion in Hopin aus

Screen_Shot_2020-07-14_at_9.50.44_AM.png

Entsprechende HEX-Codes

Screen_Shot_2020-07-14_at_9.50.53_AM.png

 

Karte

So sieht diese Funktion in Hopin aus

Screen_Shot_2020-10-23_at_8.08.58_PM.png

Entsprechende HEX-Codes

Screen_Shot_2020-07-14_at_9.52.06_AM.png

 

Schaltfläche (Primär)

So sieht diese Funktion in Hopin aus

Screen_Shot_2020-07-14_at_9.52.29_AM.png

Entsprechende HEX-Codes

Screen_Shot_2020-07-14_at_9.52.42_AM.png

 

Seitenleiste

So sieht diese Funktion in Hopin aus

Screen_Shot_2020-07-14_at_9.53.15_AM.png

Entsprechende HEX-CodesScreen_Shot_2020-07-14_at_9.53.33_AM.png

 

Schaltfläche (Sekundär)

So sieht diese Funktion in Hopin aus

Screen_Shot_2020-07-14_at_9.53.53_AM.png

Entsprechende HEX-Codes

Screen_Shot_2020-07-14_at_9.54.04_AM.png

 

Zeitplan-Tabelle

So sieht diese Funktion in Hopin aus

Screen_Shot_2020-10-23_at_8.10.09_PM.png

Entsprechende HEX-Codes

 Screen_Shot_2020-10-23_at_8.11.02_PM.png

 

Modal

So sieht diese Funktion in Hopin aus

Screen_Shot_2020-07-14_at_9.54.51_AM.png

Entsprechende HEX-Codes

Screen_Shot_2020-07-14_at_9.55.05_AM.png

 

Seitenleiste (oder Tab-Panel)

So sieht diese Funktion in Hopin aus

Screen_Shot_2020-10-23_at_8.18.48_PM.png

Entsprechende HEX-Codes

Screen_Shot_2020-07-14_at_9.56.18_AM.png

 

Karte „Was passiert gerade“ (Rezeptionsseite)

So sieht diese Funktion in Hopin aus

Screen_Shot_2020-07-14_at_9.56.44_AM.png

Entsprechende HEX-Codes

Screen_Shot_2020-07-14_at_9.57.03_AM.png

 

Textbezeichnung (Text in 12 px)

So sieht diese Funktion in Hopin aus

Screen_Shot_2020-10-23_at_8.13.07_PM.png

Entsprechende HEX-Codes

Screen_Shot_2020-07-14_at_9.56.56_AM.png

 

Schaltflächenumschalter

So sieht diese Funktion in Hopin aus

Screen_Shot_2020-07-14_at_9.57.21_AM.png

Entsprechende HEX-Codes

Screen_Shot_2020-07-14_at_9.57.34_AM.png

 

Text-Überschrift mittelgroß (Veranstaltungstitel in der Kopfzeile, Titel in der Rezeption)

So sieht diese Funktion in Hopin aus

Screen_Shot_2020-07-14_at_9.57.59_AM.png

Entsprechende HEX-Codes

Screen_Shot_2020-07-14_at_9.58.10_AM.png

 

Karte

So sieht diese Funktion in Hopin aus

Screen_Shot_2020-07-14_at_9.58.26_AM.png

Entsprechende HEX-Codes

Screen_Shot_2020-07-14_at_9.58.36_AM.png

 

Schaltflächen- & Eingaberandradius (Randschärfe)

HINWEIS: Um den Schaltflächenrandradius zu ändern, müssen Sie einen benutzerdefinierten HEX-Code in der Primärfarbe 400 eingeben.

Standardmäßiger Eingaberandradius (64 px)

Screen_Shot_2020-07-28_at_6.19.57_PM.png

Standardmäßiger Eingaberandradius (64 px)

    Screen_Shot_2020-07-28_at_6.19.12_PM.png

Entsprechende HEX-Codes Screen_Shot_2020-07-28_at_5.56.04_PM.png

Standardmäßiger Schaltflächenrandradius (64 px)

Screen_Shot_2020-07-28_at_5.58.19_PM.png

Personalisierter Schaltflächenrandradius (64 px)

Screen_Shot_2020-07-28_at_6.19.28_PM.png

 

Weitere Informationen zu bestimmten Themen und erweitertes Branding finden Sie in unseren Anleitungen zum Erstellen eines dunklen Themas, hervorgehobenen Themas oder eines einfachen Themas.

Wir stehen Ihnen gerne unter support@hopin.com zur Verfügung, falls Sie Fragen haben oder Hilfe benötigen.

War dieser Beitrag hilfreich?