UI dizaina konsekvences saglabāšana

UI dizaina konsekvence ir vecās skolas princips, un tas ir nedaudz aizmirsts dažos mūsdienu tīmekļa un lietojumprogrammu dizainos. Liekas, ka dizaineri izvēlas no saskarnēm izlaist konsekvenci.

Mobilo lietojumprogrammu dizaina gadījumā daži dizaineri izvēlas no jauna izgudrot, atkārtoti izveidot vai pat pilnībā izjaukt aparatūras standarta mijiedarbību ar saviem unikālajiem interfeisa modeļiem. Pārkāpjot konsekvenci starp aparatūras lietotāja interfeisa noteikumiem un jūsu lietotņu pieredzi, iespējams, nav slikta ideja, tomēr jūsu pašu lietotņu konsekvences pārkāpšana var būt slikta ideja.

Trīs soļi konsekventai lietotāja saskarnes noformēšanai

Pamatā ir trīs konsekvences veidi, par kuriem jums vajadzētu padomāt, izstrādājot tīmekļa un mobilo lietotņu dizainus:

• 1. Esiet saskaņā ar ierīces lietotāja saskarnes vadlīnijām un izturēšanos
• 2. Esiet konsekvents ar citām līdzīgām vietnēm vai lietojumprogrammām
• 3. Esiet konsekvents ar savu dizainu

Šī raksta nolūkā es vairāk pievērsīšos trešajam - konsekvences saglabāšanai jūsu lietotāja interfeisā. Tas ir sava veida liels darījums galvenokārt tāpēc, ka jūs nevēlaties sajaukt vai pārsteigt lietotājus savā lietotnē.

Jūs nevēlaties, lai lietotājs pārietu no jūsu mājas lapas uz apakšlapu un redzētu atšķirīgu stilu vai pat ļoti atšķirīgu lietotāju mijiedarbību. Šāda veida lietas var pārsteigt lietotājus vai dažos gadījumos pat viņus aizbiedēt. Konsekvence ir ne tikai liela nozīme vietnes vispārējā izmantojamībā, tā var arī ievērojami palielināt reklāmguvumu.

Konsekventa struktūra un mijiedarbība

Tas ir galvenais, lai izveidotu saskanīgu lietotāja saskarni. Dažreiz, izstrādājot, mēs aizmirstam par to, kā struktūra un mijiedarbība ietekmēs vispārējo lietotāja pieredzi. Bet tāpat kā plāna izstrāde un plānu izveidošana ir svarīga, veidojot māju vai ēku, tā ir svarīga arī konsekventas, izmantojamas lietotāja saskarnes izveidošanai. Pirms sākat rakstīt kodu, ir dažas lietas, kas jāpārdomā un jāplāno nākotnē.

• 1. Apsveriet, kā konsekventi izvietot elementus visā vietnē vai lietotnē.
• 2. Padomājiet par to, kādus UI modeļus jūs izmantosit.
• 3. Plānojiet, kādi ievades elementi jums būs nepieciešami.
• 4. Izdomājiet, kādas ikonas jums būs vajadzīgas, un izvēlieties vai noformējiet labu ikonu komplektu, kas aptver tās visas.

Elementu izvietojums ir milzīgs veids, kā samazināt pārsteigumu lietotājā un radīt pastāvīgas, ticamas cerības. Glabājiet navigāciju tajā pašā vietā, un lietotājs neko nekairina ātrāk nekā navigācijas elementu pārvietošana vai pazušana. Vienlaikus turiet logotipus un citus zīmolu produktus vienuviet visā vietnē.

“Nekas lietotāju nekairina ātrāk kā navigācijas elementu pārvietošana vai pazušana”

Ja izmantojat sānjoslu, nekratiet sānu joslu daudz, mainot to, kas tajās atrodas, no vienas lapas uz otru. Daži no tiem var attiekties uz lapas saturu, taču izvairieties no vispārēju importēto elementu, piemēram, meklēšanas formu, noņemšanas vai pat pārvietošanas. Viena liela lieta, kas jātur konsekventi, ir pieteikšanās un lietotāja iestatīšanas saites vai pogas.

Apsveriet UI modeļus

Plānojiet priekšu un padomājiet, kādi UI modeļi jums būs nepieciešami. Vai jums būs nepieciešama galerija? Modals? Akordeoni? Sānjoslas? Plānojot dizaina modeļus pirms laika, tas ne tikai palīdzēs jums ātrāk attīstīt un noformēt lietotni, bet arī domāšana par nepieciešamajiem dizaina modeļiem palīdzēs arī pirms laika izdomāt savu saturu - tas var ietaupīt arī daudz laika.

Tas arī atrisinās problēmas un laicīgi atbildēs uz jautājumiem, šādā veidā, atnākot uz vietnes sadaļu vai lapu, kurā jāpieņem lietotāja saskarnes lēmums, jūs jau esat to izdarījis, un jūs neaizķersities no dizaina paraugu sajaukšanas. visā jūsu vietnē.

Padomājiet par savām veidlapām arī pirms rokas. Plānojiet, kādi formas elementi jums būs nepieciešami, un izdomājiet elementus, kuri jums nebūs nepieciešami vai kurus varētu aizstāt. Veidlapas elementi lietotājiem var būt biedējoši vai pat sarežģīti pārvietoties, tāpēc, ja jūs varat novērst vai apmainīt dažas ievades, kas varētu būt klupšanas akmeņi, dariet to.

"Ja jūs varat novērst vai apmainīt dažus ieguldījumus, kas varētu būt klupšanas akmeņi, dariet to."

Tas ir arī lielisks veids, kā lēmumu pieņemšanu noņemt no izstrādes procesa. Ja veidlapas ir nemainīgas gan stilā, gan struktūrā, gan mijiedarbībā, dažkārt reklāmguvumu līmenis var tikt samazināts vai samazināts.

Atkal plānot galvu. Plānojiet, kādas ikonas jums būs vajadzīgas pirms laika. Viens īpaši ātrs veids, kā izjaukt jūsu konsekvenci, ir puslaiks savas lietotnes izstrādes laikā, kad uzzinājāt, ka jums būs vajadzīgas drukas ikonas, un tad sapratīsit, ka neatceraties, kur ieguvāt ikonas, vai pat ja varat atrodiet drukas ikonu, kas atbilst pārējām jūsu ikonām.

Tas nav pat stila jautājums, bet gan interaktīvs. Lietotāji pierod pie konkrētu ikonu izskata un varēs ātri tās atpazīt. Bet, ja jūs izmantojat raibu ikonu komplektu, jūs maldināsit savu lietotāju vai pat apgrūtināsit viņu teikto, ko attēlo noteiktas ikonas.

Konsekvents stils

Katra lietotāja interfeisa elementa stils un dizains ir svarīgs, un konsekvences saglabāšana starp tiem ir svarīga arī lietotājam. Tāpat kā ir svarīgi, lai ikonas tiktu iestatītas konsekventi, ir svarīgi, lai jūsu lietotnei būtu konsekventa tās konstrukcija. Var domāt, ka dažas pogas ir foršas, kaut arī tās ne tuvu neatbilst vietnes dizainam vai krāsu shēmai, taču tas tikai mulsinās jūsu lietotāju un izskatīsies neglīts.

Izstrādājot UI komplektu, ir jāpatur prātā dažas lietas, lai izveidotu konsekvenci:

• 1. Krāsu shēma
• 2. Stils
• 3. Robežas
• 4. Tips un fonti
• 5. Izmērs
• 6. Fona attēli
• 7. Ietekme

Krāsas

Tāpat kā es teicu iepriekš, saglabājiet savu UI krāsu atbilstību visām jūsu vietnes krāsu shēmām. Pat izstrādājot aicinājumu uz darbībām, kurās vēlaties, lai pogas izceltos un tiktu pamanītas, esiet piesardzīgs, lai jūsu aicinājums uz darbību nekļūtu par neglītu komplimentu visām jūsu krāsu shēmām. Lai palīdzētu jums, izmantojiet tādus rīkus kā Kuler vai ColorSchemer, lai palīdzētu izvēlēties krāsas, kas labi sader kopā.

Kad es runāju par jūsu stila konsekvences saglabāšanu, es runāju par to, ka neizmantoju kādu traku gradienta pogu ar ēnām un slīpām leņķiem, ja pārējā vietnes konstrukcija ir līdzena un tai nav ēnas vai gradienta. Neatkarīgi no vispārējā vietnes noformējuma, ievērojiet arī lietotāja saskarnes elementu stilu. Ja ievades etiķetēs izmantojat noteiktu krāsu vai fonta stilu, pieturieties pie tā un izmantojiet to visās etiķetēs.

Robežas

Ahh, robežas. Pārāk bieži es redzu vietnes, kurās tiek izmantoti trīs vai četri dažādi pogas apmales biezumi vai rādiusi, un tas tiešām var mulsināt. Saglabājiet visas robežas ar pogām, ieejām, atlasēm, galerijām, attēliem un visiem citiem lietotāja saskarnes elementiem saskaņotiem. Tas nenozīmē, ka jums ir jāizmanto robežas rādiusā, varat to sajaukt, izmantojot dažas vērtības vai pat konsekventi izmantot vienu stilu katram elementam.

Tips un fonti

Tā paša veida un fontu izmantošana savos elementos ir diezgan svarīga lieta, it īpaši, ja darīšana ir saistīta ar formas elementiem. Uzturiet galvenes nemainīgu un nelietojiet daudzus fontus, pat ja jums tie visi varētu patikt - varat tos saglabāt citiem projektiem. Ievadam un pogām jābūt fontu stiliem, kas sakrīt vai papildina viens otru, lai veidlapas būtu viegli lasāmas un paredzamas.

Izmērs

Fontu un citu elementu lielumam jābūt konsekventam vai papildinošam. Lapu galvenēm un nosaukumiem jābūt nemainīgiem, lai jūsu lietotājs zinātu, ka šīs teksta rindiņas faktiski atbilst galvenēm un nosaukumiem. Pastāvīgs lielums attiecas arī uz visiem lietotāja interfeisa elementiem no satura reģioniem, saitēm, navigācijas elementiem vai sānjoslām. Neizmainiet šo izmēru, lai krasi mainītu lappuses skatījumus, lai lietotājs tos varētu uzreiz atpazīt, kad lapa tiek ielādēta.

Fona attēli

Centieties pārāk nemainīt fona attēlus. Mūsdienās tas nenotiek daudz, kā bija ierasts, bet tomēr ir ieteicams izvairīties no fona attēlu mainīšanas no lapas skata uz lapas skatu. Ja jūs to darāt, mēģiniet kaut kā padarīt attēlu savstarpēji salīdzināmu, lai lapas nezaudētu konsekvenci. Fona attēla maiņa, īpaši lielie, var padarīt vietni nesaiminātu un liktu lietotājam justies tā, it kā jūs pat būtu pilnībā atstājis jūsu vietni, tāpēc mēģiniet izvairīties no šī kārdinājuma.

Efekti

Efekti, vissvarīgākais apgaismojuma efekts, var padarīt to, kas, šķiet, lielisks vietnes dizains, lietotājam nav jēgas. Piemēram, ja jūs izmantojat pogas izcelšanu, kas izskatās tā, it kā uz tās spīd gaisma, izmantojiet to pašu apgaismojuma efektu pogām slīpam tekstam vai slīpām teksta ievadam.

Godīgi sakot, tas tiešām nav milzīgs, kas padara to sarežģītu vai sabojājas ar lietotāju, taču izvēlīgajam skatītājam viņi var pamanīt jūsu efektu neatbilstību un novērsties no darīšanas, kas viņiem ir paredzēts ar jūsu lietotni vai vietni.

Nebūt garlaicīgam

Konsekvences veidošana dažreiz var šķist ikdienišķa vai pat garlaicīga, un jūs, iespējams, vēlēsities kaut ko iemest dizainā, lai lietotājam sagādātu pārsteigumu, un tas tiešām ir lieliski.

Labi ir turēt lietotājus uz pirkstgaliem, jsuts lietas tik ļoti nesakrata, ka viņi tik ļoti atrunājas vai sajaucas, ka aizbrauc un dodas kaut kur citur. Nedaudz konsekvences var iet tālu.