O altă dimensiune, o nouă măiestrie – Un tutorial de ilustrare izometrică

Ilustrația este de neegalat în capacitatea sa de a energiza subiectele obișnuite și de a comunica idei complexe cu claritate vizuală, dar cum rămâne cu ilustrațiile izometrice? Nu sunt ele notoriu dificile și consumatoare de timp? În șase pași simpli, acest tutorial de ilustrare izometrică face procesul rapid și necomplicat.

Trebuie să animați o pagină de destinație? Vizualizați date plictisitoare? Adăugați pumn la ambalaj fade? Ilustrația este răspunsul pe toate fronturile.

În ultimii ani, ilustrațiile izometrice au câștigat popularitate pentru modul în care reprezintă adâncimea tridimensională în spațiul bidimensional. În plus, grila izometrică neagă nevoia de a menține iluzia de perspectivă, o sursă comună de frustrare ilustrativă.

În Adobe Illustrator, procesul tradițional de ilustrare izometrică este plictisitor. Faceți o grilă izometrică, desenați un pătrat, înclinați-l cu -30°, rotiți-l cu -30°, mai departe. Din fericire, există o cale mai bună. Illustrator are efecte 3D care fac ilustrațiile izometrice rapide și ușoare: „Extrudare și teșire”, „Rotire” și „Rotire”.

Acest tutorial demonstrează cum să creați ilustrații izometrice folosind „Revolve”, dar informațiile se aplică și efectelor 3D rămase din Illustrator.

Ești gata să impresionezi clienții, să încânți utilizatorii și să înveți secretele ilustrației izometrice?

Revolve & Refine: Un tutorial de ilustrare izometrică

Cui nu îi place o băutură rece ca gheață? Să prăjim bucuriile răcoritoarelor lichide prin proiectarea unei sticle izometrice cu o etichetă.

*Sfat profesional: înainte de a începe, găsiți o referință de obiect pentru a informa cum va arăta sticla.

Pasul #1: Desenați sticla și lichidul

1.1) Creați un nou document Adobe Illustrator.

1.2) Adăugați referința sticlei în document.

1.3) Desenați un contur al sticlei și al lichidului din interior.

1.4) Împărțiți sticla și lichidul în jumătate (după cum se vede mai jos).

1.5) Grosimea cursei conturului sticlei definește grosimea sticlei.

*Sfat profesional: copiați și inserați opera de artă în afara panoului de grafică ca rezervă.

Pasul #2: Aplicați efectul Revolve

După cum sugerează și numele, „Revolve” întoarce forma în jurul axei sale. În Illustrator, poziția axei „Revolve” este fixă ​​vertical. Acesta este motivul pentru care sticla a fost conturată și împărțită în jumătate.

* Sfat profesional: Nici conturul sticlei, nici obiectul lichid nu ar trebui să aibă degrade ca culori de umplere.

2.1) Pentru a găsi efectul „Revolve”, accesați: Effect > 3D > Revolve...

2.2) În partea de sus a ferestrei de dialog, există un câmp etichetat „Poziție”. Alegeți „Stânga izometrică”.

2.3) Unghi – Acesta este gradul de rotație în jurul axei obiectului. Dacă se setează la 180°, rezultatul va fi o sticlă împărțită vertical în jumătate. Setați unghiul la 360° pentru o sticlă complet rotită.

2.4) Offset – Controlează distanța de offset față de axa verticală a obiectului. Introduceți „0”.

2.5) Suprafață – Setați materialul și proprietățile de iluminare ale obiectului. Alegeți „Fără umbrire”.

Ta-da! O sticlă izometrică cu lichid. Este timpul să vă relaxați, să vă relaxați și să așteptați! Sticla aceea are nevoie de o etichetă.

* Sfat profesional: nu utilizați funcția „Extindeți aspectul” de pe sticlă până când nu este creată eticheta.

Pasul 3: Pregătiți eticheta

3.1) Utilizați sticla pentru a defini dimensiunile etichetei.

3.2) În imaginea exemplu (mai jos), înălțimea etichetei corpului este aparentă, dar înălțimea etichetei gâtului nu este clară, deoarece suprafața nu este paralelă cu axa. O înălțime aproximativă va fi suficientă.

3.3) Lungimea etichetei este calculată folosind formula circumferinței cercului 2πr.

3.4) Cu o etichetă proiectată satisfăcător, convertiți ambele etichete în simboluri. Paleta „Simboluri” se găsește sub: Fereastra > Simboluri

3.5) Trageți și plasați individual desenele de etichetă în paletă pentru a crea simboluri.

*Notă: simbolurile din Illustrator și Sketch funcționează în mod similar.

Pasul #4: Hartați eticheta pe sticlă

Atâta timp cât sticla nu a fost vectorizată folosind funcția „Extindeți aspectul”, aceasta este complet editabilă.

4.1) Selectați sticla și afișați paleta „Aspect”: Fereastra > Aspect

4.2) Apoi, alegeți „3D Revolve” și apare caseta de dialog de mai devreme.

4.3) Pentru a mapa designul pe sticlă, faceți clic pe opțiunea din stânga jos: „Artă hărții”.

4.4) Acest lucru face posibilă alegerea și ajustarea unui simbol pentru sticlă.

4.5) Asigurați-vă că potriviți simbolul cu suprafața corectă (vezi mai jos).

4.6) Faceți clic pe „Scale to Fit”, iar eticheta se apropie de sticlă.

4.7) Urmați aceiași pași pentru eticheta gâtului.

Pasul #5: Evitați un fișier dezordonat

5.1) Acum, este timpul să transformați sticla în curbe Bezier folosind funcția „Expand Appearance”: Obiect > Extindeți aspect

Illustrator nu este destinat în principal manipulării obiectelor 3D. Extinderea aspectului unui obiect creează o colecție grupată de elemente mai mici care dau iluzia unui obiect 3D.

5.2) Pentru a menține lucrurile în ordine, combinați elementele cu instrumentul „Pathfinder” sau „Shape Builder” (vezi mai jos).

* Sfat profesional: alăturarea obiectelor creează puncte de ancorare nedorite. Reduceți-le accesând Obiect > Cale > Simplificare. Pentru cei care folosesc Illustrator în mod regulat, pluginul VectorScribe și instrumentul său de eliminare a punctelor sunt foarte recomandate.

Pasul 6: Adaugă viață cu culori și degrade

Pentru pasul final, aduceți sticla la viață cu culori și degrade. Aici intervine arta individuală. Adaugă reflexii, lumini și umbre pentru un aspect realist sau folosește linii și o paletă de culori simplificată pentru o atmosferă mai grafică. Cu o bază solidă, posibilitățile stilistice sunt nesfârșite.

Noroc pentru ilustrațiile izometrice!

Ilustrațiile izometrice aduc profunzime, dimensionalitate și personalitate unei game largi de proiecte de design. Utilizați principiile prezentate în acest tutorial pentru a explora mai multe posibilități izometrice și nu uitați să încercați și celelalte efecte 3D ale Illustrator: „Rotire” și „Extrudare și teșire”.

Spune-ne ce crezi! Vă rugăm să lăsați mai jos gândurile, comentariile și feedback-ul dvs.

• • •

Citiri suplimentare pe Blogul Toptal Design:

• Perioada de valabilitate vizuală – De ce ilustrațiile de design web devin învechite
• Un ghid pas cu pas pentru proiectarea ilustrațiilor personalizate fără abilități de desen
• Noi realități: VR, AR, MR și viitorul designului
• The Designer's Edge – O prezentare generală a pluginurilor Photoshop
• Evoluție emoji: proiectare pentru noua față a mesajelor