Als wir in eLama viele Komponenten in der Bibliothek hatten, stellten wir fest, dass Hover kein System haben: Füllfarbe, Rahmenfarbe, Textfarbe ändern sich, ein Schatten erscheint usw.
Wir haben es nicht aus Bosheit gemacht, es hat in einigen Projekten besser funktioniert, aber als wir die Benutzeroberfläche als Ganzes betrachteten, wurde klar, dass dies ein Problem war.
Nicht alles ist so, wie es scheint
Bei der Entwicklung von Schnittstellen verlassen wir uns auf das Prinzip, dass das, was Sie tun, so funktionieren sollte, wie es der Benutzer erwartet. Wenn der Benutzer eine Schaltfläche vor sich sieht, erwartet er von ihr das Verhalten der Schaltfläche, was bedeutet, dass sie sich wie erwartet verhalten sollte.
Zum Beispiel haben wir in unserer Bibliothek einen Link und eine Schaltfläche, die optisch einem Link ähnelt. Aufgrund der Tatsache, dass es keinen großen Unterschied in ihrem Verhalten beim Schweben gab, könnte sich die Frage stellen, was beim Klicken passieren wird - wird es zu einer anderen Seite springen oder die Aktion wird auf der aktuellen Seite ausgeführt. Anfangs gab es sogar Fälle, in denen Entwickler eine Schaltfläche als Link verwendeten, was darauf zurückzuführen war, dass sie beim Schweben wie ein Link aussieht und sich so verhält.
Was für Schwebeflüge gibt es?
1. ( )
2. ( )
3.
4.
5. (, ..)
6. ( , ..)
, , , , , -.
Button, SelectList, Table, Chip, Lable, Switch, Pagination,
:
— 3 .
, . .
(: tooltip ) , (, toast)
Rating
:
, . -, , . , , .
RadioLine, CheckLine Tab
:
RadioLine, CheckLine — .
: RadioLine — , .
Checkbox
:
: — — — .
Input, MultiInput, TextArea, Select, Radiobutton
:
- — . , , , .
InputFile
— . , , .
Link Button
, .
, .
, . , . , , . , .
Es kann jedoch teilweise Animationen geben, wie wir es beispielsweise für die Paginierung getan haben. Wenn Sie mit der Maus über eine Seitenzahl fahren, wird der Hintergrund gleichmäßig angezeigt. Wenn der Cursor ihn verlässt, verschwindet der Hintergrund sofort. Dies wurde getan, um die Situation zu vermeiden, in der Sie den Cursor schnell über die Zahlen bewegen und mehrere Substrate gleichzeitig sichtbar sind, da neue Substrate angezeigt werden, wenn die vorherigen noch nicht verschwunden sind.