Surface Duo Design Kit (in Figma)
Das Surface Duo Design Kit ist eine Figma-Community-Ressource, um App-Designern und Entwicklern bei der Erstellung von Dual-Screen-Benutzeroberflächen zu helfen. Die Komponenten in diesem Kit sind die Bausteine, die Surface Duo wie Microsoft-Produkte unter Android fühlen.
- Geräterahmen – Gletscher und Obsidian farbige Gerätegliederungen, um Screenshots darzustellen.
- Sichere Bereiche – Sichere Bereiche verhindern, dass Inhalte die App-Kopfzeile, navigationsleiste, Registerkarten und Klammern unterlassen.
- Stiftinteraktionen – Entwerfen von Interaktionen für Stifteingaben.
- Designmuster und Richtlinien – Designmuster im Kit zeigen die Möglichkeiten von Dual-Screen-Displays für verschiedene App-Szenarien und wie alle Teile für eine aussagekräftige Produkterfahrung zusammenkommen.
- Video- und Medienrichtlinien – Tipps zum Einschließen von Videos und Bildern in einer faltbaren Benutzeroberfläche.
- Haltungen – Dual-Screen-Geräte können in einer Reihe von Hardware- und Industriedesignvariationen kommen. Das kürzlich freigegebene Surface Duo soll, zusammen mit anderen geplanten Geräten, dabei helfen, die Kategorie zu definieren, doch es mag andere Geräte geben, die über größere Anzeigen oder andere Scharnierdesigns verfügen. Beachten Sie beim Entwerfen Ihrer Apps, dass Sie vermeiden sollten, sich beim Entwurf auf die Spezifikationen bestimmter Geräte festzulegen, die heute verfügbar sind.
- Layout, Steuerelemente und Plugins – Mit einem Dual-Screen-Formularfaktor haben wir sicher gestellt, dass Sie genau so gestalten können, wie Sie vertraute Steuerelemente und Layouts verwenden. Wir hervorheben auch Details, die Sie beim Entwerfen für Dual-Screen-Apps beachten möchten, z. B. das Hinge und enthalten Layouts zum Entwerfen auf dem Go.
- Komponenten – Jede Komponente ist so flach wie möglich, damit sie einfach zu verwalten und zu arbeiten. Einige Komponenten verfügen über ausgeblendete Ebenen, die Sie aktivieren/deaktivieren können, um Variationen hinzuzufügen, ohne dass sie getrennt werden.
- Komponentensatz – Masterkomponenten für Navigations- und andere Entwurfselemente als gruppierte Sets, die eine bessere Organisation von Varianten mit verschiedenen Modellen, Modi, Bildschirmanzahlen und Ausrichtungen unterstützen.