( Aadaam | 2013. 05. 26., v – 19:03 )

Szia,

Kérdésedre válaszolva (form): igen, ez a logika. Mutatok egy formot, szintén én terveztem, de ott a többiek válasza és kommentjei is. Egyszerűen gyorsabb előkaparni ezt mint megtalálni a 10 éves jegyzeteim közt a Visual Basic-es egyetemi példát :) Ha megnézed, ez is grid, de az Access tervezőjében is van, és a Win7 design doksiban is hivatkoznak rá.

Szóval a logika mindenhol használatos. Desktopon mondjuk nem csodaszer, mert nagyon sok minden szerepet játszik, de ott is jellemző, hogy az számít letisztultabbnak, ami ilyen, szerintem. Eredetileg könyvekre volt - az oldalméret is véges...

Láttad, hogy a gmail is így néz ki mobilon, a Win8 totál (nekik már nem teljesen a klasszikus grid-logika van, de ez is grid-logika, csak kevésbé programmatikus)

A grid rendszer pedig mindig egy egyszerűsítés. Alapvetően a történet arról szól, hogy az emberi szem (jórészt függőleges) igazító vonalakat keres, így van beállítva, fák az erdőben, slussz. Azok a dolgok amik egy falhoz vannak állítva, számára összetartoznak.

Az arányokkal is úgy vagyunk, hogy szeretjük, ha valami görbére illeszkednek. A twitteré a híres, de ha az elemek pont egyharmadai, egynegyedei valami másik elemnek, az is teljesen jó. Ne legyen véletlenszerű, az zavarja a szemet.

Ezt egyszerűsíti le az, hogy fogsz valamilyen egységet, ami lehet téglalap alakú is, de mindenesetre nagyobb, mint egy pixel, és gyártasz belőle valamilyen ritmus szerint dolgokat (mittomisén, az egység a képernyő szélességének 1/12-e, és van 3, 4, meg 6 egységes elem). Ez a grid, némi szünetjelekkel közbeiktatva. Az 1/1024 is grid valahol, de nem tudunk ekkora számokat kezelni.

A vizuális hierarchia az, hogy látod, mi tartozik össze mivel. Ha ránézel egy könyvre, vagy egy jobb tervező által csinált plakátra (svájci dizájnos link teli van vele), egyértelmű, mi hova tartozik, egyértelműek a szemednek a belépési pontok. A linkelt példákban az egyik srác az időpontokat, a másik az alcímeket tartotta fontosabbnak.

A vizuális hierarchia lényege, hogy a felhasználó:

1) ne tegye fel a kérdést az interfészre nézve, hogy "és én itt most ezzel mi a f.szt kezdjek"
2) ha valamit keres, nagyon jó tippjei legyenek arra nézve, hol találja a szemével

Az UI tervezési mintákat design patterneknek hívják éppúgy mint a programozásban, de picit más a hatásmechanizmusuk: programozásban explicit megtanulod, mi az az Observer, itt meg elég sok ilyen-olyan szerkezetet látsz ahhoz hogy automatikusan feltételezéseid legyenek a működésükről. Oldalai a Quince, a UI-patterns, a Patternry, könyvei az O'Reilly Designing Interfaces sorozata, a rád illő a "Designing Mobile Interfaces", 2011-es.

Az Androidnak van hivatalos pattern library-je by Google, meg hat rakás nem hivatalos (google: android patterns).

UX designer: konkrét appot így ingyen fórumon nem UX-elek (max ha opensource), pénzért... :)