Vom Grafikdesign bis zur Namensfindung: So setzten wir einem Online-Casino die Krone auf

Als wir 2019 den Auftrag bekamen, eine technische Lösung für ein Social-Casino der SCHMIDT.GRUPPE zu entwickeln, waren nicht nur unsere Skills im Programmieren und Grafikdesign gefragt, sondern auch unsere Fähigkeiten im Brand Building und im Aufbau einer Markenidentität.

Die Mission war, in Zusammenarbeit mit dem internen Grafiker der SCHMIDT.GRUPPE ein Design zu entwerfen, das zum Thema der Casino-Spielewelt passt. Zum damaligen Zeitpunkt war das Logo der Krone, das sich auf den Casinos der SCHMIDT.GRUPPE befand, das einzige vorgegebene Grafikelement. Bis dato war noch nicht einmal klar, wie das geplante Online-Casino überhaupt heißen sollte.

Jung, dynamisch und catchy – so stellten wir uns das Ergebnis vor und mit dieser Idee begann unser Markenaufbau. Von Farbschema und Typographie über Avatare bis hin zu Pop-Ups entwickelten wir die komplette Visual Identity, die ausdrückt, was das Social-Casino eigentlich verkörpert. In engem Austausch mit der SCHMIDT.GRUPPE entstand ein Produkt, dessen Außenwirkung wir maßgeblich mitbestimmen konnten.

Nomen est omen und Versuch macht kluch
Der erste Schritt war, einen Namen für das Social-Casino zu finden. Dafür arbeiteten wir intensiv mit der SCHMIDT.GRUPPE zusammen. Jeder konnte seine Ideen einbringen, über die gemeinsam abgestimmt wurde. Da die Krone ein zentrales Element der Spielstationen darstellte, war schnell klar, dass wir sie in irgendeiner Weise im Namen aufgreifen mussten. Es gab eine Fülle an Vorschlägen, um mit „Kronenspiel“ nur einen zu nennen. Letztlich fiel die Wahl auf „Kleine Krone“. Uns war bewusst, dass der Begriff „klein“ nicht immer nur gute Assoziationen weckt, er passte aber am besten. „Kleine Krone“ ist einprägsam, vermittelnd, angenehm unaufdringlich und nimmt Bezug auf das Social-Casino als Online-Ableger der stationären Spieleautomaten, die die SCHMIDT.GRUPPE vertreibt.

Als der Name gefunden war, ging es darum, eine Designvorlage zu entwickeln. Also haben wir drauflosskizziert, um unterschiedliche Ansätze zur Verfügung zu haben und darauf basierend ein Protodesign zu entwickeln, das wir programmieren wollen. Zunächst mussten wir ein Farbschema und eine Typographie passend zu Logo und Namen finden. Am Ende hatten wir ein Portfolio von stark reduzierten über kindlich-verkitschte bis hin zu royal-eleganten Entwürfen vor uns liegen. Wir gingen davon aus, dass die Designsprache eines Social-Casinos verspielter sein darf als die eines Echtgeld-Casinos. Das räumte uns mehr Freiheiten und Möglichkeiten ein, kreativ zu sein, machte es aber auch schwieriger, sich für eine Vorlage zu entscheiden. Letztlich wählten wir ein universelles Design mit goldenem Schriftzug und dunklem Hintergrund, das den royalen Aspekt des Online-Casinos widerspiegelt und weder zu seriös noch zu verspielt erscheint.

Die Macht vereinter Skills: Illustration trifft auf UI/UX-Design
Das royale Thema des Designs zieht sich wie ein roter Faden durch alle weiteren Elemente, die wir für das Online-Casino entwickelten – seien es Kronen- und Goldpakete, die wir nach aufsteigendem Wert als Samtsäckchen oder prall gefüllte Schatztruhe gezeichnet haben, oder die Casino-Währung, die optisch an Dänische Kronen angelehnt ist. Auch in der Farbgestaltung orientierten wir uns primär an typisch royalen Farben, insbesondere Gold und Lila bzw. Purpur, das im Mittelalter als Herrscherfarbe galt und ausschließlich Königen und Königinnen vorbehalten war.

Während unserer Zusammenarbeit gelang es uns, illustratorische Fähigkeiten mit UI/UX-Skills zu verbinden, und konnten von den Stärken und Ressourcen aller Beteiligten profitieren. Gemeinsam gestalteten wir Avatare vom Ritter bis zur Prinzessin und thematisch passende Icons. Wir starteten mit einfachen 2D-Grafiken und entwickelten daraus superkonkrete 3D-Charaktere im realistischen Look. Jeder von uns schlug seine eigenen Designvorlagen vor, aus denen wir jeweils die besten Elemente übernahmen und zu einem einheitlichen Ganzen zusammenfügten. Die Arbeit war kleinteilig und reichte von der Konzeptionierung von Pop-Ups bis hin zum Login-Bereich.

Zwar enthält unser Design historisch-altertümliche Elemente, erscheint aber in erster Linie königlich. Von dem starken Mittelalter-Fokus, den wir zu Beginn der Entwicklung hatten, sind wir am Ende abgerückt. Grund dafür ist, dass es im Social-Casino Slots mit unterschiedlichen Settings (Altes Ägypten, Samurai etc.) gibt, auf die eine rein mittelalterliche Metapher nicht passt. Unser Design vereint alle Themen und Metagames unter sich, ohne unkonkret zu werden. Zur Harmonisierung haben wir sämtlichen Slotbildern einen einheitlichen Rahmen gegeben. So sorgen wir für eine klare Bildsprache und führen die Welten des Online-Casinos zusammen.

Der Spagat zwischen Web- und Mobilansicht
Kleine Krone kann nicht nur im Web, sondern auch als App auf mobilen Endgeräten gespielt werden, was uns vor die Aufgabe stellte, unser Design auf die mobile Ansicht anzupassen und zu optimieren. Um eine gute Darstellung auf Smartphone und Tablet sicherzustellen und den Platz auf dem Display bestmöglich zu nutzen, mussten Designelemente wie Rahmen oder Vorhänge weichen. Wichtig war in dem Zusammenhang, dass die royale Metapher erkennbar ist und der rote Faden nicht verloren geht. Das konnten wir durch die Platzierung semantisch relevanter Icons wie der Währung sicherstellen.

Vor eine ähnliche Herausforderung stellte uns die Situation, wenn man sich mitten in einem Slotspiel befindet. Gerade auf mobilen Endgeräten soll so viel wie möglich von der Themenwelt dargestellt werden. Dabei darf jedoch nicht der Eindruck entstehen, man befände sich in einem vollkommen anderen Spiel. Auf einen Header und eine Sidebar, die Metainformationen tragen, konnten wir nicht verzichten, denn nur darüber kann der Bezug zu Kleine Krone hergestellt werden. Spielerinnen und Spieler können daran ablesen, wie viel es aktuell zu gewinnen gibt, wer in einem Turnier führt usw. Die responsive Lösung war in dem Fall, die Informationen ein- und ausblendbar zu machen.

Leistungsstarke Tools und perfekte Schnittstellen
Dank unkomplizierter Abstimmungs- und Abnahmeprozesse mit der SCHMIDT.GRUPPE konnten wir rasche Ergebnisse erzielen. Das lag nicht nur daran, dass wir uns inhaltlich und konzeptionell schnell einig waren, sondern auch daran, dass wir für jeden Bereich die richtigen Schnittstellen hatten. Unser Webdesign konnten wir einem Webprogrammierer zur Verfügung stellen, unser Appdesign einem Appprogrammierer.

Für die Entwicklung des Layouts und fürs Wireframing haben wir auf Sketch zurückgegriffen. In der Software haben wir alle Elemente koordiniert, die nicht Pixelgrafiken sind, und daraus unsere Designs gebaut. Für die Übergabe nutzten wir Zeplin, das als Plugin in Sketch funktioniert. Über Zeplin haben wir unsere Wireframes direkt aus Sketch hochgeladen und den Programmierern zur Verfügung gestellt. Vorteilhaft an dem Tool ist, dass es den Dateien automatisch Anmerkungen beispielsweise zu Pixelgrößen, Farben und Rändern hinzufügt. Die Programmierer konnten sofort das CSS sehen und wussten, wie sie es bauen mussten.

Ein krönender Abschluss
Kleine Krone ist ein Projekt, das mir das enorme Potenzial von Synergien aufgezeigt hat. Durch die enge Zusammenarbeit mit der SCHMIDT.GRUPPE war es möglich, das Know-how jedes einzelnen in die Designentwicklung mit einzubeziehen und daraus eine Lösung zu entwickeln, die das Beste aus allen Welten vereint. Wir haben viel experimentiert, Visionen umgesetzt, Aspekte der Außenwirkung und Eigenschaften des Produkts wesentlich mitbestimmt und auf diese Weise eine Marke aufgebaut, was viel Spaß gemacht hat. Kleine Krone ist auch ein Projekt, dass jede Menge Veränderungspotenzial in sich birgt und mich als Designer dazu motiviert, mich stetig weiterzuentwickeln. Es spannend, herausfordernd, dynamisch und progressiv und fordert mich heraus, immer wieder neu zu denken und andere Perspektiven einzunehmen – das ist in jeder Hinsicht eine Bereicherung.