A.01
Farbe trägt Bedeutung
Rot steht für Glück und Energie. Gold vermittelt das Hochwertige. Weiß allein eingesetzt trägt eine Bedeutung der Trauer, deshalb verbinden wir es mit kräftigen Akzenten.
UX / UI · 设计
Gestalten für
die Art, wie chinesische Nutzer
tatsächlich surfen.
WordPress-Erlebnisse, die sich für Nutzer in China nativ anfühlen. Kulturell verankert, Mobile-first, geformt um die Plattformen, die Chinas Internet tragen.
home-mobile.fig
375 × 812
Mobile-first
WeChat + ICP
70%+
Mobiler Traffic in China
6
Geprüfte Browser
WeChat
Native Integration
ICP
Konform durch Konzept
Das Problem
Warum westliches Design
in China verpufft.
Ein Unternehmen bringt seine WordPress-Seite zu Hause zum Konvertieren, startet sie in China, und die Absprungrate schnellt hoch. Technisch sieht die Seite in Ordnung aus, doch etwas daran fühlt sich falsch an für jeden, der aus Shanghai oder Chengdu surft.
Chinesische Internetnutzer sind nicht mit demselben Web aufgewachsen. Wie sie navigieren, wie viele Informationen sie auf einmal sehen wollen, all das ist von WeChat, Taobao und Douyin geprägt.
Eine Designsprache, die in Chicago konvertiert, funktioniert in Chongqing nicht von selbst.
Westlicher Stil
Schlicht, geringes Engagement
China-nativer Stil
Dicht, konvertiert
Wissen aus der Praxis
Sechs Dinge, die uns das Gestalten
für China gelehrt hat.
A.01 bis A.06 / UX-Heuristiken für China
A.02
Dichte liest sich als Vertrauen
Dichte Layouts oberhalb der Falz wirken auf chinesische Nutzer fundiert. Stark mit Weißraum gestaltete Entwürfe können leer, unfertig oder ausweichend wirken.
A.03
ICP 沪B2-2024
0123456号
0123456号
营业
执照
执照
Vertrauen sitzt an den Rändern
ICP-Anmeldenummer, Gewerbelizenz, offizielle Siegel. Die Platzierung im Fußbereich ist üblich. QR-Codes oberhalb der Falz verankern die Glaubwürdigkeit.
A.04
微信
WeChat ist Infrastruktur
QR-Codes, Mini-Program-Links, Teilen-Endpunkte, Kundendienst-Kontakte. Das ist Grundinfrastruktur, keine optionale Funktion.
A.05
中 Aa
Schrift trägt Gewicht
PingFang SC, Noto Sans SC oder Source Han paaren sich mit Inter oder Systemschriften. Zeichenabstand und Zeilenhöhe weichen von der Latinschrift ab.
A.06
Die untere Leiste ist der Home-Button
Eine festsitzende untere Navigation ist der Home-Button des chinesischen mobilen Webs. Fünf Tippziele, stets sichtbar, stets mit dem Daumen erreichbar.
Unsere Leistung
Vier Disziplinen.
Ein Ergebnis.
/ Forschung
Nutzerforschung und Erkenntnisse
Wir kartieren, wie sich Ihr Publikum in China tatsächlich durch Inhalte bewegt, vergleichen lokale und internationale Wettbewerber und gestalten Wege, die dort beginnen, wo chinesische Nutzer beginnen: Douyin, WeChat oder Baidu.
/ Architektur
Informationsarchitektur
Das chinesische Publikum bevorzugt dichtere Seiten. Mehr sichtbare Links, mehr Text, mehr Optionen gleich zu Beginn. Wir strukturieren Inhalte in der Tiefe, die Besucher erwarten, ohne sie für das Headquarter unlesbar zu machen.
/ UI
Visuelles Design
Mobile-first-Layouts für die Geräte, die Menschen in China wirklich nutzen. Symbolträchtige Farbe, eine Typografie, die chinesische Schriftzeichen achtet, und die Vertrauenssignale (WeChat-QR, ICP, Gewerbelizenz), die chinesische Verbraucher prüfen, bevor sie handeln.
/ System
Gutenberg-natives Designsystem
Wir gestalten direkt in Gutenberg. Maßgeschneiderte Blöcke, die Ihr Redaktionsteam ohne Entwickler nutzt, Komponenten für visuelle Stimmigkeit, Vorlagen, die nicht-technische Mitarbeiter selbst aktualisieren können.
Im Inneren des Systems
Dokumentierte Tokens
bis ins kleinste Detail.
Jedes Design, das wir liefern, ist als System dokumentiert. Farb-, Typografie- und Abstands-Tokens wandern von Figma nach Gutenberg, unverändert.
/ Farbe
5 / Tokens- Glücksverheißendes Rot #E11D2EGlück, Energie, Tatkraft
- Markenorange #F25F29Vitalität, Akzent
- Vertrauensgrün #52C41ABestätigung, WeChat
- Tinte #1F1F1FÜberschriften, Ankerpunkt
- Wolke #FAFAFAFläche, nie allein
/ Typografie
PingFang · Inter- H132px中文标题 Display-Überschrift
- H224px副标题 Abschnitts-Unterzeile
- Body16px正文段落 Fließtext-Absatz
- Caption12px辅助说明 Bildunterschrift / Meta
/ Abstand
Skala auf Basis 4- 4 · XS
- 8 · S
- 16 · M
- 24 · L
- 32 · XL
- 48 · 2XL
Jeder Abstand auf einer Basis von 4 px.
Vertikaler Rhythmus auf 8 px festgelegt.
Vertikaler Rhythmus auf 8 px festgelegt.
Designsystem · Übergabe
In Figma gebaut.
Übergeben, bereit zum Ausliefern.
- Komponentenbibliothek, abgestimmt auf chinesische Typografie
- Token-System: Farbe, Abstand, Typografie-Skala
- Mobile- und Desktop-Wireframes für jede wichtige Seite
- Interaktionsspezifikationen, nach denen Ihr Entwicklerteam bauen kann
Wie wir arbeiten
Ein verlässlicher Weg
vom Briefing zur Übergabe.
P.01 bis P.06 / Ablauf des Mandats
P.01
Erstgespräch und Briefing
Abstimmung auf Markenrichtlinien, Ziele und darauf, wen Sie in China erreichen wollen.
P.02
Recherche und Benchmarking
Wettbewerbsumfeld, lokale Nutzungsmuster, Designprinzipien. Die Phase der Hausaufgaben.
P.03
Wireframing
Seitenstruktur und Nutzerwege, abgeglichen mit dem, wie chinesische Nutzer erwarten, dass Seiten funktionieren. Ein Wireframe nachzuarbeiten ist günstiger als ein fertiges Mockup.
P.04
Visuelles Design und Iteration
Mockups in hoher Detailtiefe und Feedback-Runden, bis es für Ihre globale Marke und den chinesischen Markt funktioniert.
P.05
Designsystem und Übergabe
Komponenten, Stilrichtlinien und Interaktionsspezifikationen so verpackt, dass Ihr Entwicklerteam ohne Rätselraten bauen kann.
P.06
QA und Validierung
Wir testen auf chinesischen Browsern und Geräten. Eine Seite, die in London großartig aussieht, kann auf UC Browser oder QQ Browser auseinanderfallen, beide weiterhin groß in China.
Who Is This For?
An wen sich diese Seite richtet
Von null beginnen
Sie bauen eine WordPress-Seite für China und wollen das Design von Anfang an richtig machen.
Schwache Leistung
Sie haben bereits eine Seite in China live, doch sie liefert nicht, und Sie vermuten das Design als Ursache.
Kampagnenseiten
Ihr Marketingteam braucht Seiten für chinesische Verbraucher, die sich nicht aus dem Englischen übersetzt anfühlen.
Globales Design anpassen
Sie haben ein solides globales Designsystem und brauchen jemanden, der versteht, wie man es für China anpasst.
Sprechen wir
Design für China misst sich daran,
ob Menschen nutzen, was Sie gebaut haben.
Das Aussehen kommt danach. Wenn das nach einem Gespräch klingt, das sich lohnt, sollten wir reden.