Chat-Mockups für Designer und Produktdemos

Jedes Portfolio, jedes Pitchdeck und jeder App-Store-Screenshot mit einer Messaging-Oberfläche hat dasselbe Problem: das Gespräch im Rahmen. Lorem ipsum in Chatblasen liest sich als Tod; „Hi! / Hallo! / Wie geht's?“ als Geisterstadt; und echte Gespräche — die verlockende Abkürzung — sind ein Datenschutzvorfall im Screenshot-Kostüm. Glaubwürdige fiktive Konversation ist ein Design-Asset wie jedes andere, und sie gut zu produzieren ist ein kleines Handwerk: Die Wörter in den Blasen leisten für die Glaubwürdigkeit des Designs mehr Arbeit als die meisten Pixel drumherum.

Warum der Blaseninhalt das Mockup macht oder bricht

Betrachter lesen den Demo-Text, bevor sie das Layout beurteilen — immer. Eine schöne Oberfläche voller „Nachricht Nachricht Nachricht“ verkündet, dass kein echter Mensch das Produkt berührt hat. Schlimmer: Stakeholder beurteilen das Produkt anhand des erfundenen Gesprächs — ein lebloser Demo-Chat lässt ein Messaging-Feature im Pitch sinnlos wirken. Umgekehrt gilt es auch: Ein warmer, spezifischer, glaubwürdiger Thread („hast du die katze gefüttert / sie hat mich angeschrien bis ich es tat / gute katze“) lässt selbst einen rohen Prototyp lebendig wirken. Demo-Inhalt ist kein Füllstoff; er ist das Szenario, in das dein Design hineingedacht wird.

Das Handwerk glaubwürdiger erfundener Gespräche

Echte Threads haben eine Textur, die erfundenen meist fehlt. Asymmetrie: Echte Menschen wechseln sich nicht höflich ab — einer schickt vier Blasen, die andere antwortet mit zwei Wörtern. Unvollkommenheit: ein Tippfehler, ein kleingeschriebener Satz, eine Nachricht, die nur „?“ sagt. Zeitliche Wahrheit: Zeitstempel, die klumpen und klaffen wie echte Gespräche, nicht gleichmäßig verteilte Minuten. Einstieg mittendrin: Ein glaubwürdiger Screenshot beginnt mitten in etwas, nicht mit „Hi“. Und Namen, die für den tatsächlichen Markt des Produkts langweilig plausibel sind. Fünf Minuten Absicht hier heben die wahrgenommene Qualität des gesamten Designs.

Demo-Daten-Hygiene

Die Regeln, die Vorfälle verhindern: nie echte Gespräche, auch nicht redigiert — Kontext leckt auf Wegen, die man nicht vollständig prüfen kann. Nie echte Namen von Kollegen oder Kunden an erfundene Worte heften; die erfundenen Worte werden zu zugeschriebenen Zitaten, sobald das Deck zirkuliert. Nie echte Telefonnummern (Produktions-Mockups haben schon erreichbare Nummern ausgeliefert; die Besitzer bekamen jahrelang Anrufe). Ein Haus-Set fiktiver Personas mit konsistenten Namen und Avataren über alle Demos pflegen — es liest sich als bewusstes Design-System-Denken, weil es das ist. Diese Regeln kosten nichts, wenn man sie von Anfang an befolgt, und sind teuer nachzurüsten, wenn ein Screenshot entkommen ist.

Die schnelle Pipeline

Für pixelgenaue Kontrolle im eigenen Produktdesign: Figma-Komponenten mit gut geschriebenem Thread-Inhalt füllen. Aber für alles Generische — den Messaging-Screenshot im Portfolio, das Telefon im Marketing-Render, die „Kundengespräch“-Folie, Videodemo-Material — ist das Komponieren in einem dedizierten Chat-Builder um eine Größenordnung schneller: Gespräch tippen, Namen, Avatare, Zeitstempel und Lesehaken setzen, sauberen hochauflösenden Frame exportieren. Einmal bauen, überall wiederverwenden — und nie wieder einen Nachmittag Auto-Layout schubsen für einen Screenshot, dessen ganzer Job es ist, wie jemandes gewöhnlicher Dienstags-Thread auszusehen.