Digitales Mobile Escape Game
M-Escape ist das neue digitale Escape-Game der Migros, dem größten Detailhandelsunternehmen der Schweiz, das in Konzept, Design und Entwicklung von MUTABOR Technologies GmbH und Demodern umgesetzt wurde. Migros-Kunden werden im Mobile Web-Game selbst zu Detektiven und tauchen in ein interaktives Abenteuer mit zahlreichen Rätseln, liebevoll gestalteten Szenen und innovativen Technologien - alles eingebettet in einer spannenden Story, welche die Marke auf neue und kreative Weise erlebbar macht.
Optimiertes mobiles Escape-Game für maximale Teilnehmerzahl
Seit Jahren ist die Migros für besondere Promotionen im Retail-Marketing bekannt. Mit diesem Anspruch galt es für uns also nicht nur ein einfaches Escape-Game zu entwickeln, sondern eine interaktive Experience zu erschaffen, die sich perfekt in das digitale Ökosystem eingliedert. Daher wurde M-Escape für eine Vielzahl von mobilen Endgeräten und Browsern optimiert, um eine möglichst breite Zielgruppe anzusprechen. Durch das Angebot, sich über den Migros-Account einzuloggen, können wir vorhandenen aber auch neuen Migros-Kunden (mithilfe von OAuth) eine nahtlose Schnittstelle in die Experience bieten
Mit Agiler Teamarbeit zum Erfolg
In nur wenigen Monaten haben wir aus einer Vision ein leistungsstarkes Escape-Game entwickelt, das aus vier Kapiteln mit Unteraufgaben besteht. Dabei überzeugt das Game mit acht individuell gecodeten Rätsel-Mechanismen, zahlreichen Logik- und Suchaufgaben, beeindruckendem Concept Art, Rauminteraktionen und mitreißenden Sounddesign.
Einzigartiges Spielerlebnis
Die Story spielt in einer abgelegenen Migros-Filiale, bei der es Gerüchten zufolge spukt. In der spannenden Storyline sind Nutzer:innen aufgefordert Hinweise zu sammeln, Bilder- und Logik-Rätsel zu lösen oder Nachrichten zu dechiffrieren. Um die Verbindung zwischen Online-Spiel und physischem Handel herzustellen, ist lediglich das erste Kapitel frei spielbar.
Rätsel Range
Bei der Entwicklung der Rätsel arbeitete das Projektteam eng mit einem erfahrenen Rätsel-Entwickler zusammen. Verschiedene Rätseltypen, die Logik und Kombinationsgeschick erfordern, sorgen für ein abwechslungsreiches Spielerlebnis. Die Spielerinnen und Spieler müssen neben klassischen Escape-Game-Aktionen wie dem Sammeln von Items im Inventar auch im Raum interagieren und Web-Recherchen durchführen – alles selbstverständlich mit Bezug zur Marke Migros.
Journal und Hint-System
Ein intuitives Journal-System gibt Usern jederzeit eine Story-Einleitung sowohl eine Übersicht abgeschlossenen und aktuellen Aufgaben als auch stufenweise hilfreiche Tipps. Dies vereinfacht den Wiedereinstieg in das Game auch nach einer längeren mehrtägigen Pause.
Die Zielgruppe
M-Escape richtet sich hauptsächlich an Bewohner:innen der Schweiz im Alter von 25 bis 45 Jahren, die ein Interesse an Rätseln, Puzzles, Quizzen und Escape Rooms haben. Das Spiel ist in den drei Landessprachen Deutsch, Französisch und Italienisch verfügbar, um alle in der Schweiz zu erreichen.
Pencil, brain, blender & photoshop
Unser kreativer Prozess begann für jede Szene mit einem umfassenden Briefing, in dem wir die Story, interaktive Elemente, Aktions- und Szenerie-Assets definierten. Wir erstellten grobe Skizzen, um die verschiedenen Anforderungen zu berücksichtigen. Anschließend nutzten wir Blender, um einen 3D-Blockout zu erstellen und den optimalen Blickwinkel zu bestimmen. Herausforderung dabei - für das Navigationskonzept mussten wir die Bilder in einzelne Slices aufteilen. Dies bedeutete, dass das gesamte Artwork in den einzelnen Teilen die selbe Ästhetik aufweisen soll und eine klare Orientierung bieten.
Doch das war noch nicht alles: Spezialeffekte, Partikel & Lichteffekte verleihen den Feinschliff.
Maßgeschneidertes Front- und Backend
Wir haben als Basis ein erweiterterbares Game-Framework entwickelt, das Kapitel, Level, Asset-Loading und eine Vielzahl von Interaktionsmechaniken unterstützt. Dazu gehören die multidimensionale Navigation, Kombination von Level-Objekten, Sperr- und Entsperrmechanismen, Portalen, internationalisiertem Dialogsystem und Audio-Unterstützung. Die Animationen wurden mithilfe von Framer Motion und CSS-Übergängen umgesetzt, um ein ansprechendes und flüssiges Spielerlebnis zu bieten. Für die technische Umsetzung wurde auf bewährte Tools und Plattformen gesetzt. Der generelle Technologie-Stack umfasste NextJS (React) und Strapi (Headless CMS), wobei die Spielinhalte auf der hochmodernen Infrastruktur von Migros gehostet wurden.
Was es zu gewinnen gibt?
Nach jedem Kapitel-Abschluss hat man die aufregende Chance auf einen Sofortgewinn. Unter allen Teilnehmerinnen und Teilnehmern, die ihre Stempelkarte erfolgreich ausgefüllt haben, verlost die Migros einen Hauptpreis, der ist natürlich noch geheim.
Sounds like fun
Wie wir alle wissen, Sound ist entscheidend für das immersive Spielerlebnis und trägt maßgeblich zur Gesamterfahrung bei. Unser hauseigener Sounddesigner hat dafür über 150 Soundeffekte und 5 einzigartige Musikstücke ausgewählt, um jede Szene mit der perfekten Atmosphäre zu bereichern. Vom knarrenden Türsound bis hin zum mysteriösen Flüstern haben wir akustische Detail sorgfältig abgestimmt. Doch das ist noch nicht alles! Wir haben sogar echte Sounds aus der physischen Migros-Filiale in das Spiel integriert. Wenn du schon mal den Subito-Scanner benutzt hast, wirst du beim Spielen auf vertraute Klänge treffen. Auch der berühmte Migros-Jingle wird dir im Laufe des Spieles zu Ohren kommen.
