portaldacalheta.pt
  • Legfontosabb
  • Egyéb
  • Termékemberek És Csapatok
  • A Munka Jövője
  • Pénzügyi Folyamatok
Ux Design

A tervezés gesztalt alapelveinek feltárása



Hallgassa meg a cikk audio verzióját

A negatív tér régóta a jó design alapeleme. Az első dolog, ami általában eszembe jut, a szóköz elhagyása a design elemei körül. De vannak olyan tervek, amelyek arra a szóközre használják, hogy olyan elemre következtessenek, amely valójában nincs (példának okáért azonnal eszembe jut a FedEx logóban az E és X közé rejtett nyíl).



a negatív tér a tervezés egyik kulcseleme és alapelve

A FedEx emblémában szereplő „E” és „x” mutató nyílot hoz létre a köztük lévő negatív térben.



Az emberi agy kivételesen alkalmas arra, hogy kitöltse a kép üres helyeit és olyan egészet hozzon létre, amely nagyobb, mint a részek összege. Ezért látunk olyan arcokat, mint a falevelek vagy a járda repedései.



Ez az elv az egyik legfontosabb alapgondolat a vizuális érzékelés geštalt-alapelvei mögött. Az elméletről írt legbefolyásosabb korai javaslatot Max Wertheimer tette közzé 1923-ban Az észlelés szerveződésének gesztaltörvényei , bár Wolfgang Köhler 1920-as vitája arról Fizikai alakzatok sok befolyásos ötletet is tartalmaz a témában.

Függetlenül attól aki először javasolta az ötleteket (1890-ig nyúlik vissza esszé), a geštalt-elvek fontos ötleteket jelentenek bármelyik számára tervező tanulni, és megvalósításuk nagyban javíthatja nemcsak a design esztétikáját, hanem annak funkcionalitását és felhasználóbarát jellegét is.



A legegyszerűbben fogalmazva, a gestalt-elmélet azon az elgondoláson alapszik, hogy az emberi agy megkísérli egyszerűsíteni és rendszerezni a sok elemből álló összetett képeket vagy terveket, azáltal, hogy tudat alatt szervezett rendszerbe rendezi az alkatrészeket, nem pedig egy egészet. különböző elemek sorozata. Az agyunk úgy van felépítve, hogy lássa a struktúrát és a mintákat, hogy jobban megértsük a környezetet, amelyben élünk.

A gestalt-elmélethez általában hat egyedi elv kapcsolódik: hasonlóság , folytatás , bezárás , közelség , ábra / föld , és szimmetria és rend (más néven tömörség ). Van néhány további, újabb elv, amely néha a geštalthoz kapcsolódik, mint pl közös sors .



Hasonlóság

Emberi természet, hogy hasonló dolgokat csoportosítanak. A geštaltban a hasonló elemek vizuálisan csoportosulnak, függetlenül egymástól. Szín, forma vagy méret szerint csoportosíthatók. Hasonlóság felhasználható olyan elemek összekapcsolására, amelyek esetleg nem éppen egymás mellett vannak a tervben.

hogyan kell megtanulni a c programot

példa a hasonlóság gestalt-elvére

A négyzetek itt egyforma távolságban vannak és azonos méretűek, de automatikusan szín szerint csoportosítjuk őket, pedig nincs ríme vagy oka az elhelyezésüknek.



Természetesen különbségté teheti a dolgokat, ha kiemelni szeretné őket a tömegből. Ezért a cselekvésre ösztönzés gombjai gyakran más színnel vannak megtervezve, mint az oldal többi része - így kiemelkednek és felhívják a látogató figyelmét a kívánt műveletre.

Az UX tervezésében a hasonlóság használata egyértelművé teszi látogatóinak, hogy mely elemek hasonlítanak egymásra. Például az ismétlődő tervezési elemeket (például egy ikont 3-4 soros szöveggel együtt) használó funkciók listájában a hasonlóság elve megkönnyítené azok szkennelését. Ezzel szemben a kiemelni kívánt funkciók tervezési elemeinek megváltoztatása kiemeli őket, és nagyobb jelentőséget tulajdonít nekik a látogató észlelésében.



Még olyan egyszerű dolgok is, mint annak biztosítása, hogy a hivatkozások ugyanúgy legyenek megtervezve a tervben, a hasonlóság elve abban, ahogyan látogatói érzékelik a webhely felépítését és felépítését.

Folytatás

Az a folytonosság törvénye azt állítja, hogy az emberi szem a legegyszerűbb utat fogja követni a vonalak megtekintésekor, függetlenül attól, hogy a vonalakat ténylegesen húzták-e.



példa a folytonosság gestalt elvére

A szem hajlamos követni az egyenes vonalat az ábra egyik végétől a másikig, és az ívelt vonalat fentről lefelé, még akkor is, ha a vonalak félúton színt váltanak.

Ez a folytatás értékes eszköz lehet, ha a cél egy bizonyos irányba tereli a látogató tekintetét. A legegyszerűbb utat fogják követni az oldalon, ezért győződjön meg arról, hogy a legfontosabb részek, amelyeket látniuk kell, ezen az úton járnak.

Mivel a szem természetesen követ egy vonalat, az elemek sorba helyezése egy vonalon természetesen vonzza a szemet az egyik elemről a másikra. Ilyen például a vízszintes csúszka, mint például az Amazon-hoz hasonló webhelyek listája.

Bezárás

Bezárás az egyik legmenőbb geštalt-elv, és amire már kitértem a darab elején. Az az ötlet, hogy az agyad kitöltse a terv vagy a kép hiányzó részeit, hogy létrehozzon egy egészet.

A legegyszerűbb formájában a bezárás elve lehetővé teszi, hogy a szemed valami pontozott vonalat kövessen a végéig. De a bonyolultabb alkalmazások gyakran láthatók a logókban, mint például a World Wildlife Fund. A panda körvonalának nagy darabjai hiányoznak, de az agyadnak nem okoz gondot a hiányzó szakaszok kitöltése az egész állat megtekintéséhez.

a vadon élő állatok világpénztárának logója példája a bezárás gestalt elvének

A bezárás gestalt elvét gyönyörűen szemlélteti a Világ Vadvédelmi Alapjának panda logója. Az agy befejezi a fehér formákat, annak ellenére, hogy nincsenek pontosan meghatározva.

A bezárást gyakran használják a logó tervezésében, más példákkal, például az USA Network, az NBC, a Sun Microsystems és még az Adobe példáival is.

Egy másik nagyon fontos példa a munkahelyi bezárásra UX és UI tervezés amikor egy részleges képet elhalványul a felhasználó képernyőjéről annak érdekében, hogy megmutassa nekik, hogy van még mit találni, ha balra vagy jobbra csúsztatnak. Részleges kép nélkül, vagyis ha csak teljes képeket mutatnak be, az agy nem azonnal értelmezi, hogy lehet, hogy még többet látni, és ezért a felhasználó kevésbé valószínű, hogy görget (mivel a bezárás már nyilvánvaló).

Amerikai székhelyű, teljes munkaidős, szabadúszó felhasználói felület-tervezők akartak

Közelség

Közelség arra utal, hogy az elemek mennyire állnak közel egymáshoz. A legerősebb közelségi viszonyok az átfedésben lévő alanyok között fennállnak, de csak az objektumok egyetlen területre történő csoportosítása is erős közelségi hatással járhat.

Természetesen ennek az ellenkezője is igaz. Ha helyet tesz az elemek között, akkor hozzáadhatja az elválasztást, még akkor is, ha egyéb jellemzőik megegyeznek.

Vegyük például ezt a körcsoportot:

körcsoportokkal illusztrált közelség geštalt-elve

Az egyetlen dolog, amely megkülönbözteti a bal oldali csoportot a jobb oldaltól, a vonalak közelsége. Az agyad mégis három különálló csoportként értelmezi a jobb oldali képet.


hogyan kell használni az erisbot discord-ot

példa a közelség gestalt elvére az ux károsító akcióban

NAK NEK USPS Példa PDF formátumra, ahol a közelségi gestalt elv sérti az UX-t. Mivel a mezők címkéi közelebb vannak az alattuk lévő mezőkhöz, az emberek tévesen azt hinnék, hogy az információ itt megy a „c” kifejezésre. és „d.” Ennek ellenére az információkat a szöveges címkék fölötti mezőkben kell megadni.

Az UX tervezésében a közelséget használják leggyakrabban annak érdekében, hogy a felhasználók bizonyos dolgokat csoportosítsanak, például kemény határok használata nélkül. Azáltal, hogy a hasonló dolgokat közelebb helyezi egymáshoz, és az egyes csoportok között van hely, a néző azonnal felveszi azt a szervezetet és struktúrát, amelyet érzékelni kíván.

Ábra / föld

Az ábra / föld elv hasonló a bezárási elvhez, mivel kihasználja az agy negatív tér feldolgozásának előnyeit. Valószínűleg látott már erre az elvre példákat a médiumokban a közösségi médiában, vagy a logók részeként lebegve (például a már említett FedEx logó).

Az agyad meg fogja különböztetni azokat a tárgyakat, amelyeket egy kép előterében tart (az ábra vagy a gyújtópont), és a háttérben (az ábrákon fekvő terület). A dolgok érdekessé válnak, amikor az előtér és a háttér két külön képet tartalmaz, például:

példa a figura-föld kapcsolat kialakítására és a tervezés elveire

Vannak, akik azonnal meglátják a fát és a madarakat, amikor megnézik a pittsburghi állatkert és a PPG akvárium logóját, míg mások a gorillát és az oroszlánt nézik egymást.


nagyszerű példa a figura-föld gestalt elvre

Egy másik nagyszerű példa a figura / föld geštalt elvére.

Egyszerűbb példa látható ezzel a képpel, amikor két arc gyertyatartót vagy vázát hoz létre közöttük:

az ábra-föld elv egyszerű példája, egy geštalt-tervezési elv

Ebben a híres illúzióban, amelyet Edgar Rubin dán pszichológus fejlesztett ki, a nézőt általában két alakértelmezéssel mutatják be - két arccal vagy vázával. Ez egy másik kiváló példa az ábra / föld elvre.

Általánosságban elmondható, hogy az agyad egy kép nagyobb területét fogja értelmezni talajként, a kisebbet pedig mint ábrát. Amint azonban a fenti képen látható, láthatja, hogy a világosabb és sötétebb színek befolyásolhatják azt, amit ábrának tekintenek, és mit tekintenek talajnak.

Az ábra / talaj elv nagyon hasznos lehet, amikor terméktervezők kiemelni kíván egy fókuszpontot, különösen akkor, ha aktív vagy használatban van - például amikor egy modális ablak felbukkan, és a webhely többi része a háttérbe csökken, vagy ha rákattint egy keresősávra, és megnő a kontraszt azt és az oldal többi részét.

Iratkozzon fel az ApeeScape design blogra, és kapja meg e-könyvünket

Szimmetria és rend

A szimmetria és a rend törvénye más néven ismert tömörség , a „jó alak” német szó. Ez az elv azt mondja, hogy az agyad a lehető legegyszerűbben érzékeli a kétértelmű alakokat. Például az olimpiai logó monokróm változatát átfedő körök sorozatának tekintik, nem pedig ívelt vonalak gyűjteményének.

a geštalttervezés másik alapelve, a pragnanz elvét az olimpiai logó szemlélteti

Itt van még egy jó példa a geštalttervezési elvre: tömörség ':

a pragnanz elvének összetett példája, egy másik gestalt elv

Az agyad a bal oldali képet téglalapként, körként és háromszögként értelmezi, még akkor is, ha mindegyik körvonala hiányos, mert ezek egyszerűbb formák, mint a teljes kép.

Közös sors

Míg közös sors eredetileg nem szerepelt a gestalt-elméletben, azóta hozzá lett adva. Az UX tervezésében hasznosságát nem lehet figyelmen kívül hagyni. Ez az elv kimondja, hogy az emberek olyan dolgokat fognak csoportosítani, amelyek ugyanabba az irányba mutatnak vagy haladnak.

A természetben ezt olyan dolgokban látjuk, mint a madárállomány vagy a halcsoport. Csomó egyedi elemből állnak, de mivel látszólag egyként mozognak, agyunk egy csoportba sorolja őket, és egyetlen ingernek tekinti őket.

egy madárraj szemlélteti a közös sors elvét

A madárállományt egyetlen egységnek tekintik, ha ugyanabba az irányba repülnek, és ezáltal közös sorsra jutnak. (által Martin Adams tovább Unsplash )

Ez nagyon hasznos az UX-ben, mivel az animációs effektusok egyre inkább elterjednek a modern dizájnban. Ne feledje, hogy az elemeknek valójában nem kell mozogniuk ahhoz, hogy kihasználhassák ezt az elvet, de meg kell adniuk az benyomás a mozgás.

Gesztalt alapelvek az UX tervezésben

Mint minden pszichológiai alapelv esetében, a gestalt vizuális észlelési elveinek beépítése a tervezési munkába jelentősen javíthatja a felhasználói élményt. Az emberi agy működésének megértése, majd az ember természetes hajlamainak kiaknázása zökkenőmentesebb interakciót eredményez, amely a felhasználót kényelmesen érzi a weboldalon, még akkor is, ha ez az első látogatása.

A Gestalt-elveket viszonylag könnyű beépíteni szinte bármilyen tervbe, és gyorsan megemelhetik a véletlenszerűnek tűnő vagy a felhasználói figyelméért küzdő dizájnt, amely zökkenőmentes, természetes interakciót kínál, amely a felhasználót arra a cselekvésre irányítja, amelyre vágyik.

• • •

További olvasmány az ApeeScape Design Blogon:

  • Tervezési alapelvek: Bevezetés a hierarchiába
  • A felhasználói felület kialakításának legjobb gyakorlata és gyakori hibák
  • Hogyan alkalmazzuk az erőteljes gesztalt alapelveket a tervezésben (infografikával)
  • Az információs építészet átfogó útmutatója
  • Növelje felhasználói élményét ezekkel a sikeres interakció-tervezési elvekkel

Az alapok megértése

Melyek a tervezés gestalt alapelvei?

A vizuális érzékelés gestalt elméletének klasszikus alapelvei a hasonlóság, a folytatás, a bezárás, a közelség, az alak / föld, valamint a szimmetria és a rend (más néven prägnanz). Mások, például a „közös sors”, az utóbbi években hozzáadódtak.

Miért fontos a geštalt-elmélet?

A Gestalt-elvek gyorsan megemelhetik a véletlenszerűnek tűnő vagy a felhasználó figyelméért küzdő dizájnt, amely zökkenőmentes, természetes interakciót kínál, amely ismertté teszi webhelyét, miközben a felhasználót arra a cselekvésre irányítja, amelyet szeretne.

Mi a vizuális hierarchia a tervezésben?

A tervezésben a vizuális hierarchia a különféle tervezési elemek elrendezése vagy elhelyezése, hogy nagyobb vagy kisebb jelentőséget kapjon nekik. A különféle gestalt elvek nagyban befolyásolják a vizuális hierarchiát.

Mi az érzékelés gestalt-elmélete?

Az észlelés gestalt elmélete megkísérli elmagyarázni, hogy az emberi agy hogyan értelmezi a kapcsolatokra és a hierarchiára vonatkozó információkat egy tervben vagy képben olyan vizuális jelek alapján, mint a közelség, a hasonlóság és a bezártság.

Django, Lombik és Redis oktatóanyag: Webalkalmazás-munkamenetek kezelése a Python keretrendszerek között

Webes Kezelőfelület

Django, Lombik és Redis oktatóanyag: Webalkalmazás-munkamenetek kezelése a Python keretrendszerek között
Egységtesztek, hogyan lehet tesztelhető kódot írni és miért számít

Egységtesztek, hogyan lehet tesztelhető kódot írni és miért számít

Háttér

Népszerű Bejegyzések
Commoditizált okostelefonok: A 4G eljuttatása a fejlődő országokba
Commoditizált okostelefonok: A 4G eljuttatása a fejlődő országokba
A fejlesztők számára a tíz legelső front-end tervezési szabály
A fejlesztők számára a tíz legelső front-end tervezési szabály
Pillantás a JavaScript jövőjére
Pillantás a JavaScript jövőjére
Csak CSS-hez tartozó intelligens elrendezések készítése a Flexbox segítségével
Csak CSS-hez tartozó intelligens elrendezések készítése a Flexbox segítségével
Mobile UX tervezési alapelvek
Mobile UX tervezési alapelvek
 
A létfontosságú útmutató kiváló szabadúszó fejlesztők alkalmazásához
A létfontosságú útmutató kiváló szabadúszó fejlesztők alkalmazásához
Az Analytics igazgatója
Az Analytics igazgatója
A hatékony tipográfiai hierarchia felépítése
A hatékony tipográfiai hierarchia felépítése
Vállalkozásának eladása? Ne hagyjon pénzt az asztalon
Vállalkozásának eladása? Ne hagyjon pénzt az asztalon
HSA fejlesztőknek: Heterogén számítástechnika tömegek számára
HSA fejlesztőknek: Heterogén számítástechnika tömegek számára
Népszerű Bejegyzések
  • meg kell tanulnod a c-t a c++ előtt
  • mi az ux ui designer
  • c vállalat kontra s vállalat
  • mi a különbség az ac és az s corp
  • a színek hatása az emberekre
  • hogyan kell hozzáadni api-t a wordpresshez
Kategóriák
  • Egyéb
  • Termékemberek És Csapatok
  • A Munka Jövője
  • Pénzügyi Folyamatok
  • © 2022 | Minden Jog Fenntartva

    portaldacalheta.pt