Gaukite tobulą svetainės išdėstymą atlikdami 27 veiksmus

Puslapis 1 iš 2: Svetainės išdėstymas: darbo pradžia ir projektavimas

Kurti svetainės išdėstymą neturi būti sunku, ypač jei žinote dažniausiai pasitaikančių klaidų. Šiame įraše mes atliksime veiksmus, kuriuos turite atlikti, kad pasiektumėte tobulą svetainės išdėstymą. Aprašysime, ką kiekvienas naujas interneto svetainių kūrėjas turėtų žinoti ir padaryti prieš pradėdamas naują projektą, ir į ką turėtų atkreipti dėmesį, kad nepaslystų.

Šie veiksmai apima ne tik dizaino aspektus, bet ir bendruosius darbo eigos patarimus. Šiame puslapyje mes tyrinėjame, kaip pradėti, pagrindinius dizaino darbo eigos žingsnius ir toliau 2 psl rasite bendrų patarimų, kaip artėti prie svetainės maketo, ir patarimų, kaip užbaigti projektą. Vykdykite šį patarimą ir netrukus galėsite kurti profesionalius interneto maketus. Taip pat galite perskaityti toliau Atominis dizainas , kaip būdas struktūrizuoti savo svetainę.

Vis dar ieškote šeimininko? Pažvelkite į mūsų vadovą geriausios svetainių talpinimo paslaugos ir geriausi interneto svetainių kūrėjai dabar. Čia jis nėra aprašytas, tačiau nepamirškite savo klaidos puslapių! Pažvelkite į mūsų pasirinktą geriausi 404 puslapiai įkvėpimui.



Darbo pradžia

01. Apibrėžkite, ką reiškia sėkmė

asmuo su nešiojamuoju kompiuteriu

Susipažinkite su savo dizaino tikslu

Prieš pradėdami darbą, turite žinoti, ką jūs suprojektuojate. Be svetainės aprašymo, jūs turite žinoti, kokie yra jo lūkesčiai. Paimkime, pavyzdžiui, naujienų svetainę. Koks tikslas? Ar tam, kad būtų kuo daugiau reklamos parodymų, ar tai, kad skaitymo patirtis būtų geriausia? Kaip bus vertinami tie tikslai?

Geras dizaino dizainas nebūtinai yra pats ryškiausias, tačiau laikui bėgant pagerėja našumas. Kalbant su klientais prieš pradedant dizainą, svarbu apibrėžti visa tai. Turite sužinoti, kokie yra jų rūpesčiai ir tikslai, išskyrus užrašytą SOW (darbo ataskaita).

02. Supraskite dabartinę svetainę

Dažniausiai dizainerio dalyvavimas projekte nėra tas, kas vyksta atskirai. Klientai ne visada susisieks su jumis, kad pradėtų ką nors nuo nulio. Daugeliu atvejų turėsite suprasti šiuo metu veikiančią sistemą ir, jei jūsų projektas skirtas iššūkiui, raskite galimybių jį tobulinti arba sekti tokiu, koks jis yra.

Variantai yra beribiai. Suprasti tai, kas yra dizaino požiūriu, yra labai svarbu, jei norite greitai judėti ir suvokti, kur yra galimybių diegti naujoves, o ne jums reikia mesti iššūkį tam, kas nustatyta, ir atsirasti kaip žmogui, kuris negali suprasti reikalavimų.

03. Anksti dalinkitės dizainais su klientais

Siūlydami interaktyvią koncepciją ar dizaino „išvaizdą ir jausmą“, turite užtikrinti, kad jūs ir klientas kuo greičiau patektumėte į tą patį puslapį. Venkite praleisti per daug laiko koncepcijai prieš pasidalindami ja su klientu.

Patvirtinus pradinę koncepciją, galite šiek tiek atsipalaiduoti ir pradėti gamybą. Tačiau pateikus pirmąją koncepciją, jei klientas jos nemyli, turėtumėte surinkti pakankamai atsiliepimų, kad galėtumėte pateikti antra, tinkamesnę koncepciją.

Dizaino darbo eiga

04. Pirmiausia išspręskite maketą

Tai atrodo labai akivaizdu, tačiau per dažnai pastebėjau, kad dizaineriai tiesiai pereina prie savo darbo, prieš galvodami apie problemą, kurią bando išspręsti. Dizainas yra problemų sprendimas, ir tų problemų negalima išspręsti per nuolydžius ar šešėlius, o geriau naudojant gerą išdėstymą ir aiškią hierarchiją.

Pagalvokite apie turinį, išdėstymą ir funkcionalumą. Įsitikinkite, kad šios mintys atitinka jūsų kliento tikslus, ir drąsiai dalinkitės jomis.

05. Pradėkite piešti aukščiausio lygio sistemą

Svetainės išdėstymas: UX eskizas

Pagrindinis vielinis rėmas padės struktūrizuoti išdėstymą (spustelėkite viršutinėje dešinėje esančią piktogramą, kad padidintumėte)

Kai manęs paprašys sukurti interneto maketo išvaizdą ir jausmą, pirmiausia turiu sugalvoti aukščiausio lygio sistemą, kuri išspręstų visas dizaino problemas. Karkasas yra vartotojo sąsaja, kuri supa turinį ir padeda vartotojui atlikti veiksmus ir juo naršyti. Tai apima navigaciją ir komponentus, tokius kaip šoninės juostos ir apatinės juostos.

Jei žiūrėsite į savo dizainą iš šios perspektyvos, suprasite, kokie bus jūsų išdėstymo projektavimo skyriai už pagrindinio puslapio ribų.

06. Pridėkite tinklelį

tinkleliai skirtinguose ekranuose

978 tinklelio su 10 taškų bazine linija pavyzdys

Tai taip paprasta, kaip atrodo. Prieš pradedant kurti bet ką, jums reikia tinkamo tinklelio. Nėra tinkamų pasiteisinimų pradėti be tinklelio - ir jei to nepadarysite, galiu jus patikinti, dizainas neatrodys taip gerai. Tinklelis padės susisteminti skirtingų sekcijų išdėstymą; tai padės jums atsižvelgti į konkrečius ekrano dydžio reikalavimus ir padės jums sukurti interaktyvius šablonus, todėl jūs esate nuoseklus tarpų ir daugelio kitų dizaino klausimų atžvilgiu.

Norėdami sužinoti, kaip tai padaryti, peržiūrėkite šį vadovą sukurti tinklelį, kuris prisitaiko prie visų dydžių ekrano .

07. Pasirinkite tipografiją

Svetainės išdėstymas: tipografija

Nykščio taisyklė - svetainės makete naudoti ne daugiau kaip du skirtingus šriftus

Skirtingų šriftų ir spalvų tyrinėjimas yra projekto atradimo etapo dalis. Paprastai rekomenduočiau svetainėje naudoti ne daugiau kaip du skirtingus šriftus, nors tai tikrai priklauso nuo jos pobūdžio. Pasirinkite lengvai skaitomą šriftą dideliems teksto gabalėliams ir žaismingiau žaiskite su pavadinimais ir raginimais veikti. Ieškote įkvėpimo? Pažvelkite į mūsų tobulą turinį šriftų poravimas arba jų sąrašas nemokami šriftai . Nebijokite naudoti didelių šriftų ir būkite kūrybingi bei nuoseklūs, kai naudojate tipografiją.

08. Pasirinkite savo spalvų temą

Svetainės išdėstymas: spalvos

Tokie įrankiai kaip „Color Hunt“ yra skirti padėti išsirinkti paletę

Renkantis šriftų rinkinį, turėtumėte pradėti tyrinėti, kokias spalvas naudosite sąsajoje, fonuose ir tekste. Rekomenduoju ribotą spalvų ir tonų rinkinį bendrai vartotojo sąsajai.

Svarbu jas nuosekliai taikyti svetainės maketui, atsižvelgiant į kiekvieno elemento funkcionalumą. Pagalvokite apie tokių svetainių kaip „Facebook“, „Twitter“, „Quora“ ir „Vimeo“ išdėstymą. Be vartotojo sąsajos neturėtų būti jokių apribojimų iliustracijoms ar grafinėms detalėms, jei jie netrukdo komponentų funkcionalumui.

Jei užstrigote, pažvelkite į mūsų sąrašą geriausios spalvų priemonės interneto dizaineriams .

09. Supaprastinkite išdėstymą

Svetainės išdėstymas: B ritės pagrindinis puslapis

Paprastus išdėstymus paprastai lengviau naršyti

Kuo paprastesnė svetainės struktūra, tuo lengviau vartotojams naršyti. Kiekviename skyriuje reikia pasakoti istoriją; vartotojui reikia priežasties ir galutinio rezultato. Išdėstymas turėtų padėti turiniui išryškinti svarbiausius tos istorijos kūrinius.

Iš tikrųjų puslapyje neturėtų būti per daug raginimų veikti - viskas turėtų paskatinti tą galutinį „Ką aš čia galiu padaryti?“

kaip padidinti drobės dydį

Pagalvokite apie paprasčiausią išdėstymą, kurį galite įsivaizduoti paprastam tikslui, ir pradėkite pridėti būtinų komponentų. Galų gale nustebsite, kaip sunku tai padaryti paprasta.

10. Patobulinkite kiekvieną komponentą

Claudio Guglieri dirbo su „Microsoft Music“ vartotojo sąsaja

Elkitės su kiekvienu komponentu taip, tarsi jį būtų galima pateikti projekto konkursui. Jei atkreipsite dėmesį į kiekvieną komponentą, visuma bus daugiau nei jo dalių suma. Turiu pripažinti, kad šis patarimas nėra mano. Girdėjau tai ankstesnėje agentūroje ir buvau sukrėstas, koks aiškus ir teisingas buvo šis teiginys.

Kiekvienas komponentas turi būti suprojektuotas taip, lyg jis galėtų būti vienas kaip geriausias visų laikų komponentas. Kartais dizaineriai palieka tam tikras svetainės dalis iki paskutiniųjų savo darbų sąraše ir galiausiai neparodo jiems didelės pagarbos.

11. Apžiūrėkite klientus savo sprendimais

Venkite didelių darbų atskleidimo. Vienas iš tikslų dažnai bendrauti su klientu yra vengti netikėtumų, atskleidžiant savo darbą. Tais laikais, kai pristatau savo pažangą, man pasirodė naudingiau juos pasiimti į kelionę ir parodyti, nuo ko pradėjau, kokias aplinkybes turėjau naršydamas tą ar tą iššūkį ir kur aš pagaliau nusileidau, užuot tik parodęs kelionės be konteksto pabaiga.

Tai darydami pastebėsite, kad jie arba sutinka su jūsų išvadomis, arba tam tikru momentu jūsų peržiūros metu nurodys trūkumą ar papildomą variantą, kurio galbūt nesvarstėte. Bet kuriuo atveju turėsite pokalbį ir klientas jausis labiau investuotas, nes yra proceso dalis.

12. Galvok judesyje

vienišos planetos svetainė

Judėjimas yra būtinas kuriant interaktyvias patirtis

Judėjimas yra būtinas kuriant interaktyvias patirtis. Joks dizainas negali būti vertinamas atskirai ar kaip statinis kompasas; kiekvieną komponentą apibrėžia jo santykis su sistema, ir tą santykį reikia tinkamai perduoti. Judėjimas gali parodyti dinaminius efektus turiniui ar interaktyvioms jūsų maketo būsenoms. Tuo tikslu aš rekomenduoju šiek tiek labiau atsižvelgti į prototipų kūrimą.

13. Prototipas, prototipas, prototipas

vienišos planetos svetainė mobiliajame telefone

Prototipai yra geriausias būdas išbandyti sąveiką

Prototipai yra geriausias būdas išbandyti sąveiką ir technologijas. Yra daug prototipų kūrimo įrankiai tai daro tai lengva šiais laikais, o norint sukurti efektyvius prototipus nereikia būti kodavimo guru. Tai dar vienas būdas sujaudinti klientą ir pristatyti jam idėjas bei idėjas, kurias kitu atveju reikėtų daug paaiškinti.

Kitas puslapis: Dizaino metodas ir apvyniojimas

  • 1
  • du

Dabartinis puslapis: Svetainės išdėstymas: darbo pradžia ir projektavimas

Kitas puslapis Svetainės išdėstymas: Dizaino metodas ir užbaigimas