Chesslers: Entwicklung einer Web3-Gaming-Plattform
Im Oktober 2022 habe ich über ADPList diesen coolen Job als freiberuflicher Designer bekommen. Und ich sage Ihnen, es war eine wilde Fahrt! In dieser Fallstudie geht es darum, was passiert ist und was wir erreicht haben. Wir sprechen über den Prozess, das Ergebnis und die Auswirkungen.
Lasst uns dieses Spiel beginnen!
- Bei Respct geht es also darum, bestehenden Web2-Spielen durch die Einführung einer Wettebene etwas Würze zu verleihen. Und Chessler ? Nun, es ist eines ihrer Babys – ein Projekt, das sich speziell darauf konzentriert, diese Wettebene in das Schachspiel zu integrieren.
- Der Gründer wandte sich nur mit einer Idee an mich und ich war von Anfang bis Ende für das gesamte Plattformdesign verantwortlich.
Dazu gehörte das Brainstorming von Ideen, das Herausfinden, wie Benutzer auf der Plattform navigieren würden, das Sammeln von Inspirationen durch Moodboards, die Erstellung von Wireframes, die Entwicklung von Web- und Mobildesigns und sogar die Erstellung von Prototypen!
- Einer der aufregendsten Bereiche von Web3 ist das Play-to-Earn-Gaming. Dies bezieht sich auf Spiele, bei denen Spieler Kryptowährungen oder andere digitale Vermögenswerte verdienen können.
- Schach war aufgrund seiner intellektuellen Tiefe und globalen Anziehungskraft eine gute Wahl für die Plattform. Schnellschachformate eignen sich aufgrund ihres rasanten Gameplays ebenfalls hervorragend für das Spiel.
Dadurch wird es für Spieler schwieriger, zu betrügen oder sich auf unfaire Praktiken einzulassen, da ihnen weniger Zeit zum Planen und Strategisieren bleibt. - Als ich mit dem Projekt begann, war ich ein absoluter Neuling in beiden Bereichen: Schach und Web3. Daher bestand eine der größten Herausforderungen darin, die Einzelheiten beider zu verstehen, um den Benutzern ein reibungsloses Erlebnis bieten zu können.
Forschung und Ideenfindung:
Der erste Schritt bestand darin, die Vision des Gründers für das Projekt zu verstehen und gründliche Recherchen zu Schach, Play-to-Earn-Gaming und Web3-Technologie durchzuführen – dazu gehörte es, Zeit auf bestehenden Plattformen zu verbringen und Schwachstellen und Verbesserungsmöglichkeiten zu identifizieren.
Benutzerflüsse und Wireframes:
Ich habe die verschiedenen Benutzerinteraktionen analysiert, die auf der Plattform stattfinden würden, und die wichtigsten Berührungspunkte identifiziert . Dies hat mir geholfen, die Informationsarchitektur und Navigation der Plattform zu bestimmen.
Ich habe mehrere Benutzerabläufe erstellt, um verschiedene Szenarien und Variationen zu untersuchen und so potenzielle Probleme oder Engpässe in der Benutzerreise zu identifizieren .
Ich habe eng mit dem Gründer zusammengearbeitet, um sicherzustellen, dass die Benutzerströme mit ihrer Vision für die Plattform übereinstimmten.
Mit einem klaren Verständnis der User Journey konnte ich mit der nächsten Phase des Designprozesses fortfahren, bei der es darum ging, Inspiration zu sammeln und die visuellen Elemente der Plattform zu erstellen.
Moodboards und Designelemente:
Um den Ton für die Ästhetik der Plattform festzulegen, habe ich ein Moodboard zusammengestellt und verschiedene Designelemente wie Typografie, Farbpaletten und Bilder handverlesen. Diese Elemente haben mir geholfen, eine visuelle Ausrichtung für die Plattform festzulegen und ein einheitliches und zusammenhängendes Erscheinungsbild zu schaffen. Ich wollte, dass das Design optisch ansprechend, funktional, intuitiv und benutzerfreundlich ist.
Visuelle Design-Iterationen:
In diesem Abschnitt werde ich Sie durch die verschiedenen Iterationen führen, die ich für jeden Abschnitt der Plattform erstellt habe, einschließlich der Zielseite, Herausforderungen und Benutzerprofile. Das endgültige und vollständige Design finden Sie im nächsten Abschnitt.
Aus Zeitgründen habe ich beschlossen, auf Wireframing zu verzichten und direkt mit der visuellen Designphase zu beginnen. Dieser Ansatz ermöglichte es mir, schnell eine greifbare Darstellung der Plattform zu erstellen und besser zu verstehen, wie die Designelemente zusammenwirkten. Allerdings habe ich die Entwürfe kontinuierlich überarbeitet und verfeinert, als ich Feedback und weitere Erkenntnisse erhielt.
Für die Landingpage haben wir uns für einen einfachen und einprägsamen Hero-Header entschieden, gefolgt von einem CTA.
Ich experimentierte mit verschiedenen Designelementen wie verschiedenen Wasserzeichenhintergründen, Hauptbildern und -figuren des Schachbretts und der Platzierung von Schachfiguren in der linken und oberen Navigation.
Nachdem das Design für den Heldenbereich fertiggestellt war, fügte ich weitere Abschnitte hinzu, z. B. den Abschnitt „ Wie funktioniert es “, Testimonials, Social-Media-Links und die Fußzeile auf der Landingpage.
Um das Gameplay auf Lichess zu erleichtern , haben wir einen Anmelde-/Registrierungsablauf für Benutzer erstellt, der sie auf die Plattform weiterleitet. Um ein nahtloses Erlebnis zu gewährleisten, haben wir unterschiedliche Abläufe für neue und bestehende Benutzer entwickelt und Telefonnummern als primäre Authentifizierungsmethode verwendet.
Um die Reise eines neuen Benutzers einzuleiten, haben wir als Ausgangspunkt die Seite „Rätsel des Tages“ erstellt. Die Idee bestand darin, den Benutzern einen Anreiz zu geben, das tägliche Rätsel zu lösen und Münzen zu verdienen, mit denen sie dann zusätzliche Herausforderungen auf der Plattform spielen und spielen können.
Das Design der Bestenliste war etwas komplex, da viele Informationen und Filter auf saubere und organisierte Weise angezeigt werden mussten.
Das Design und Layout der Challenges- Seite erforderte umfangreiche Iterationen und Zusammenarbeit, da verschiedene Blöcke, Formate und Abschnitte integriert werden mussten.
Das Design der Profilseite zielte darauf ab, Benutzern einen umfassenden Überblick über ihre Aktivitäten auf der Plattform zu bieten, einschließlich ihrer Spielstatistiken, verdienten Belohnungen und aktuellen Herausforderungen. Es wurde so konzipiert, dass es einfach zu navigieren ist und klare Handlungsaufforderungen enthält, um Benutzer zu ermutigen, sich weiterhin mit der Plattform zu beschäftigen.
Iteration und Feedback:
Während des Designprozesses hatte ich regelmäßige Feedback- und Diskussionsrunden sowohl mit dem Gründer als auch mit dem Entwickler der Plattform. Diese Sitzungen waren entscheidend, um mir zu helfen, ihre Vision für das Projekt zu verstehen, und ihr Feedback ermöglichte es mir, die Designelemente zu wiederholen und zu verfeinern .
Endgültiges Design – Web und Mobil:
Schauen Sie sich den endgültigen Design- Prototyp und die Figma-Datei an .
Farbschema und Schriftarten
Ich habe ein dunkles Thema für die Web3-Schachspielplattform gewählt, weil es zu der Web3- und Schachatmosphäre passt, die wir schaffen wollten.
Und damit sich die Plattform hochwertiger anfühlt und eine goldähnliche Note erhält, habe ich mich für eine gelbe Farbe entschieden. Schließlich hilft Ihnen diese Plattform dabei, Geld zu verdienen, daher sollte es sich wie eine wertvolle Erfahrung anfühlen!
Abgesehen davon habe ich mir bei der Auswahl der Schriftart keine großen Gedanken gemacht, sondern bin einfach bei der Standardschrift geblieben, da sie gut aussah und gut lesbar war
Funktionen, mit denen Sie „Schachmatt“ setzen können
Benutzer erhalten beim Beitritt zur Plattform ein Guthaben in Höhe von 5 $ , was sie zusätzlich zum Spielen und Verdienen anregt.
Spieler können sich mit ihrem Lichess-Konto anmelden, um ihre Ranglisten, Einnahmen und Fortschritte zu synchronisieren .
Spieler können vordefinierte Formate für Schnell-/Bullet-Schach wählen oder benutzerdefinierte Herausforderungen erstellen.
Sobald das Format ausgewählt ist, können sie entweder eine offene Herausforderung erstellen (an der jeder andere Spieler teilnehmen kann) oder sie können einen bestimmten Spieler für die Herausforderung anfordern .
Spieler können die erhaltenen Anfragen sehen und diese annehmen oder ablehnen . Sie können auch die offenen Herausforderungen sehen und mit dem Spielen beginnen. Durch Klicken auf eine dieser Optionen werden sie zu Lichess weitergeleitet , wo sie das Spiel tatsächlich mit dem Gegner spielen.
Spieler können auch die von ihnen erstellten Herausforderungen sehen und sie nach Format usw. sortieren. Sie können die von ihnen erstellten Herausforderungen teilen oder löschen.
Die öffentlichen und privaten Profilseiten wiesen leichte Unterschiede auf.
Die öffentliche Profilseite bietet die Möglichkeit, den Benutzer herauszufordern und zeigt seine Statistiken und Informationen an.
Auf der privaten Profilseite hat der Benutzer die Möglichkeit, sich abzumelden und sein Profil, seine detaillierten Analysen, den gewonnenen und verlorenen Betrag usw. zu bearbeiten.
Dies waren einige der Hauptmerkmale der Plattform! Kommen wir nun zur Reaktion unserer Benutzer.
Ergebnisse und Auswirkungen: Unsere Benutzer sind Schachliebhaber!
- Die Plattform wurde vor etwa fünf Monaten gestartet und hat seitdem mehr als 1.000 zufriedene Benutzer gewonnen und mehrere Schachturniere an Hochschulen wie IIT Kharagpur, IIT Kanpur, BITS Goa und Hyderabad, Delhi University, VIT und vielen anderen durchgeführt.
- Die Plattform veranstaltet außerdem tägliche Herausforderungen und wöchentliche Turniere und verzeichnet eine große Beteiligung von Schachbegeisterten.
- Die Arbeit an diesem Projekt hat mir ehrlich gesagt sehr viel Spaß gemacht. Innerhalb eines Monats von einer Idee zum MVP zu gelangen, war eine neue und aufregende Erfahrung.
- Weitere Funktionen werden sicherlich in naher Zukunft folgen; Von einem Design-POV aus könnte ich bald daran arbeiten, ein Designsystem zu etablieren. Dazu gehört die Definition von Typografie, Farbpalette, Ikonografie, Abständen, Layout und anderen Designelementen.
Wir sind stolz auf das, was wir erreicht haben, und freuen uns darauf, dieses Projekt weiter zu verbessern und zu innovieren. Vielen Dank, dass Sie mich auf dieser Reise begleiten, und wir hoffen, Sie auf dem Schachbrett zu sehen!
Wenn Ihnen meine Arbeit gefallen hat, vereinbaren Sie einen Anruf mit mir, um dieses Projekt oder Ihre eigene Idee weiter zu besprechen! Ich bin offen für freiberufliche und Vollzeitjobs.

![Was ist überhaupt eine verknüpfte Liste? [Teil 1]](https://post.nghiatu.com/assets/images/m/max/724/1*Xokk6XOjWyIGCBujkJsCzQ.jpeg)



































