Mi az a felhasználói felület mintája?

Vessen egy pillantást a felhasználói felület tervezésének egy új aspektusára

Inkább ugyanaz

Ha még soha nem hallottál a felhasználói felület mintájáról, íme egy gyors magyarázat: Mint a legtöbb dolog esetében, különösen a szoftverfejlesztés során, gyakran sok elemcsoport is csoportosítható, mivel ezek felismerhető mintát alkotnak. A szoftverekre példa lehet az építészeti minták vagy egy adott programozási nyelvhez kapcsolódó minták meghatározása.

Mégis vannak általános minták a felhasználói felület tervezésénél. Ha gyorsan megnézi néhány alkalmazást azon az eszközön, amelyen olvassa ezt a cikket, bizonyos dolgok végül megismétlődnek:

  • modális nézetek mentési, törlési és / vagy törlési művelettel
  • Szöveget tartalmazó elemek szakaszai, például egy lista csúsztatási művelettel az egyes listaelemekhez

Tehát egy lépéssel tovább gondolva, van-e olyan erőforrás, amelyet felhasználhat, ha saját kezűleg készít egy felhasználói felületet? Esetleg más tervezők által már felismert és formalizált mintagyűjtemény? Nos, nem tenném fel ezt a kérdést, ha már nem lenne meg a válasz! Ideje a második fejezetnek!

Második fejezet (a bejelentett)

Formális definíciót keresve az IBM Carbon Design csapatának remek a következõ: A minták a legjobb gyakorlati megoldások arra, hogy a felhasználó hogyan ér el egy célt. Olyan összetevők és sablonok újrafelhasználható kombinációit mutatják be, amelyek szekvenciákkal és folyamatokkal kezelik a közös felhasználói célokat.

Nézzünk meg néhány példát. A következő bejegyzések az IBM Carbon Design webhelyéről, valamint a Google Material UI minta oldaláról származnak. Nem találtam egy webhelyet a Microsoft Fluent Design számára, de ennek ellenére a kezdőlapjukat linkeltem a függelékbe.

Keresés

A tartalom keresése a legtöbb alkalmazás alapvető eleme, ezért tökéletes választás a felhasználói felület mintázatának meghatározásához. A végső felhasználástól (globális kereséstől vagy a tartalmi oldalon történő konkrét kereséstől) függetlenül a keresési felhasználói felület kínál

  • szövegbevitel
  • szöveges helyőrző, ha még nincs elérhető bemenet
  • egy ikon, amely egyértelműen jelzi a szövegbevitel célját, például nagyító használatával, valamint az új keresés kiváltójeként működik

Bizonyos esetekben egy tippcímke segíthet megkülönböztetni a különböző tartalomtípusokat, vagy segítséget nyújthat az érvénytelen bevitelhez. Minél több feltételt kell kezelnie egy keresésnek, annál jobban képes a keresés alkalmazkodni ehhez a követelményhez kifejezett szűrőmenük hozzáadásával.

Párbeszéd

Az egyik legszembetűnőbb felhasználói felület mintázat. A párbeszédablakok lehetővé teszik, hogy egy alkalmazás egy információt mutasson anélkül, hogy elveszítené a webhely általános kontextusát. Ez úgy valósul meg, hogy nem az egész ablakot takarja be, hanem csak egy kisebb részét. A párbeszédpanelek megszakítják a felhasználó aktuális munkafolyamatát, ezért csak akkor szükségesnek tekinteni őket, ha a munkafolyamat egy leállása valóban érvényes. Csak kis feladatokat kell kezelniük, és egyértelműen arra kell koncentrálniuk, hogy mit kell teljesíteniük. Például állítsa vissza a nem mentett módosításokat, vagy hajtson végre egy fontos műveletet.

Üres állapotok

Annak ellenére, hogy elsőre furcsán hangozhat, az üres állapotok nagyon gyakoriak az alkalmazásokban. Fontos közölni a felhasználóval, hogy nem áll rendelkezésre adat, és ideális esetben magyarázza el, miért van ez így. A kontextustól függően az üres állapot feloldásának tippje sokat segíthet egy jó UX létrehozásában. Például egy felhasználó keresett valamit, de nem talált semmit. Ez olyan felhasználási eset lehet, amikor egy másik keresési lekérdezés javaslata segíthet a felhasználónak a feladat végrehajtásában. Minden esetben minden nézetnek, amely üres állapotot képvisel, kontextusnak kell lennie. Negatív példa valami ilyesmi lehet: „Ez nem sikerült. Próbáld újra később".

Ne kezelje az üres állapotokat utólagos gondolatként a felhasználói felület tervezési folyamatában. Helyes megvalósításuk esetén a felhasználók zökkenőmentesen folytathatják a munkafolyamatot. Az üres állapotok, amelyek leállítják az egész munkafolyamatot, valójában a legrosszabb eset, kivéve az alkalmazás összeomlását.

Csak egy kezdet

Ez egy gyors pillantás volt néhány felhasználói felület mintára, amelyet az IBM Carbon Design-jából, valamint a Material UI mintázati oldaláról választottam. A felhasználói felület mintázatainak alkalmazása az alkalmazásán is nagyban hozzájárulhat a felhasználó munkafolyamatának és a felhasználói felület közötti súrlódás csökkentéséhez a feladat végrehajtása érdekében. A felhasználói felület megtervezése meglehetősen nagy kihívást jelenthet, ezért az óriások vállára állva a meglévő UX-tanulmányokból tanulva sokat segít javítani a felhasználók megítélését az alkalmazás viselkedésében.