Thomas Spinnler · Experience Designer

Warum kompliziert, wenn es einfach geht?

Ich übersetze komplexe Anforderungen in digitale Erlebnisse, vom Konzept bis zum funktionalen Prototyp.

20+ Jahre DesignpraxisHF Interaction DesignUX · Service Design · AI

Ausgewählte Arbeiten

Unterschiedliche Projekte. Ein Ziel: einfach bedienbar.

Verbunden durch dieselbe Idee: Komplexität verständlich machen und Lösungen früh erlebbar machen.

Web-App · Desktop und Mobile

BewerbungsStudio

Wie arbeitet eine KI mit, ohne je etwas zu erfinden?

Mein eigenes Tool · 2026

Direkt zum Case

Ein Link genügt.

Die Adresse des Inserats einfügen. Den Rest liest die KI selbst: Firma, Anforderungen, Kontakt.

Zuerst die Entscheidung.

Score, Einschätzung und die wichtigsten Stärken, abgeglichen mit dem Master-CV, der einzigen Quelle.

Nur echte Kompetenzen.

Der Lebenslauf passt sich der Stelle an. Was nicht belegt ist, kommt nicht hinein.

Das Schreiben kommt gleich mit.

Fünf Absätze mit klarer Aufgabe, im eigenen Ton. Jede Zeile lässt sich anpassen.

Im Look der Firma.

Farben und Schrift der Zielfirma, subtil übernommen, ohne das Corporate Design zu kopieren.

Der Kreis schliesst sich.

Ein persönlicher Link auf mein Portfolio: Die Firma wird dort begrüsst, und ich sehe, ob die Bewerbung angeschaut wurde.

BewerbungsStudio

Rolle
Konzept, UX, Regeln, Umsetzung, Test
Methoden
Selbsttest im Alltag, Messung an echten Bewerbungen, Prototyping
Technik
Next.js, OpenAI API, PDF-Export
Kontext
Mein eigenes Tool im täglichen Einsatz
  • Fakten statt Halluzinationen: Jede Aussage braucht einen belegten Ursprung
  • Ein Prüfmechanismus kontrolliert automatisch, was die KI verwenden darf
  • Vom Stelleninserat bis zum fertigen PDF bleibt alles in einem durchgängigen Workflow

Touch-Display · 65 Zoll hochkant

Alles im Grünen

Wie wird aus einem Messebesuch ein Gespräch über Jobs?

Olai Interactive für die Spitäler Schaffhausen · 2026

Direkt zum Case

Kein Plakat mit Buttons. Laub bewegt sich, Tiere laufen als Film durchs Bild.

Das Touch-Display lockt, bevor jemand davorsteht. Vier Spiele, ohne Anmeldung.

Das Glücksrad folgt dem Finger. Mehr Schwung, längeres Drehen.

Die sechs Felder sind die sechs Werte der Kampagne. Aus der 3D-Walze wurde eine Scheibe, damit alles aus ein paar Metern lesbar ist.

Wer zu fest dreht, löst einen Blättersturm aus.

Das Rad bricht aus, der Pflanzenrahmen fliegt davon. Dafür gibt es den Spezialpreis «Chaotisch zum Glück».

In der Laufbahn wählt man ein Tier und läuft los.

Aus dem gemalten Prototyp wurde eine echte 3D-Welt mit Licht, Schatten und Tieren mit Skelett.

Memory und Quiz: spielend kennenlernen.

Tierpaare finden, Fragen zu Jobs und Ausbildung beantworten. Am Schluss ein QR-Code: Der Gast macht auf dem eigenen Smartphone weiter, auf dem Display bleiben keine Personendaten.

Für alle bedienbar, auch im Sitzen.

Ein Symbol holt alle Bedienelemente nach unten, in Reichweite aus dem Rollstuhl. Robust gegen mehrere Finger, nach 90 Sekunden zurück zum Start.

Alles im Grünen

Rolle
UX & Experience Design, Konzept bis Umsetzung
Methoden
Prototyping direkt am Gerät, Varianten im Vergleich
Technik
Three.js, Blender, Payload CMS, Linux, KI-gestützt mit Claude Code
Kontext
Touch-Display (65 Zoll, offline) für die Recruiting-Messen der Spitäler Schaffhausen
  • Konzept, Spielgefühl und Gestaltung der vier Spiele und der Plattform
  • Touch-UX für die Messe und ein Sitz-Modus, damit alle mitspielen
  • Umsetzung KI-gestützt mit Claude Code, Three.js und Blender

Online-Tool · Fernwärme-Konfigurator

wärmecheck.ch

Wie wird aus einer komplexen Fernwärmeabklärung ein einfacher digitaler Prozess?

Teilprojektleitung Design/UX · EBL · 2025–2026

Direkt zum Case

Alles beginnt mit der Adresse.

Statt mit Fragen zur Heizung startet der Wärmecheck mit etwas, das alle kennen: der eigenen Adresse.

Die Antwort steht auf der Karte.

Die Adresse wird mit den Geodaten abgeglichen. Die Karte zeigt sofort, ob die Liegenschaft im Fernwärmenetz liegt.

Vom Interesse zur Modellrechnung.

Nur die nötigen Angaben, dann eine unverbindliche Modellrechnung. Die Anfrage geht strukturiert an den Vertrieb.

Auch ein Nein führt weiter.

Liegt die Adresse ausserhalb oder fehlen Daten, zeigt der Wärmecheck den passenden nächsten Schritt.

wärmecheck.ch

Rolle
Teilprojektleitung Design/UX
Methoden
User Flow, Mockups, klickbarer Prototyp
Technik
Figma, Geodaten (SEP), CRM-Anbindung
Kontext
Inhouse bei der EBL, Umsetzung mit externer Agentur
  • Nutzerführung von der Adresse bis zur Anfrage
  • UI für Desktop und Mobile, klickbarer Prototyp in Figma
  • Abstimmung mit Wärme, Marketing, IT und Agentur

Website · Energieversorger

ebl.ch

Wie findet jede Zielgruppe ihren Weg, ohne zu suchen?

Teilprojektleitung Design & UX · EBL · 2025–2026

Direkt zum Case

Zuerst das Wichtigste.

Ein kompakter Einstieg, darunter das Versprechen in vier Punkten und die Schnellzugriffe: Privatkunden, Geschäftskunden, Investoren, je mit einem Klick.

Aktuelle Themen, einfach erklärt.

Eigenverbrauch von Solarstrom: Eine Grafik zeigt das Prinzip, drei Karten führen zu ZEV, vZEV und LEG.

Für Geschäftskunden: alles auf einen Blick.

Von der Planauskunft bis zum Netzanschluss: neun Dienstleistungen als einheitliche Karten aus dem Gestaltungssystem.

Auch für Investoren: dasselbe System.

EBL Invest nutzt dieselben Module, mit eigenen Einstiegen für qualifizierte Investoren und Projektanbieter.

ebl.ch

Rolle
Teilprojektleitung Design & UX
Methoden
UX-Audit, Personas, Konkurrenzanalyse, Workshop
Technik
Figma, HubSpot CMS
Kontext
Inhouse bei der EBL, mit Marketing und Entwicklung
  • Ist-Analyse, Personas und Konkurrenzanalyse
  • Konzept, Skizzen und Gestaltung der neuen Seiten
  • Elf Module spezifiziert, bis zur Abnahme begleitet

Tablet-App · Kabinenkonfigurator

JetCreator

Wie entscheidet ein Kunde über eine Kabine, die er sich nicht vorstellen kann?

Diplomarbeit HF Interaction Design · 2019

Direkt zum Case

Vier Schritte filtern vor. Zuerst die Flugzeuggruppe.

Das Flugzeug steht immer im Vordergrund. Wer die App bedient, verliert den Bezug zur Fliegerei nie.

Dann der Typ.

Modelle wechseln mit einem Wisch, das gewählte Flugzeug lässt sich drehen.

Danach Layout und Umfang.

Der Kunde steht nie vor allem gleichzeitig, sondern immer nur vor der nächsten sinnvollen Frage.

Eine Stimmung statt hundert Einzelentscheidungen.

Presets bündeln Materialien und Farben zu einem Stil. Im Konfigurator lässt sich danach jedes Detail anpassen.

Am Ende steht der Sitz per Augmented Reality im Raum.

Dort, wo der Kunde gerade ist. Aus einer Vorstellung wird ein Bild, noch im Gespräch statt nach zwei Wochen.

JetCreator

Rolle
Recherche, Konzept, Design, Prototyp
Methoden
Umfrage, Interviews, Personas, Card Sorting, Test
Technik
Sketch, Principle (klickbarer Prototyp), Unity (AR-Prototyp)
Kontext
Diplomarbeit, Schule für Gestaltung Basel
  • Recherche mit Umfrage, Interviews und Benchmarking
  • Personas, Customer Journey und Card Sorting für die Navigation
  • Klickbarer Prototyp mit Test, Styleguide und eigenes Icon-Set

Konzept und Prototyp 2023

BCV · Digital Banking Experience

Wie finden Kundinnen und Kunden schneller die passende Information oder den richtigen Kontakt?

UX-Konzept & Prototyping · One Inside / VASS · 2023

Direkt zum Case

Der Assistent direkt auf der Hilfe-Seite.

Statt eines Formulars fragt der Chatbot im Bereich Kontakt nach dem Anliegen und führt mit Rückfragen zur passenden Antwort.

Vom Chat direkt zum Rückruf.

Der Chatbot führt mit Vorschlägen zum Thema. Braucht es eine Beratung, bestellt man den Rückruf gleich im Chat: Nummer, Name, und nach drei Minuten klingelt das Telefon.

Oder später zurückrufen lassen.

Passt es gerade nicht, wählt man Datum und Zeitfenster. Die Bestätigung erscheint sofort im Chat.

Seiten, die Orientierung geben.

Neue Ansätze für Anlageberatung und Hypothekarrechner: klare Einstiege, verständliche Vorteile und der nächste Schritt direkt auf der Seite.

BCV · Digital Banking Experience

Rolle
UX-Konzept & Prototyping
Methoden
User Flows, Interaktionskonzepte, klickbare Prototypen
Technik
Figma
Kontext
Agentur One Inside (heute VASS) für die BCV
  • Conversational-UX-Konzept für Chatbot und Rückruf
  • Neue Ansätze für Landing- und Content-Seiten
  • Klickbare Prototypen für Desktop und Mobile

Laptop · Prototyp im Browser

Villiger Produktwelten

Wie wirkt eine Traditionsmarke online so hochwertig wie ihr Produkt?

Olai Interactive für Villiger Söhne AG · seit 2026

Direkt zum Case

Ein Menü wie ein Schaufenster.

Das Mega-Menü öffnet bildschirmfüllend, jedes Sortiment zeigt beim Überfahren sein eigenes Bild. Ein Klick, und das Bild wächst direkt in die Unterseite.

«Drei Lagen. Ein Handwerk.»

Beim Scrollen fügt sich die Zigarre aus Deckblatt, Umblatt und Einlage zusammen, bis das Band sitzt.

Von der Marke ins Produkt.

Die Marken stehen als Karten nebeneinander, beim Überfahren wird der Name golden. Ein Klick führt in die Welt von Villiger 1888, mit Zeitreise und allen Formaten.

138 Jahre als Zeitreise.

Jahreszahlen, Porträts und Orte tauchen beim Scrollen auf, freigelegt wie mit dem Pinsel.

Karriere als Geschichte statt Stellenliste.

Handwerk, Familie, Welt, Du: vier bildschirmfüllende Kapitel führen zu den offenen Stellen.

Ein Klick, und die nächste Sorte kommt nach vorn.

Die Constellation-Packungen drehen sich wie ein Karussell: Peach Passion, Sweets, Piña Colada, Caipirinha.

Villiger Produktwelten

Rolle
Verantwortung UX und UI
Methoden
Dramaturgie, Scroll-Storytelling, Prototyping
Technik
Next.js, Payload CMS
Kontext
Neue Produktwelten für Villiger Söhne AG, bei Olai Interactive
  • Konzeption und Gestaltung der Produktwelten, jede mit eigener Stimmung
  • Scroll-Storytelling und Entdecker-Effekte wie Röntgenblick und Drei Lagen
  • Prototyp als Referenz für die Umsetzung, Bedienkonzept Altersprüfung

Arbeitsweise

Firmen suchen keinen Designer. Sie suchen jemanden, der ein Problem löst.

Ein Projekt beginnt selten geordnet. Anforderungen, Nutzerbedürfnisse und Technik liegen durcheinander. Mein Vorgehen macht daraus Schritt für Schritt eine Lösung, die sich früh überprüfen lässt. Wählen Sie ein Projekt: Sie sehen, welche Methoden darin stecken.

  1. 01

    Verstehen

    Was brauchen die Menschen, was das Geschäft, was ist technisch möglich?

    • 02

      Übersetzen

      Anforderungen in klare Abläufe übersetzen und sichtbar machen, bevor gestaltet wird.

      • 03

        Gestalten

        Klare Oberflächen und Komponenten, die sich wiederverwenden lassen.

        • 04

          Prüfen

          Lösungsansätze früh erlebbar machen, statt spät zu korrigieren.

          • 05

            Begleiten

            Fachbereiche, Entwicklung und Partner an einen Tisch, bis zur Umsetzung.

            Thomas Spinnler

            Thomas Spinnler

            Experience Designer

            Ich entwickle aus komplexen Anforderungen intuitive und überzeugende Nutzererlebnisse. Dabei verbinde ich langjährige Erfahrung im Kommunikationsdesign mit fundierter Praxis in UX/UI und digitaler Konzeption.

            Meine Stärke liegt darin, Probleme zu analysieren, unterschiedliche Perspektiven zu verbinden und daraus konkrete Lösungen zu entwickeln. Von der Beratung bis zum Prototyping übernehme ich Verantwortung und nutze KI gezielt für Ideenfindung und Validierung.

            © 2026 Thomas Spinnler, Liestal · Impressum · Datenschutz

            Impressum

            Verantwortlich für den Inhalt

            Thomas Spinnler
            Liestal, Schweiz
            hello@thomasspinnler.ch
            +41 76 457 72 08

            Projekte und Rechte

            Die gezeigten Kundenprojekte sind bei Olai Interactive für die jeweils genannten Kunden entstanden, die Diplomarbeit JetCreator an der Schule für Gestaltung Basel. Marken, Logos und Bildmaterial gehören den jeweiligen Inhaberinnen und Inhabern und werden hier nur zur Dokumentation der eigenen Arbeit gezeigt.

            Haftung

            Die Inhalte dieser Website werden sorgfältig erstellt, eine Gewähr für Vollständigkeit und Aktualität besteht nicht. Für Inhalte verlinkter Websites sind ausschliesslich deren Betreiber verantwortlich.

            Datenschutz

            Diese Website setzt für Besucher keine Cookies und nutzt keine Analyse- oder Trackingdienste von Dritten. Verantwortlich ist Thomas Spinnler, Liestal, hello@thomasspinnler.ch.

            Server

            Beim Aufruf speichert der Webserver technisch notwendige Angaben wie IP-Adresse, Zeitpunkt und aufgerufene Seite für den sicheren Betrieb. Zum Schutz vor Missbrauch zählt er Anfragen pro Besucher mit unkenntlich gemachter IP-Adresse; der Zähler setzt sich nach einer Stunde zurück.

            Besuchsstatistik

            Eine eigene Statistik ohne Cookies und ohne IP-Adresse erfasst Zeitpunkt, Gerätetyp, Herkunft (verweisende Website oder persönlicher Link aus einer Bewerbung), angesehene Projekte und Dauer des Besuchs. Die Angaben werden nach 90 Tagen gelöscht.

            Chat

            Angetippte Vorschläge beantwortet die Seite selbst. Selbst eingetippte Fragen werden mit dem Gesprächsverlauf an OpenAI (USA) übermittelt, dort auf Missbrauch geprüft und beantwortet; es gelten zusätzlich die Datenschutzbestimmungen von OpenAI. Die Gespräche speichere ich ohne IP-Adresse während 90 Tagen, um den Chat zu verbessern. Bitte geben Sie keine vertraulichen Angaben ein.

            Im Browser

            Ihr Browser merkt sich den Chat-Verlauf bis zum Schliessen des Tabs und ob Sie den Cookie-Hinweis geschlossen haben. Diese Angaben bleiben auf Ihrem Gerät.

            Ihre Rechte

            Sie können Auskunft, Berichtigung oder Löschung Ihrer Daten verlangen; eine E-Mail an hello@thomasspinnler.ch genügt.

            Stand: September 2026