Koduleht » UI / UX » Kuidas kujundada tühja oleku lehekülgi veebisaitidele ja mobiilirakendustele

    Kuidas kujundada tühja oleku lehekülgi veebisaitidele ja mobiilirakendustele

    Tühjad oleku leheküljed on vähem tuntud disainielemendid, millel on kasutajate kogemustes oluline roll. Kõige lihtsamal kujul on tühjad olekud lehekülje paigutused, mis on näha, kui kasutaja esimest korda külastab lehte, kus sisu pole saadaval.

    See võib hõlmata mobiilirakendusi, sotsiaalseid võrgustikke või isegi tühi blogikategooriaid. Eesmärk on anda tühi leht paistab nagu tühi leht. Külastajad peaksid tunnustada sisu puudumist eelseisva sisu vahendina.

    Ma tahaksin katta, kuidas tühjad riigilehed töötavad ja miks nad nii tähtsad on. Liidese disainerid peaksid neid punkte kaaluma ja püüdma neid vajaduse korral tühja oleku suhtes rakendada. Alustamiseks vaadake aga, kuidas tühi olek toimib ja kuidas see annab liidese väärtuse.

    Tühjade riikide väärtus

    Suure tühja riikliku disaini ilu on lihtsuses. Tühjad leheküljed selgitavad mis peaks olema lehel kui seal on sisu. See võib olla passiivne, nagu tühi postkast, või võib ta oodata aktiivset kasutajat nagu tühi Twitteri voog.

    Tühjad leheküljed on igav, igav ja isegi segane. Tühjad riigid anda juhiseid aidata kasutajatel mõista, mida nad vaatavad. Kuigi see on tühi leht, aitab lisakontekst.

    Tühjad riigid annavad ka tunde “värskust” uute kontodega, millel pole olemasolevaid andmeid.

    See Redditor Bambo_Ocha tehtud test kontrollis 20 erinevat rakendust tühjade olekumudelite jaoks. CTA-nuppude, prooviandmete ja isegi lühikeste juhendite läbitöötamisega kaasnesid erinevad disaini stiilid.

    Rakendused, mis kasutajaskonnale õitsevad, peaksid kujundama tühjad olekud soodustada kasutajate tegevust. See tegevus võib olla sisu avaldamine, sõprade lisamine, fotode üleslaadimine või mis tahes rakenduse jaoks. Tookapicist allpool olev ekraan on suurepärane näide.

    Kuid tühjad olekulehed omavad veel väärtust isegi siis, kui mingeid meetmeid pole vaja. Need kujundused on peamiselt ette nähtud teabe esitamiseks.

    Staatiline teave on sama väärtuslik ja tühja oleku omamine ei ole loomulikult halb. Näiteks sellel lehekülje kujundusel ei ole jälgimisrakenduse juhtpaneelil praeguseid mõõdikuid. Kasutaja võib soovi korral lisada mõningaid näitajaid, kuid see ei ole halb jätta kriips tühjaks.

    Sarnased staatilised kujundused võivad töötada suurepäraselt tühjade blogiarhiivide või tühjade sõnumite kaustade jaoks. On täiesti vastuvõetav, et ei kuvata ühtegi teadet. Kuid leht ei tohiks ilma kontekstita olla täiesti tühi.

    Vital Page Elements

    Tühja olekulehe kõige olulisem element on Sisu. See võib olla graafika, teksti või mõlema vormis. Soovite teavitada kasutajaid sellest, miks lehekülg on tühi ja millised andmed võivad olla (e-kirjad, tweetid, sõberprofiilid jne).

    Ja kuigi tekst on veebi peamine kommunikatsioonivahend, ei saa te unustada graafika ja ikoonide väärtust.

    DigitalOceanil on geniaalne armatuurlaud koos tühja oleku graafikaga, mis illustreerivad nende punkti selgelt. Nende ettevõte kasutab loomingulist brändi ja puhta tüpograafiat, mistõttu ei ole üllatav, et nende tühjad olekulehed on nii illustreerivad.

    Teine tühja riigi disaini oluline aspekt on helistamisnupp. See on tavaliselt nupp, kuigi hüperlingid töötavad ka hästi.

    Eesmärk on aidata kasutajatel tegutseda ja tühjendada oma tühja olekut. Kas see nõuab andmete lisamist või toiminguid saidil, juhivad CTA-d kasutajaid järgmisele sammule, mis on vajalik tühja oleku puhastamiseks.

    Dropboxil on suurepärane disain kahe CTA nupuga. Kui Dropboxi kasutajal ei ole kaustu, võivad nad luua uue kausta või lisada lehele proovi kausta.

    Kasutaja aktiivsuse soodustamine

    Toimingunupud on aktiivsed elemendid, kuid pidage meeles, et lehekülje kopeerimine selgitab mida kasutaja teeb. Keegi lihtsalt ei klõpsa nuppe, teadmata, miks.

    Parim viis julgustada tegevust on kirjutada suur koopia tühjale olekulehele. Juhendage kasutajaid sisuvoo kaudu, mis soodustab kasutaja tegevust kogu rakenduse ulatuses.

    See tühi olek ModSpoti poolt on suurepärane näide kvaliteetsest disainist ja julgustatavast sisust.

    Ikoone kasutatakse selleks, et näidata, mida kasutaja saidile lisada. Nool osutab nupule, mille kasutajad peaksid klikkima koos mõne teksti julgustava käitumisega. See on hiilgav tühja oleku disain koos kõigi eeldatavate elementidega.

    Samamoodi pakub Gumroad tühi olek kahte võimalust, mis on suunatud erinevatele potentsiaalsetele toimingutele. Kasutajad saavad lisada müügi alustamiseks digitaalse toote või füüsilise toote.

    Teised lehekülje lingid viivad abijuhiste ja kontaktandmete juurde. Kõik on uskumatult sujuv ja seostub kenasti.

    Veeb vs mobiilirakendused

    Kõikide meediumite tühjad olekulehed peaksid järgima sarnaseid disaini suundumusi. Kuid on mõningaid väiksemaid erinevusi kasutaja kogemusega töölaual võrreldes nutitelefoniga.

    Veebilehed suurematel ekraanidel teil on rohkem ruumi lisanuppude jaoks. Veebilehed võivad samuti olla suuremad navigatsioonielemendid mis võivad inimesi mujale saidile juhtida.

    Seda saab lahendada sarnaselt Nusii oma ettepanekute lehel. Kui puuduvad ettepanekud, juhitakse kasutajale “lisada ettepanekuid” nupp üleval navigeerimisribal.

    Mobiilirakendustel võib olla sarnaseid probleeme, kuid ekraanid on palju väiksemad. See teeb selle palju lihtsam kasutajaid tegevusele juhtida.

    Leian, et mobiilirakendusi on vähemate võimalustega lihtsam hoida. Kasutage visuaale nagu silmakommi, et soodustada tegevust ja suunata väga spetsiifilist kasutajavoogu.

    Tühjad riigi kujunduse näited

    Võib-olla on parim viis tühja riikliku disaini tundmaõppimiseks mõningaid näiteid uurida. Suurepärane veebigalerii emptystat.es kureerib tühi olekuleheküljed erinevatelt veebisaitidelt mobiilirakendustele.

    Olen valinud mõned näited, mis väärivad teie tähelepanu, mis kõige paremini illustreerivad tühja olekut. Kui teil on muid ettepanekuid, andke meile sellest teada.

    DigitalOcean ujuvad IP-d

    Webflow beeta

    Invision

    Bitbucket

    Pinnitud gruppe pole

    Facebooki sõnumid

    LayerVault

    Treeningu väljakutsed

    Puhver tühi

    Wordi rakenduse dokumendid

    Evernote vestlused

    Beamly Androidi jaoks

    Audible audioraamatud

    Pocket App

    BBC uudised

    GitHub Wiki leheküljed

    Flipboard

    Chrome'i järjehoidjate haldur

    Mac Infinit App

    Tühi Facebook Feed