Kleng UX-UI Lexikon (Deel 4)

All Dag, op Aufgab, muss ech mat verschiddenen Akteuren an engem Projet interagéieren. Ofhängeg vun der Positioun an dem Appetit fir d'Disziplin vum UX-UI Design, huet jiddereen en anert Wëssen iwwer déi benotzte Begrëffer.

Am Laf vun de Missiounen hunn ech eng grouss Unzuel u Konzepter zesummegestallt an et ass e Vokabulär deen ech gär hätt wéi ech ugefaang hunn an deen ech dofir no an no konsolidéiert hunn fir zukünfteg Studenten ze hëllefen oder Neier op Digital.

Ech hunn dofir eng Serie vun Artikelen fir Iech virbereet, wou all Konzept erklärt gëtt, fir datt Dir dorop bezéie kënnt. Dofir schléisse mir dës Serie mat de leschten 20 Konzepter of. Wann Dir jeemools béid Deeler wëllt konsultéieren - Upstream, hei sinn d'Links: Deel 1, Deel 2 et Deel 3.

#1 _ Layouten

Karussell
De Karussell erlaabt Iech Inhalter wéi Biller, Kaarten, etc. Mir fanne se dacks op der Homepage vun enger Websäit fir d'Noriichten ze presentéieren.

Akkordeonen
Akkordeonen erlaben d'Benotzer Sektiounen vum Inhalt auszebauen an zesummenzebréngen. Si si ganz nëtzlech fir Inhalt z'organiséieren an de Benotzer eng kloer definéiert Hierarchie ze weisen.

Pagination
Oft um Enn vun enger Säit organiséiert d'Paginatioun Inhalt op Säiten. Mir fannen also d'Zuel vun all Säit. Heiansdo sinn e puer verstoppt, jee no der Zuel. Gutt Praxis ass ëmmer déi éischt an déi lescht ze halen. Eng aner gutt Praxis, fir d'Benotzung ze vereinfachen, ass d'"virdrun" an "nächst" Knäppercher ze weisen.

Kuurzmeldung
En Element ass en Element vun enger Lëscht. Dëst ass e wichtegt Element well et ass dacks dat wat mir e puer Mol widderhuelen andeems d'Daten ugewise ginn.

Lëscht
Et besteet aus enger Rei vun Elementer déi sech an alphabetesch, numeresch oder souguer zoufälleg Uerdnung verfollegen.

Verschidde Komponente kënnen do nestéiert ginn wéi Text, Biller, Status, Knäppchen, asw.

Gitter Lëscht
Gitterlëschte weisen eng Sammlung vu Biller an engem organiséierte Gitter. Am Géigesaz zu der Lëscht sinn d'Elementer vertikal an horizontal arrangéiert, an net méi an enger eenzeger vertikaler Kolonn wéi d'Lëscht.

Kaart
D'Kaart ass e Bestanddeel deen Iech erlaabt Iech an der selwechter Grupp zesummen ze gruppéieren.

Zum Beispill en Titel, Inhalt an e Bild fir e Medienartikel ze materialiséieren. Oder e Bild, en Titel an e Kaf Knäppchen op engem E-Commerce Site.

#2 _ Formen

Form
Formulairen erlaben Iech Informatioune vum Benotzer ofgeschloss ze recuperéieren. Hie wäert Elementer an de System aginn, komplett oder addéieren a se dann ofginn.

Feld (Input op Englesch)
D'Feld erlaabt de Benotzer Informatiounen anzeginn. Dës Informatioun kéint a verschiddene Formen sinn, sou wéi et an de folgende Konzepter beschriwwe ka ginn.

Text Felder
Textfelder erlaben de Benotzer Text anzeginn an z'änneren. Dëst kann eng eenzeg Linn oder méi Zeilen sinn.

Fluch
De Schieber erlaabt d'Benotzer duerch eng Serie vu Wäerter ze bewegen. Et gëtt haaptsächlech duerch eng interaktiv Bar materialiséiert. Zum Beispill, fir de Volume unzepassen oder an engem Audio / Video Streck ze réckelen.

Dropdown Lëscht (Dropdown oder "Auswielen" op Englesch)
D'Drop-down Lëscht erlaabt Iech tëscht zwou an eng onlimitéiert Zuel vun Optiounen ze wielen.

Checkbox
D'Checkbox erlaabt d'Benotzer eng oder méi Optiounen aus enger Lëscht ze wielen. Et ass e Komponent deen de Benotzer erlaabt Choixen aus enger Lëscht vu Propositiounen unzeginn. Grafesch gëtt eng ugecheckte Këscht allgemeng anescht materialiséiert (dank enger Ikon oder enger Faarf), während eng onkontrolléiert Këscht eidel gelooss gëtt. Eng Këscht kann och gro ginn wann de Choix net méiglech ass.

Radio Knäppchen
De Radio Knäppchen erlaabt de Benotzer eng eenzeg Optioun aus engem Set ze wielen. Grafesch gëtt e Funkknäppchen duerch e Krees duergestallt. Wéi mat der Kontrollkëscht gëtt d'Auswiel vum Benotzer anescht materialiséiert (mat enger Ikon oder enger Faarf).

Toggle / schalt
Den Toggle gëtt fir binär Optiounen benotzt. Si erlaben Iech den Zoustand vun engem eenzegen Element z'aktivéieren oder deaktivéieren.

Et ass wéi e Schalter, den Toggle kann nëmmen zwou Positiounen huelen (zB: On/Off Knäppchen).

vereedegt
E Plazhalter ass en Attribut dat benotzt gëtt fir Text als Standard a bestëmmte Formfelder ze weisen. Et gëtt de Benotzer Hiweiser fir e Feld auszefëllen. Zum Beispill, fir dat erwaart Format vun engem Datum, eng Adress oder eng Telefonsnummer ze ginn.

#3 _ Aktiounen

Knäppchen
E Knäppchen erlaabt d'Benotzer Aktiounen a Choixen mat engem eenzegen Tipp oder Klick ze maachen.

De Knäppchen ass ee vun de wichtegste Bestanddeeler vun enger Interface, well et de Benotzer op Schlësselweeër leet: e Produit ze kafen, en Abonnement auszeschléissen oder sech zB umellen.

Link
E Link ass e Wee fir vun enger Säit op déi aner ze réckelen. Andeems Dir op e Link klickt, kritt de Benotzer direkt op déi gesichte Informatioun.

Op der Design Säit ass et wichteg se kloer z'identifizéieren. Oft gi se vertruede mat Ënnerstëtzung a Faarf.

FAB (Floating Action Button)
De schwiewenden Handlungsknäppchen ass e Knäppchen deen e bëssen anescht ass wéi d'Knäppercher déi mir gewinnt sinn op Plattformen ze gesinn. Seng Besonneschheet ass datt et an der Interface schwëmmt, iwwer Inhalt. Floating Action Buttons si meeschtens um ënnen riets vum Écran vun Äre Liiblingsapplikatiounen plazéiert. Si ginn an Interfaces benotzt fir Haaptaktiounen fir Benotzer ze gruppéieren.

Sichbar
D'Sichbar ass e bësse speziellen Inputfeld well et Iech erlaabt Elementer ze sichen oder ze filteren. D'Sich kann Cross-Site oder op enger spezifescher Funktionalitéit sinn.

Konklusioun

Mir maachen dofir eis Serie vun der klenger UX-UI Glossar mat dëse Begrëffer zou. Et gëtt keen Zweiwel datt mir eng nei Serie relancéieren fir Iech iwwer nei Konzepter ze guidéieren (wahrscheinlech net existent bis haut!). Merci datt Dir eis verfollegt an zéckt net eis ze kontaktéieren wann e Konzept Iech nach ëmmer Problemer mécht!

Fir déi éischt dräi Deeler ze gesinn, hei sinn d'Links: Deel 1, Deel 2 et Deel 3.

Wann Dir jeemools Äert Wëssen verdéiwe wëllt an d'Praxis fir e Webinterface ze designen, bitt den UX-Republic Trainingszentrum "UI Design, d'Grondlagen" Training. Hei ass de Link fir méi gewuer ze ginn.

Alexa CUELLAR, UX Designer @UX-Republic

Bildquell: https://undraw.co/