De când sunt implicat în designul web, mi-am plin capul despre cum să fac ca fiecare site web să fie mai neconvențional decât predecesorul său. În acest articol, vă voi oferi câteva dintre sfaturile mele care vă pot inspira, de asemenea.

realizează

Ecran complet

O sarcină de la un client FarFaar a aterizat recent pe biroul meu. Pe lângă faptul că subiectul mi s-a potrivit, clientul ne-a oferit și o mulțime de fotografii frumoase, ceea ce ar fi păcat să nu le folosim.

Deoarece era o singură pagină de prezentare, nu exista prea mult conținut text. Prin urmare, am decis să dedic site-ul web în primul rând fotografiilor, care vor aduce oamenii mai aproape de experiența pe care clientul le oferă clienților.

Nu am ezitat o secundă că a fost decizia corectă. De îndată ce am creat site-ul web, a apărut întrebarea: Ce urmează? Cum să-i dai mai mult?

Parallax

O alegere clară a fost popularul efect de defilare în paralaxă, pe care am vrut să încerc să-l proiectez mult timp.

Creăm efectul Parallax, astfel încât obiectele aflate în prim-planul web să se miște mai repede decât fundalul în timpul derulării.

Creierul nostru percepe astfel conținutul ca un obiect care este mai aproape de ochii noștri decât fundalul, ceea ce creează impresia unui efect 3D. Deși știm că ecranul este plat.

Ai nevoie de două lucruri pentru a crea paralaxă. Prima este o fotografie care poate fi stratificată astfel încât rezultatul final să aibă sens și un conținut textual care trebuie să se încadreze în compoziția fotografiei.

Straturile unei fotografii, potrivirea textului și crearea efectului în sine vor necesita timp, dar rezultatul final merită.

Bine, așa că site-ul este reproiectat, a fost creată o paralaxă. Din nou, apare întrebarea: există o anumită valoare adăugată în acest sens?

De data aceasta derulez pe web și mă gândesc la ceea ce îi lipsește încă. Voi face o pauză peste secțiunea Galerie. unde văd o frumoasă fotografie introductivă cu un băiat lângă foc. Dar nu aud niciun foc.

În acel moment, îmi vine în minte să adaug un sunet de foc de tabără trosnitor la galerie, care va aprofunda experiența de a răsfoi fotografiile. Desigur, îl puteți „stinge” oricând.

Tipografie

Fonturi mari, zone goale, elemente vectoriale simple, imagini numai acolo unde este necesar (și, eventual, deloc). Dacă cantitatea de conținut și comunicarea clientului o permite, de ce nu?

Cu toate acestea, compoziția este foarte importantă în astfel de concepte web. Aceasta, inclusiv paleta de culori, decide care va fi rezultatul final.

Și vorbind de culori, sunt foarte bun cu privire la site-urile web puțin cam întunecate.

Nu un web alb plictisitor și un font întunecat, ci invers. Desigur, trebuie pus un mare accent pe asigurarea faptului că contrastul dintre fundal și text este suficient.

Cutii

Uneori, când auzeam casetele cu cuvinte, îmi imaginam un șablon. Colegul de echipă Čaky m-a convins că ar putea fi altfel în viziunea sa asupra proiectelor web.

Când iau ca exemplu site-ul web Lalalu Kidscafé, văd secțiuni de cutie standard, dar procesate nestandard.

Când scăpăm de compoziția tipică a șablonului, subliniem fundalul și încorporarea unui element grafic, cum ar fi un model, putem folosi casetele fără șablonul care arată web.

Nu în ultimul rând, aș include și site-uri web, cum ar fi magazinele electronice, agențiile de turism, agențiile imobiliare și toate site-urile web care conțin mult conținut și care trebuie să fie ușor de înțeles de către utilizator în categoria „casetelor”.

Cu toate acestea, acesta este un subiect pentru un articol separat, deci cândva data viitoare.

Puțină inspirație înainte de final

Compoziție, culori, fonturi, imagini, elemente grafice, efecte. Acestea sunt toate elementele care alcătuiesc kitul nostru numit web.

Proiecte web creative

Atunci când alegem elemente individuale, câteva site-uri web ne pot ajuta, ceea ce ne va face mai ușor să decidem ce direcție să mergem.

Printre primele aș menționa pagina Awwwards, unde veți găsi o serie de proiecte web creative din întreaga lume.

Avantajul este că toate site-urile pe care le găsiți sunt deja codificate și rulează. Deci, nu există miniaturi de la Pinterest sau Instagram, unde putem găsi o mulțime de inspirație, dar nimeni nu știe care dintre ele poate fi realizat cu adevărat din punctul de vedere al dezvoltatorului.

Palete de culori

Îmi place foarte mult să folosesc color.adobe.com atunci când aleg culori. Tovarăși de la Adobe au creat această pagină perfectă, care ne va ajuta să creăm o paletă de culori de vis cu culori complementare sau să alegem una dintre mii de palete de culori de la colegi din întreaga lume.

Tipar

Accesați fontul. Alegerea fonturilor potrivite este una dintre cele mai importante decizii la crearea site-urilor web. Cu toate acestea, nu putem permite unui vizitator al site-ului să nu poată citi text pe baza unui font slab ales sau prea mic.

Rețineți că internetul nu ar trebui să conțină un număr enorm de dimensiuni sau tăieturi de font diferite. Totul cu măsură.

Puteți găsi inspirație pentru fonturi și accente gratuite de calitate într-un articol al fostului nostru coleg Lukáš.

Fotografie

Cu fotografii și grafică, ajutăm vizitatorii să înțeleagă mai ușor și mai rapid conținutul web.

Îmi place când nu trebuie să folosesc fotografii de la bancă atunci când creez un site web, deoarece. dar uneori pur și simplu nu avem de ales. De aceea arunc câteva resurse aici pe site, unde puteți găsi fotografii, vectori sau icoane gratuite din invenția lumii:

Ce să nu uit

În cele din urmă, vă voi scrie câteva rânduri despre ce trebuie să aveți în vedere atunci când alegeți un concept și proiectați un site web.

Noi, designerii, trebuie să ținem cont de faptul că astăzi oamenii vin pe site-uri web în mare parte de pe telefoane mobile. Deci, mai întâi proiectați mobilul? Personal, îmi facilitează versiunea mobilă după versiunea desktop.

Deși designul este foarte important și uneori este bine să zbori în el, totul trebuie să aibă regulile sale. Trebuie să existe ordine în design și totul trebuie să aibă sens. Atât noi, proiectanții, cât și dezvoltatorii.

Cu toate acestea, nu vrem ca colegii noștri dezvoltatori să ne privească strâmb pentru faptul că am proiectat secțiuni peste care trebuie să petreacă ore lungi.

Desigur, exportul este, de asemenea, important, ceea ce va livra tot ce are nevoie dezvoltatorului. Noroc cu următorul dvs. proiect.:)