In diesem Leitfaden wird beschrieben, wie Sie ein Zifferblatt erstellen, zeitbasierte Elemente hinzufügen und Unterstützung für vom Nutzer ausgewählte Fotos, einschließlich einer Galerie mit mehreren Fotos, einbauen. Weitere Funktionen finden Sie im erweiterten Leitfaden.
Zifferblatt erstellen
So erstellen Sie ein Zifferblatt: Zeichnen Sie einen Frame in Figma und konfigurieren Sie ihn so:
Legen Sie die Größe auf 450 Einheiten breit und 450 Einheiten hoch fest:
Abbildung 1: Figma-Bereich für das Frame-Layout mit einem 450 × 450 Pixel großen Zifferblatt Andere Größen sind auch möglich, aber 450 × 450 wird für Wear OS-Zifferblätter empfohlen und ist für den Export nach Watch Face Studio erforderlich.
Wenn Sie ein Zifferblatt mit geringem Akkuverbrauch erstellen möchten, legen Sie die Füllfarbe des Rahmens auf Schwarz fest:
Abbildung 2: Bereich „Rahmenfüllung“ mit schwarzer Füllfarbe Lege den Namen des Rahmens auf den Namen fest, den das Zifferblatt haben soll. Diese wird auf den Smartwatches Ihrer Nutzer angezeigt.
Nachdem Sie den Frame erstellt und konfiguriert haben, öffnen Sie das Plugin für den Watch Face Designer und wählen Sie den gerade erstellten Frame aus. Eine Live-Vorschau wird im Fenster des Watch Face Designers angezeigt.
Elemente zu einem Zifferblatt hinzufügen
Füge dem Zifferblatt einige Elemente hinzu, damit Nutzer die Uhrzeit sehen können.
Analoge Zeit
Zeichne ein Rechteck, das als Sekundenzeiger auf deiner Smartwatch fungiert.
Prüfe, ob das Rechteck horizontal zentriert ist und seine Unterkante in der Mitte des Zifferblatts liegt, wenn der Beginn einer neuen Minute angezeigt wird – so wie bei einem echten Uhrzeiger. Standardmäßig ist in Figma die Option An Geometrie ausrichten aktiviert. Dadurch werden rote Hilfslinien angezeigt, die Ihnen beim Ausrichten des Rechtecks helfen:
Als Nächstes müssen Sie Watch Face Designer mitteilen, dass diese Ebene nicht nur zur Dekoration dient. Wählen Sie das Rechteck aus, das Sie im vorherigen Schritt gezeichnet haben, gehen Sie dann zum Fenster Watch Face Designer und ändern Sie Verhalten von „Statisch“ zu „Sekundenzeiger“.
Beachten Sie, wie sich der Zeiger einmal pro Sekunde bewegt, um ein Ticken der Uhr zu simulieren. Sie können die Rotation anpassen und einen Minuten- und Stundenzeiger ähnlich wie diesen erstellen.
Hinweise zu Hilfszifferblättern finden Sie in der Anleitung zur erweiterten Nutzung.
Digitaluhr
Wir können die Zeit auch in einem digitalen Format anzeigen. Dazu erstellen Sie in Figma eine Textebene. Geben Sie vorerst Hh:Mm:Ss als Textinhalt der Ebene ein.
Ändern Sie im Fenster Watch Face Designer das Verhalten des Texts von „Statisch“ zu „Digitale Uhrzeit“. In der Vorschau sehen Sie, wie das auf einem echten Gerät aussehen würde:
Informationen zu den verfügbaren Zeichen finden Sie in der Vorlagenanleitung, die in der Seitenleiste des Watch Face Designer-Fensters angezeigt wird. a gibt beispielsweise an, ob die aktuelle Zeit „AM“ oder „PM“ ist. Sie können diese Variable zusammen mit dem „Stundenformat“ verwenden, um die 12-Stunden-Zeit anzuzeigen.
Sie können in Figma eine beliebige Schriftart auswählen, auch solche, die in Wear OS nicht verfügbar sind. Sie wird automatisch exportiert und in Ihr Zifferblatt eingebunden. Beachten Sie, dass für jede Schriftart eigene Lizenzbedingungen für die Weitergabe gelten.
Vorschau für verschiedene Zeiträume ansehen
Wenn Sie sich Ihr Zifferblatt zu verschiedenen Tageszeiten ansehen möchten, können Sie die Uhrzeit der Vorschau anpassen, indem Sie den Schieberegler unten im Fenster Watch Face Designer ziehen:
Wenn Sie sich die Vorschau für verschiedene Zeiten angesehen haben, können Sie die Zeit auf die aktuelle Zeit zurücksetzen, indem Sie links unten auf die Schaltfläche Zurücksetzen klicken:
Von Nutzern bereitgestellte Fotos einbeziehen
Ihr Zifferblatt kann einen Platzhalter für ein benutzerdefiniertes Foto enthalten. So können Nutzer ein persönliches Foto als Hintergrund hinzufügen, während die Uhrzeit und alle anderen Elemente, die Sie in Ihr Design aufgenommen haben, weiterhin angezeigt werden.
Wenn Sie benutzerdefinierte Fotos unterstützen möchten, fügen Sie Ihrem Zifferblatt eine Ebene hinzu und legen Sie deren Behavior auf „User-provided photo“ (Vom Nutzer bereitgestelltes Foto) fest. In diesem Beispiel verwenden wir als Standardbild ein Beispielfoto einer Blume für diese Ebene. Dieses Bild wird als Fallback verwendet, bevor der Nutzer ein eigenes Foto zugewiesen hat oder wenn er keines seiner Fotos verwenden möchte.
Unterstützung der Mehrfachauswahl von Fotos
Ihr Zifferblatt kann die Mehrfachauswahl von Fotos unterstützen. In Watch Face Studio wird dies als Galerie bezeichnet:
Wenn Fotoauswahl auf „Galerie“ eingestellt ist, kann der Nutzer für diesen Slot mehrere Fotos auswählen. Die Smartwatch durchläuft sie dann zu verschiedenen Zeitpunkten, je nachdem, was Sie unter „Foto ändern“ auswählen:
- Wenn „Bei Tippen“ ausgewählt ist, ändert sich das Foto, wenn der Nutzer auf Ihren Layer tippt.
- Wenn „Beim Heben des Handgelenks“ ausgewählt ist, ändert sich das Zifferblatt jedes dritte Mal, wenn der Nutzer sein Handgelenk hebt. Derzeit kann dies nicht über den Watch Face Designer angepasst werden. Weitere Informationen
changeAfterEvery
Weitere Informationen
Informationen zum Anzeigen einer Vorschau Ihres Zifferblatts auf einem physischen Gerät finden Sie im Leitfaden zum Exportieren.
Weitere Optionen und Funktionen finden Sie im Leitfaden zur erweiterten Nutzung.