Unlimited Wordpress themes, plugins, graphics & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Web Design
  2. UX

UX in 60 Sekunden: Verwenden von Komponentenbibliotheken

by
Difficulty:BeginnerLength:ShortLanguages:

German (Deutsch) translation by Nikol Angelowa (you can also view the original English article)

Willkommen zu dieser superschnellen Einführung in die Verwendung von Komponentenbibliotheken. hilfreich für Designer, Entwickler und Benutzer gleichermaßen. Lass uns reinspringen!

Komponentenbibliotheken in 60 Sekunden

Jede Interaktion, auf die ein Benutzer stößt, muss er lernen, was zu einer kognitiven Belastung führt. Für einen Benutzer ist es besonders herausfordernd, wenn Elemente der Benutzeroberfläche fast gleich, aber unterschiedlich sind. Der Benutzer muss dann Fragen wie "Warum sind diese unterschiedlich?", "Wird dasselbe passieren, wenn ich diese beiden Tasten drücke?" Analysieren.

Identifizieren Sie zunächst allgemeine Objekte in Ihren Entwürfen, definieren Sie sie als Komponenten, und ziehen Sie sie später (beim Entwerfen von Bildschirmen) wieder ein. Auf diese Weise zwingen Sie sich, konsequenter zu sein. Sie werden vielleicht sogar überrascht sein, wie viele Kilometer Sie mit denselben Objekten zurücklegen können, um verschiedene Probleme zu lösen.

Skizze verwenden

In der Praxis können Sie Symbole in Ihrem Sketch-Projekt erstellen oder das Plugin Craft by InVision verwenden. Um wirklich Wert aus Ihrer Komponentenbibliothek zu ziehen, arbeiten Sie mit Ihren Entwicklern zusammen, um die gleichen Dinge auch im Code zu definieren.

Es muss auch nicht rein visuell sein. Sie sollten die verschiedenen Zustände jedes Objekts und sogar komplexe Interaktionen definieren.

Bei Verwendung einer Komponentenbibliothek können Designer und Entwickler immer wieder dieselben Objekte verwenden, um verschiedene Probleme zu lösen. Und für Benutzer werden sie auf vertraute Komponenten stoßen, die weniger Zeit damit verbringen müssen, herauszufinden, wie sie Ihre App oder Website verwenden.

Empfohlene UI-Kits

Sie werden einige UI-Kits in diesem Video bemerkt haben. Hol sie dir jetzt als Teil deines Envato Elements-Abonnements!

Einfach

Über 100 bearbeitbare und anpassbare Photoshop-Elemente, basierend auf sauberen Vektorformen. Ebenen sind gruppiert und gut organisiert, Elemente können leicht in der Größe geändert und angepasst sowie Farben bearbeitet werden.

Simple Flat UI Kit

Zoomie

Social Media Mobile App für Sketch; Alle Screen Art Boards sind gut organisiert und geschichtet.

Zoomie

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.