Un ghid pas cu pas pentru proiectarea ilustrațiilor personalizate fără abilități de desen

Văd că multe companii folosesc astăzi ilustrații sau imagini de stoc. Deși aceste opțiuni sunt ieftine, mesajul mărcii este diluat deoarece imaginile nu sunt exclusive produsului.

Într-o lume în care 74% dintre rețelele sociale și agenții de marketing B2B folosesc elementele vizuale în promoțiile lor, modul în care te deosebești vizual este esențial.

Dacă brandul tău este prolific, oamenii vor învăța limbajul vizual asociat brandului tău. De îndată ce văd aceleași ilustrații stoc asociate cu un alt produs, identitatea mărcii dvs. se va slăbi.

Cu ilustrații personalizate, elementele identității unui brand se pot reuni în jurul unei perspective și personalități comune. Ei comunică cu clienții la un nivel intuitiv și ajută mărcile să-și spună povestea într-un mod durabil.

Cu toate acestea, mulți designeri se feresc să lucreze ca ilustratori de teama că nu au abilități de desen. Suntem aici pentru a vă arăta cum orice designer poate dezvolta ilustrații frumoase, fără a fi nevoie de desen.

Vom analiza trei stiluri de ilustrare populare și vom aplica pași foarte simpli pentru a vă dezvolta propria lucrare de artă de la zero. Puteți urmări și aplica ceea ce veți învăța pentru a crea piese grozave pentru următorul dvs. proiect.

Recreează celebra ilustrație spațială.

Designerul și ilustratorul Nina Georgieva este pioniera din spatele acestei piese celebre Dribbble, iar acum, stilul a devenit o tendință proprie.

Furând inspirație de la Georgieva, ne vom crea propria ilustrație a spațiului, urmând câțiva pași simpli.

Aceasta este ceea ce vei obține în cele din urmă.

1. Începeți cu stelele.

Folosind „instrumentul stea” al Illustrator, creați o stea cu patru puncte. Apoi faceți-l 75 la sută transparent.

În timp ce este selectat, duplicați-l la loc apăsând Ctrl+C, apoi Ctrl+F.

Reduceți forma din față.

Apoi, adăugați un efect strălucitor; selectați forma mai mare; și aplicați un efect „Neclaritate gaussiană” din panoul „Aspect”.

În cele din urmă, puteți stoca forma de stea în interiorul panoului „Simboluri” pentru a o utiliza mai târziu în compoziție.

2. Creați forma norului.

Stivuiți dreptunghiuri împreună cu diferite lățimi.

Îmbină-le împreună cu panoul „Pathfinder”.

Finalizați dând întregii forme o valoare mare a „razei colțului”.

3. Faceți textura planetei din nori

Începând cu forma norului, creați efectul de textură a planetei așa cum se arată mai sus.

Stivuiți multe forme de nori împreună și asigurați-vă că aveți o succesiune de curbe spre exterior și spre interior pentru a crea un model ondulat.

4. Modificați textura.

Simplificați modelul ondulat înainte de a-l aplica pe forma planetei.

Îndepărtați punctele suplimentare de pe o parte a texturii și aplatizați-o.

5. Creați o planetă texturată.

Suprapuneți modelul ondulat cu un cerc și creați o diviziune utilizând opțiunea „Divide” din panoul „Pathfinder”.

Ștergeți forma suplimentară creată în afara cercului și creați un efect de lumină aplicând diferite valori de gri pe fiecare parte a planetei.

6. Adăugați o atmosferă planetei.

Creați două cercuri mai mari și inserați-le în spatele planetei cu Ctrl+X apoi Ctrl+B.

Aliniați-le corect.

Adăugați transparență noilor cercuri și un efect de estompare celui de-al treilea cerc (în panoul „Aspect”).

Grupați (Ctrl+G) și stocați rezultatul în panoul „Simbol”.

7. Duplicați și colorați planetele.

Copiați mai multe forme de planetă din panoul „Simboluri” și recolorați-le folosind două culori diferite pentru fiecare parte.

Utilizați „Instrumentul de selecție directă (A)” pentru a selecta și „Instrumentul pentru picurare (I)” pentru a alege și aplica o culoare.

8. Scalați și poziționați-vă planetele

Mutați planetele în diferite poziții cu „Instrumentul de selecție (V)” și dați-le diferite dimensiuni trăgând colțurile albe care apar atunci când sunt selectate (mențineți tasta „Shift” pentru scalarea proporțională).

9. Adăugați inelele.

Desenați câteva cercuri de linii în jurul planetelor pentru a face inelele.

Pentru a lipi planete mai mici în fața inelelor, selectați-le, apoi apăsați Ctrl+X (tăiați) și Ctrl+F (lipiți în față).

10. Adaugă niște nori și stele pe cer.

Revenind la panoul „Simbol”, trageți și plasați câteva forme de nori și stele.

Duplicați-le, scalați-le și poziționați-le așa cum doriți în spațiul dvs.

Iată rezultatul final.

Joacă-te cu scara, poziția și culorile pentru a le face cu adevărat al tău.

Adăugați ceva tipografie și voilà, aveți un fundal de desktop nou, personalizat.

Recreează stilul de ilustrații de blog Toptal

Blogul Toptal este o sursă valoroasă de perspective și inspirație creată de talente de top din întreaga lume. La fel ca cel pe care îl citiți acum, majoritatea articolelor prezintă ilustrații pentru a susține conținutul. Folosim forme geometrice simple și culori strălucitoare pentru a reprezenta obiecte.

Să vedem cum poți aplica acest stil pentru a crea propriile ilustrații cu alimente.

Aceasta este ceea ce vei obține în cele din urmă.

1. Desenați un prajit simplu.

Pentru a crea o prăjitură, începeți cu un dreptunghi lung și adăugați mai multe puncte peste margini cu „Instrument Pen (P)”.

Modificați forma prin mișcarea punctelor, folosind „Instrumentul de selecție directă (A)”.

2. Creați recipientul pentru maioneză.

Creați trei cercuri cu dimensiuni descrescătoare, din spate în față.

Cercul exterior este recipientul, cel din mijloc (în alb) este maiaua, iar cercul interior, mai mic (cu un tun colorat) este pentru efectul de iluminare.

Tăiați cercul interior în jumătate și asigurați-vă că „Capacul” și „Colțul” din panoul „Stroke” sunt rotunde.

3. Faceți ketchup-ul și muștarul.

Duplicați cana cu maioneză pentru a crea muștar și ketchup.

Pur și simplu aplicați culori diferite pentru sos și lumină, așa cum este sugerat mai sus.

4. Adăugați salata verde în formă de undă.

Cu „Instrumentul Pen (P)”, trasați o linie dreaptă și adăugați-i mai multe puncte.

Distribuiți distanța orizontală a acestora din panoul „Aliniere”.

Trageți în jos punctele de modificare și rotunjiți fiecare colț la maximum, până când este complet neted.

5. Creați o felie de pâine.

Creați un oval lung; suprapuneți-l cu forma de undă și creați o diviziune utilizând opțiunea „Divide” din panoul „Pathfinder”.

Îndepărtați forma suplimentară pe care o obțineți din instrumentul „Împărțire”, apoi recolorați felia de pâine.

6. Faceți pâinea pentru burger.

Oglindiți felia de pâine pe verticală și adăugați un punct de răsturnare în stratul superior.

Rotunjiți acea margine pentru a face o chiflă netedă pentru burger.

7. Terminați burgerul.

Colorează salata verde.

Apoi creați diferite „dreptunghiuri rotunjite” pentru carne, brânză și roșii, folosind culorile maro, galben și, respectiv, roșu.

Mutați lucrurile pentru a vă stratifica corect burgerul.

8. Creați un hot dog din burger.

Începând cu ilustrația burgerului, îndepărtați roșiile și brânza, recolorați salata verde în maia și muștar și duplicați pâinea inferioară pentru un hot dog mai simetric.

9. Proiectează forma pizza.

Începeți cu stratul superior al burgerului, mutați punctele inferioare în jos și apropiați-le.

Duplicați forma de triunghi, reduceți-o și faceți-o galbenă pentru o bază brânză.

10. Adăugați formele de roșii.

Suprapuneți un cerc roșu mare cu cercuri interioare mai mici și utilizați opțiunea „Minus Front” din panoul „Pathfinder”.

Așezați mai multe felii de roșii cu dimensiuni și poziții diferite pe forma pizza.

11. Creați niște felii de carne.

Desenați o formă maro organică cu „Instrumentul stilou (P)” duplicat și scalați-o deasupra pizza.

12. Adăugați toppinguri suplimentare.

Adăugați linii mai mici, colorate și rotunjite în spațiile goale pentru a termina toppingurile pentru pizza.

13. Creați paiul.

Steaua cu un dreptunghi alb lung.

Adăugați două puncte cu „Instrumentul Pen (P)” și mutați marginile de sus pentru a îndoi paiul.

Copiați și lipiți punctul din mijloc pe marginea dreaptă, apoi aplicați o contur roșu, fără umplere.

Mutați linia roșie în mijlocul dreptunghiului alb.

14. Creați forma cutiei de sifon.

Desenați un poligon cu opt laturi; adăugați conserva; mutați primele patru puncte în sus; și scalați (S) marginile superioare și inferioare spre exterior pentru a face să arate mai mult ca o cutie.

Adăugați dreptunghiuri rotunjite în partea de sus și de jos pentru a crea jantele.

15. Modificați forma conservei și scalați paiele.

Mutați punctele pentru a modifica formele, apoi scalați cutia și paiele în proporții care pot fi identificate.

16. Terminați cu designul val de pe cutie.

Desenați o formă organică și ondulată pentru designul pe cutie.

Apoi creați o diviziune cu panoul „Pathfinder” și ștergeți formele exterioare suplimentare.

Iată rezultatul final.

Recreează o ilustrație inspirată din jocul Monument Valley

Monument Valley este cel mai bine vândut joc creat de studioul UsTwo. A câștigat zeci de premii, inclusiv cel mai bun joc Apple pentru iPad din 2014, iar stilul său de ilustrare este inspirat de frumoasele lucrări geometrice ale lui Escher.

Acum veți învăța cum să creați cu ușurință același stil vizual care a făcut din acest joc un succes atât de mare.

Aceasta este ceea ce vei obține în cele din urmă.

Veți folosi doar avioane și cuburi ca blocuri pentru întreaga ilustrație.

Paleta de culori are patru culori pentru apă, iarbă, lemn și clădire – fiecare în trei nuanțe pentru a simula lumina naturală.

1. Creați un plan izometric.

Începeți cu un pătrat, apoi urmați acești trei pași pentru a crea o formă izometrică. Fiți atenți pentru că veți repeta acest proces de fiecare dată când aveți nevoie de o altă formă izometrică.

Îl vom numi „Efectul izometric:”

Accesați Efect > 3D > Extrudare și teșire Selectați „Sup izometric” în meniul derulant „Poziție” - în panoul de opțiuni care apare. Setați „Extrude Depth” la zero sub prima opțiune „Extrude & Bevel”.

Acum aveți un plan izometric.

Pentru a vă juca mai bine cu forma, accesați Obiect > Extindeți aspectul.

Acest lucru vă va permite să schimbați culoarea avionului și să mutați liber punctele.

Îl vom numi „Efectul de extindere”.

2. Trasează fețele pentru insulă.

Pentru a crea cele trei fețe ale formei insulei, creați un pătrat și două dreptunghiuri alungite.

Repetați „Efectul izometric” pentru fiecare.

Pentru pasul doi, aplicați „Sus izometric”, „Stânga izometrică” și, respectiv, „Dreapta izometrică”.

3. Completați și colorați baza insulei.

Aplicați „Efectul de extindere” și colorați fiecare față cu diferite nuanțe de verde, cu cele mai strălucitoare întotdeauna deasupra.

4. Creați fețe de cub în perspectivă.

Aplicați „Efectul izometric” pe trei pătrate, cu izometric la stânga, sus și dreapta la pasul doi. Acest lucru vă oferă cele trei fețe de care veți avea nevoie pentru a obține un cub izometric.

Rețineți că fiecare obiect din ilustrația dvs. va folosi doar trei fețe. Aceasta este frumusețea perspectivei izometrice.

5. Compune un cub.

Eliberați formele cu „Efectul de extindere”, aduceți fețele împreună și aplicați trei nuanțe de gri pentru a simula iluminarea.

Sfat: Cea mai deschisă nuanță este întotdeauna deasupra; cel mai întunecat, la dreapta; iar tonul mijlociu, la stânga. Aplicarea acestui lucru pe fiecare formă din ilustrația dvs. va crea o impresie de lumină naturală.

6. Porniți baza copacului.

Urmați aceiași pași ca și cubul izometric și, de data aceasta, alungește fețele din stânga și din dreapta înainte de a conecta întregul.

Apoi aplica trei nuante de maro pentru a reprezenta lemnul.

7. Termină copacul.

Reduceți scoarța copacului; duplica un cub; și colorează-și fețele la fel ca forma pământului în verde.

8. Utilizați un cub pentru a crea blocurile de construcție

Duplicați un cub și colorați-l în roz pentru materialul de construcție.

Joacă-te cu scara; mutați punctele inferioare în jos pentru a crea o bază de turn; și reduceți-l pentru a crea un stâlp.

9. Asamblați turnurile.

Aliniați baza turnului și cubul roz.

Lăsați puțin spațiu între ele și poziționați trei stâlpi în acel spațiu.

Pentru o aliniere perfectă, asigurați-vă că setați „Snap to Point” și „Smart Guides” în opțiunea de meniu „View”.

10. Podul turnurilor.

Selectați punctul de sus și din dreapta dintr-un plan superior și faceți clic pe punctele cu planul echivalent din turnul geamăn.

Pur și simplu duplicați și redimensionați un plan din partea dreaptă pentru a crea o margine pentru podul turn.

11. Creați scări.

Copiați și lipiți trei fețe dintr-un turn; aliniați marginile pentru a crea un bloc; și apoi mutați punctele inferioare pentru a crea o treaptă cu o scară.

Duplicați și poziționați pașii de mai multe ori.

12. Închide scările.

Aliniați punctele din partea stângă pentru a închide golurile de pe scări.

13. Întoarce scările.

Selectați scările finalizate și utilizați „Instrumentul de reflectare (O)” pentru a crea un al doilea bloc care este orientat spre stânga.

Asigurați-vă că schimbați culorile fețelor din stânga și din dreapta pentru a respecta efectul de iluminare - nuanță mai închisă la dreapta, nuanță mijlocie la stânga și nuanță mai deschisă deasupra.

14. Leagă scările.

Atașați câteva cuburi la scări pentru a crea pietre de treaptă și legați-le de turnuri.

15. Creați un efect de adâncime a apei.

Duplicați și reduceți suprafața albastru deschis.

Așezați-l în diferite poziții și adăugați o nuanță și mai închisă de albastru pentru a finaliza efectul de adâncime a mării.

16. Începeți puntea folosind avioane existente

La fel ca în cazul scărilor și podului turn, începeți de la fețele existente, apoi aliniați corect punctele pentru a închide forma și terminați prin aplicarea de nuanțe de lemn maro.

17. Adăugați stâlpi pe punte.

Selectați scoarța copacului, apoi duplicați, reduceți și poziționați pentru a crea stâlpii punții.

Iată rezultatul final.

Puteți adăuga pete mai mari, întunecate pe mare, sau pătrate izometrice mai mici, colorate, pe planul insulei pentru a simula iarba și florile.

În general, distrează-te, mișcă lucrurile și construiește niște turnuri grozave, folosind blocurile simple pe care tocmai le-ai învățat.

În concluzie

După cum am văzut cu aceste trei ghiduri, nu aveți nevoie de multe abilități de desen pentru a crea niște ilustrații frumoase.

Tot ce trebuie să ții cont sunt aceste 3 principii:

• Începeți cu o idee sau un concept clar în minte - ce descrieți?
• Inspirați-vă cu lucrările de artă și stilurile existente - furați ca un artist.
• Observați și traduceți elemente complexe în forme geometrice de bază din care puteți lucra - păstrați-l simplu.

Distrați-vă creându-vă propriile ilustrații și încărcați noua piesă de artă în Dribbble și în alte locuri de pe web. Bucurați-vă!

• • •

Citiri suplimentare pe Blogul Toptal Design:

• eCommerce UX – O privire de ansamblu asupra celor mai bune practici (cu infografic)
• Importanța designului centrat pe om în proiectarea produsului
• Cele mai bune portofolii de designeri UX – Studii de caz și exemple inspiratoare
• Principii euristice pentru interfețele mobile
• Design anticipator: Cum să creați experiențe magice pentru utilizator