Share
Ce veți creaÎn tutorialul de astăzi, vom examina cu atenție procesul de creare a unui pachet de pictograme deosebit de interesant, deoarece vom ilustra câteva obiecte tradiționale românești care sunt definiția vie a ceea ce a fost "în casă" înaintea digitalului vârstă. Ca întotdeauna, vom folosi și vom abuza formele geometrice ale Illustratorului, în combinație cu unele instrumente de bază, cum ar fi panoul Align și Pathfinder.
Acestea fiind spuse, luați un lot de cafea proaspăt și să ne aruncăm în apă!
De asemenea, dacă doriți să extindeți proiectul, puteți să faceți acest lucru, îndreptându-vă spre GraphicRiver și verificând unele dintre pictogramele lor tematice la domiciliu.
Deoarece sper că aveți deja Illustrator în picioare în fundal, aduceți-o în sus și să organizăm o Document nou (Fișier> Nou sau Control-N) folosind următoarele setări:
Și de la Avansat fila:
De vreme ce vom crea pictogramele utilizând un flux de lucru pixel-perfect, vom dori să înființăm un pic frumos Grilă astfel încât să putem avea controlul total asupra formelor noastre.
Mergeți la Editați> Preferințe> Ghiduri și Grilă submeniu și ajustați următoarele setări:
Sfat rapid: puteți afla mai multe despre grile, citiți această lucrare detaliată despre modul în care funcționează sistemul Grid al Illustratorului.
Odată ce am creat grila noastră personalizată, tot ceea ce trebuie să facem pentru a ne asigura că formele noastre arată clar sunt permise Fixat la retea opțiune găsită în cadrul Vedere meniu, care se va transforma în Faceți clic pe Pixel de fiecare dată când intri Previzualizarea pixelilor mod.
Acum, dacă sunteți nou în întregul "flux de lucru pixel-perfect", vă recomand să vă prezentați modul de creare a tutorialului de artă perfectă pixel, care vă va ajuta să vă lărgi abilitățile tehnice în cel mai scurt timp.
Odată cu crearea noului document, ar fi o idee bună să ne structurăm proiectul folosind câteva straturi, deoarece astfel putem menține un flux de lucru constant concentrându-ne pe o pictogramă la un moment dat.
Acestea fiind spuse, ridicați straturi și creați un total de patru straturi, pe care le vom redenumi după cum urmează:
grilele de referință (sau grilele de bază) reprezintă un set de suprafețe de referință precis delimitate, care ne permit să construim icoanele noastre, concentrându-ne pe mărimea și consistența.
De obicei, dimensiunea grilelor determină mărimea icoanelor reale și ele ar trebui să fie întotdeauna prima decizie pe care o luați în momentul în care începeți un nou proiect, deoarece veți dori întotdeauna să începeți de la cea mai mică dimensiune posibilă și să vă dezvoltați.
Acum, în cazul nostru, vom crea un pachet de pictograme folosind doar o mărime, mai exact 128 x 128 px, care este destul de mare.
Începeți prin blocarea tuturor straturilor decât "grila de referință", apoi apucați Instrumentul dreptunghiular (M) și de a crea un 128 x 128 px portocale (# F15A24), care va ajuta la definirea dimensiunii generale a icoanelor noastre.
Adăugați un număr mai mic 120 x 120 px unu (#FFFFFF), care va acționa ca suprafață activă de desenare, oferindu-ne astfel totul 4 px umplutură.
Grupați cele două pătrate care compun grila de referință folosind Control-G comanda rapidă de la tastatură și apoi creați trei copii la o distanță de 40 px unul de celălalt, asigurându-vă că le aliniați la centrul artboard.
După ce ați terminat, blocați stratul curent și treceți la următorul, unde vom începe să lucrăm la prima noastră pictogramă.
Panta de flaut, cunoscută și sub denumirea de panpipes, este un instrument muzical simplu și totuși interesant datând tot drumul înapoi grecilor antice. Își ia numele de la Pan, zeul naturii și protectorul păstorilor. Numele în sine este un derivat al cuvântului "paein", care înseamnă "pășune", care este probabil motivul pentru care atât de multe culturi, inclusiv ale mele, au asociat instrumentul cu actul de herding.
Pentru mine, acest mic obiect are un înțeles special, deoarece reușește să mă ia înapoi într-un timp și un loc în care viața era mai simplă, iar acasă nu era vorba de loc, ci de cei care l-au făcut acasă.
Acum, fără a pierde mai mult timp, asigurați-vă că sunteți pe stratul potrivit (care ar fi cel de-al doilea) și să lăsăm să lansăm proiectul, recreându-l.
Începeți să lucrați la secțiunea superioară a pantei, creând un 8 x 6 px dreptunghi, pe care o vom folosi folosind culoarea # 899E47 și apoi aliniați la marginea superioară a zonei de desen activ, poziționându-l la o distanță de 4 px de la marginea superioară și 20 px din partea stângă.
Dați formă contur folosind Accident vascular cerebral metodă, prin crearea unei copii a acesteia (Control-C) pe care o vom lipi în față (Control-F) și apoi reglați prin schimbarea culorii # 2B3249 și apoi răsturnând-o Completati cu al ei; cu al lui Accident vascular cerebral (Shift-X). Seteaza Accident vascular cerebral„s Greutate la 4 px, selectând și grupând ambele forme împreună după aceea folosind Control-G Comanda rapidă de la tastatură.
Creați nouă copii ale formei pe care tocmai am grupat-o (Control-C> Control-F de nouă ori) și apoi le distribui pe orizontală pe partea dreaptă a originalului, folosind Alinia astfel încât contururile lor să se suprapună.
Creați conductele utilizând zece dreptunghiuri (# A8755A-a se vedea dimensiunile de mai jos) cu un 4 px grosime (# 2B3249), pe care o vom alătura pe orizontală una lângă cealaltă, gruparea (Control-G) și apoi poziționarea lor sub dreptunghiurile mai mici.
Adăugați un 8 px larg 4 px gros Accident vascular cerebral linie (# 2B3249) la prima, a patra și a șaptea secțiune inferioară a conductei, poziționându-l la o distanță de 2 px din contururile lor. După ce ați terminat, selectați și grupați toate formele pe care le-am utilizat până acum Control-G Comanda rapidă de la tastatură.
Creați secțiunea orizontală care ține toate conductele împreună folosind a 92 x 16 px dreptunghi (# CE9D78) cu 4 px grosime (# 2B3249), pe care o vom grupa (Control-G) și apoi aliniați centrul la țevi, poziționându-l la o distanță de 12 px de la marginea superioară a zonei de desen activ.
Începeți să adăugați detalii la secțiune din pasul anterior, prin crearea unei flori de centru utilizând opt 2 x 2 px cercuri (# 2B3249), pe care o vom poziționa în jurul alteia 2 x 2 px unu (2B3249). Odată ce le aveți la locul lor, nu uitați să selectați și să grupați (Control-G), astfel încât să nu se despartă de accident.
Sfat rapid: pentru pasul curent și următorul pas vă recomandăm să porniți Previzualizarea pixelilor mod (Alt-Control-Y), deoarece vă va oferi posibilitatea de a poziționa cu atenție fiecare cerc așa cum se vede în imaginea de referință. Odată ce ați terminat, ieșiți din modul apăsând Alt-Control-Y din nou.
Începeți să lucrați la modelul de undă decorativ stâng folosind câteva perechi 2 x 2 px cercuri (# 2B3249), pe care o vom poziționa așa cum se vede în imaginea de referință. După ce ați terminat, selectați și grupați (Control-G) toate cercurile împreună înainte de a trece la pasul următor.
Finalizați pictograma curentă prin adăugarea segmentului drept al modelului decorativ, utilizând o copie a aceluia din pasul anterior (Control-C> Control-F), pe care o vom poziționa pe partea opusă a florii, asigurându-ne că o reflectăm vertical când o avem (faceți clic dreapta> Transformați> Reflect> Vertical). După ce ați terminat, selectați și grupați (Control-G) modelul decorativ la secțiunea de bază, făcând același lucru pentru toate formele compoziției pictogramei după aceea.
A trăi într-o epocă digitală poate șterge cu adevărat unele dintre artele mai vechi de la minte, mai ales dacă acea persoană nu ia întâmpinat niciodată în viața reală. Cusutul, despre care se crede că a apărut înapoi în epoca de piatră, a fost și, în unele locuri, este încă o parte puternică a culturii și tradiției românești, deoarece a fost folosit ca un mijloc de decorare a casei și a hainelor și instrumente utilizate înapoi în cursul zilei.
Pentru mine personal, cusutul aduce inapoi atat de multe amintiri placute din copilarie, cand obisnuiam sa stau alaturi de bunica mea si sa ma uit ce petrece ore sa creeze picturi artistice frumoase pentru ao decora.
Acestea fiind spuse, să ne întoarcem la propria noastră artă, mai întâi asigurându-ne că suntem pe stratul potrivit (care ar fi cel de-al treilea) și apoi vom crea cea de-a doua pictogramă.
Începeți să lucrați la corpul principal al cadrului, creând o 106 x 106 pixeli cerc (# CE9D78) cu 4 px grosime (# 2B3249), pe care o vom grupa (Control-G) și apoi aliniați centrul la marginea de sus a zonei de desen activă.
Creați un număr mai mic 90 x 90 px cerc (# A8755A) cu 4 px grosime (# 2B3249), pe care o vom grupa (Control-G) și apoi aliniați centrul la cel din pasul anterior.
Adăugați pânza folosind a 78 x 78 px cerc (# EFD4C5) cu 4 px grosime (# 2B3249), pe care o vom grupa (Control-G) și apoi aliniați centrul la secțiunea anterioară. După ce ați terminat, selectați și grupați (Control-G) toate cele trei secțiuni împreună.
Începeți să lucrați la secțiunea inferioară a cadrului, creând conturul acesteia folosind a 20 x 18 px dreptunghi (# 2B3249), pe care le vom alinia la marginea inferioară a zonei active de desen, asigurându-vă că o trimitem în spatele cercurilor mai mari (faceți clic dreapta> Transformați> Aranjare> Trimitere înapoi).
Adăugați o secțiune de umplere utilizând o dimensiune mai mică 12 x 14 px dreptunghi (# CE9D78) pe care le vom centra aliniați la marginea superioară a formei create anterior.
Creaza un 18 px înalt 4 px gros Accident vascular cerebral linie (# 2B3249), pe care îl vom alinia la forma de la pasul anterior.
Începeți să lucrați la șurubul mic de strângere, creând corpul său principal folosind un a 44 px larg 4 px gros Accident vascular cerebral linie (# 2B3249), pe care o vom poziționa spre secțiunea inferioară a cadrului, lăsând a 2 px spațiul dintre acesta și conturul mai mare.
Adăugați capacul șurubului folosind o 8 x 8 px pătrate (# 2B3249), pe care le vom alinia la punctul de ancorare al corpului. După ce ați terminat, selectați și grupați (Control-G) cele două forme împreună, trimițându-le ulterior la spatele secțiunii de jos (faceți clic dreapta> Transformați> Aranjare> Trimitere înapoi).
Începeți să lucrați pe floarea decorativă reală, creând o secțiune centrală folosind patru 2 x 2 px pătrate (# 2B3249) pe care o vom poziționa astfel încât să ajungă să formeze un semn plus. Grup (Control-G) forme și apoi centrale aliniați-le la pânză.
Porniți Previzualizarea pixelilor mod (Alt-Control-Y) și creați secțiunea superioară a petalei de sus a stângii, folosind trei seturi de patru 2 x 2 px pătrate (# E56F5C) pe care o vom poziționa una lângă alta, împingând fiecare set 2 px astfel încât să ajungă să formeze un set de scări. Grup (Control-G) și apoi poziționați-le pe partea stângă a semnului plus, asigurându-vă că părăsiți a 2 px între ele.
Creați o copie a secțiunii din pasul anterior (Control-C> Control-F), pe care o vom roti (clic dreapta> Transformare> Rotire> 90º) și apoi să reflecte orizontal (clic dreapta> Transformare> Reflect> Orizontal), poziționând forma rezultată sub original.
Dați petalei un contur, adăugând câteva 2 x 2 px pătrate (# 2B3249) în jurul celor două secțiuni de compunere, asigurându-vă că selectați și grupați (Control-G) toate împreună odată ce ați terminat.
Creați celelalte petale utilizând trei copii (Control-C> Control-F de trei ori) din cel pe care tocmai am terminat să lucrăm, pe care o vom poziționa în jurul centrului plus semnul, reflectându-i după cum este necesar.
Continuați să adăugați detalii la floare prin crearea a patru copii (Control-C> Control-F de patru ori) din semnul său central plus, pe care o vom poziționa pe marginea exterioară a spațiului dintre fiecare pereche de petale.
Finalizați flori, și cu ea icoana în sine, prin adăugarea de linii diagonale la fiecare dintre petalele sale, folosind patru seturi de 2 x 2 px pătrate (# 2B3249). După ce ați terminat, selectați și grupați (Control-G) toate formele de compoziție ale floarelor, făcând același lucru pentru întreaga icoană după aceea.
Suntem acum la cea de-a treia și ultima noastră icoană, care este compusă dintr-un set de linguri tradiționale lucrate manual, care reprezintă un alt mijloc puternic de exprimare a minții poporului român, folosit nu numai pentru decorarea, ci și ca instrument în gospodăriile lor.
Nici măcar nu voi vorbi prea mult despre această formă de artă, deoarece sper într-adevăr că prin crearea acestei mici icoane veți obține o curiozitate suficient de puternică pentru a căuta mai multe informații despre ea.
Acestea fiind spuse, asigurați-vă că sunteți pe stratul potrivit (care ar fi cel de-al patrulea) și să terminăm acest lucru.
Începeți să lucrați la prima lingură, creând o 8 x 8 px cerc (# D3685E) cu 4 px grosime (# 2B3249), pe care o vom grupa (Control-G) și apoi poziția la o distanță de 16 px din marginea din stânga a zonei de desen activă, asigurându-vă că o aliniați la marginea superioară a acesteia după aceea.
Creați un pic mai mare 12 x 12 px cerc (# CE9D78) cu 4 px grosime (# 2B3249) pe care vom adăuga un altul 4 x 4 px cerc (# 2B3249). Grup (Control-G) toate cele trei forme împreună, apoi poziționați-le sub secțiunea anterioară.
Creați primul set de petale din lingură folosind două 10 x 10 px dreptunghiuri (# CE9D78), pe care o vom regla prin setarea Rază din colțurile lor exterioare inferioare 8 px și cele superioare ale lor interioare 4 px din interiorul Transforma panoul Dreptunghi Proprietăți. Dați formei rezultate a 4 px grosime (# 2B3249), gruparea individuală (Control-G) fiecare petală și apoi poziționați-o sub secțiunea anterioară.
Creați restul de petale folosind trei copii (Control-C > Control-F de trei ori) dintre cele pe care le avem deja, așezându-le vertical sub ele.
Reglați culoarea câtorva dintre petale selectându-le cu atenție folosind Instrumentul de selecție directă (A) și apoi modificarea culorii la # A8755A.
Creați o copie (Control-C> Control-F) a două secțiuni circulare ale lingurii, pe care o vom poziționa sub petalele sale, asigurându-ne că le reflectăm orizontal (clic dreapta> Transformare> Reflect> Orizontal) și schimbați culoarea formei de umplere mai mare la # A8755A.
Creați secțiunea de conectare a bolului mic la mânerul lingoului folosind un 8 x 16 px dreptunghi (# A8755A) (1), pe care o vom regla prin adăugarea unei perechi de puncte de ancorare laterale la o distanță de 4 px de la marginea superioară folosind Adăugați un instrument de ancorare (+) (2).
Apoi, selectați individual și împingeți ancorele superioare ale formei spre interior cu o distanță de 2 px (faceți clic dreapta> Transformați> mutați> orizontal> +/- 4 px în funcție de ce parte începeți) (3) dând forma rezultată a 4 px grosime (# 2B3249) (4).
Adăugați două 8 px larg 2 px gros Accident vascular cerebral linii (# 2B3249) stivuite vertical 3 px unul de altul, gruparea (Control-G) și apoi poziționați secțiunea curentă sub cercul mai mic.
Finalizați lingura creând castronul folosind o 16 x 16 px cerc (# CE9D78), pe care o vom regla prin selectarea și împingerea punctului de ancorare inferior în jos cu o distanță de 6 px (Click dreapta > Transformare> Mutare> Vertical> 6 px). Dați forma rezultată a 4 px grosime (# 2B3249), gruparea (Control-G) și apoi poziționarea celor două forme pe secțiunea anterioară. După ce ați terminat, selectați și grupați (Control-G) toate compoziția lingurii formează împreună, înainte de a trece la următoarea.
Începeți să lucrați la a doua lingură a pictogramei, creând un 8 x 20 px dreptunghi (# A8755A) pe care o vom regla prin setarea Rază din colțurile sale de sus 4 px din interiorul Transforma panoul Dreptunghi Proprietăți. Dați forma rezultată a 4 px grosime (# 2B3249) urmat de trei 2 x 2 px cercuri (# 2B3249) stivuite vertical 2 px unul de altul, gruparea (Control-G) și apoi poziționarea formelor pe partea dreaptă a primei linguri, la o distanță de 24 px.
Adăugați secțiunea circulară utilizând a 12 x 12 px cerc (# A8755A) cu 4 px contur (# 2B3249) peste care vom adăuga un număr mai mic 4 x 4 px cerc (# 2B3249), gruparea (Control-G) și apoi poziționarea formelor sub secțiunea creată anterior, astfel încât acestea să se suprapună ușor.
Creeaza o 12 x 16 px dreptunghi (# CE9D78) pe care o vom transforma într-un diamant prin adăugarea unui nou punct de ancorare în centrul fiecărei margini folosind Adăugați un instrument de ancorare (+), îndepărtând colțurile după aceea folosind Ștergeți instrumentul pentru punctul de ancorare (-). Dați forma rezultată a 4 px grosime (# 2B3249), gruparea (Control-G) și apoi poziționându-i ambii la partea din spate a secțiunii circulare (faceți clic dreapta> Transformați> Aranjare> Trimitere înapoi).
Creați două 8 x 8 px cercuri (# 899E47) cu 4 px grosime (# 2B3249), gruparea individuală (Control-G) și apoi poziționându-le pe fiecare parte a secțiunii superioare a diamantului.
Începeți să lucrați pe corpul principal al lingoului, creând un 8 x 10 px dreptunghi (# A8755A), urmată de un număr mai mare 12 x 34 px unu (# A8755A), pe care o vom uni și apoi vom poziționa sub secțiunile anterioare.
Reglați forma prin setarea Rază din colțurile sale de sus 4 px, adăugând o pereche de puncte de ancorare laterale la o distanță de 14 px de la marginea de jos. Apoi, selectați individual și împingeți punctele inferioare de ancorare spre interior cu o distanță de 4 px (faceți clic dreapta> Transformați> mutați> orizontal> +/- 4 px în funcție de ce parte începeți).
Creați secțiunea brichetă a corpului folosind a 12 x 12 px pătrate (# CE9D78) pe care le vom centra aliniați la forma mai mare, poziționându-l la o distanță de 15 px de la marginea superioară.
Dați corpului mai mare a 4 px grosime (# 2B3249), urmat de cinci 12 px larg 2 px gros Accident vascular cerebral linii (# 2B3249) stivuite vertical 3 px una de alta, pe care o vom grupa (Control-G) și apoi aliniați centrul la dreptunghiul mai deschis al secțiunii.
Adăugați două perechi de două 2 x 2 px cercuri (# 2B3249) stivuite vertical 2 px unul de celălalt, poziționând unul pe partea superioară a corpului și celălalt pe partea inferioară. Odată ce ați terminat, selectați și grupați împreună toate formele de compunere ale secțiunii curente folosind Control-G Comanda rapidă de la tastatură.
Adăugați un 8 x 8 px cerc (# 899E47) cu 4 px grosime (# 2B3249), pe care o vom grupa (Control-G) și apoi poziția deasupra secțiunii anterioare, la o distanță de 22 px din marginea inferioară a zonei de desen activ.
Finalizați lingura, adăugând castronul utilizând o 16 x 22 px elipsă (# A8755A) cu 4 px grosime (# 2B3249), pe care o vom grupa (Control-G) și apoi poziția de sub cercul mai mic. După ce ați terminat, selectați și grupați (Control-G), toate secțiunile sale de compunere împreună, de asemenea, înainte de a trece la a treia și ultima lingură.
Începeți să lucrați la a treia lingură, creând o 12 x 16 px elipsă (# CE9D78) cu 4 px grosime (# 2B3249) pe care vom adăuga a 4 x 4 px cerc (# 2B3249), gruparea (Control-G) și apoi poziționarea celor trei forme la o distanță de 20 px de la marginea din dreapta a doua lingură.
Creaza un 8 x 8 px cerc (# CE9D78) cu 4 px grosime (# 2B3249) pe care o vom grupa (Control-G) și apoi poziția de sub secțiunea anterioară, la o distanță de doar 3 px.
Creați încă două 8 x 8 px cercuri (# D3685E) cu 4 px grosime (# 2B3249), pe care o vom grupa în mod individual (Control-G) și apoi poziționați pe părțile laterale ale celor două secțiuni pe care le avem până acum.
Creați un pic mai mare 12 x 12 px cerc (# A8755A) cu 4 px grosime (# 2B3249) pe care vom adăuga a 4 x 4 px cerc (# 2B3249). Grup (Control-G) toate cele trei forme împreună și apoi poziționați-le sub secțiunea circulară mai mică.
Începeți să lucrați pe floarea lingoului, creându-i petalele folosind patru 10 x 10 px pătrate (# CE9D78), pe care o vom regla prin setarea Rază din două colțuri 6 px din interiorul Transforma panoul Dreptunghi Proprietăți. Dați formei rezultate a 4 px grosime (# 2B3249), apoi poziționați-le puțin peste secțiunea anterioară, selectând și grupând (Control-G) toate cele patru împreună.
Modificați culoarea petalelor din stânga și din dreapta de sus la # A8755A, și apoi adăugați un 8 x 8 px cerc (# D3685E) cu 4 px grosime (# 2B3249) în centrul lor, grupându-le pe toate apoi împreună folosind Control-G Comanda rapidă de la tastatură.
Creați o copie (Control-C> Control-F) din secțiunea circulară aflată deasupra floarei lingurii și poziționați-o sub ea, asigurându-vă că schimbați culoarea formei de umplere a acesteia # CE9D78.
Creați corpul inferior al lingoului cu ajutorul a 20 x 32 px dreptunghi (# A8755A), din partea de jos a cărora vom elimina două 14 x 24 px elipse (evidențiate cu roșu) folosind deschizător de drumuri„s Minus Mode Shape Mode. După ce ați terminat, poziționați forma rezultată sub secțiunea anterioară.
Seteaza Rază a colțurilor de vârf ale formei rezultate 10 px (2), adăugând o brichetă 20 x 12 px dreptunghi (# CE9D78) pe care o vom poziționa la o distanță de 6 px de la marginea superioară (3). Apoi, adăugați cinci 20 px larg 2 px gros Accident vascular cerebral linii (# 2B3249) stivuite vertical 3 px una de alta, pe care o vom grupa (Control-G) și apoi aliniați centrul la centrul mai mic al formei (4).
Adauga o 4 x 4 px cerc (# 2B3249) în partea superioară a formei mai mari (5), urmată de a 4 px grosime (# 2B3249) (6), selectarea și gruparea (Control-G) toate formele împreună după aceea.
Finalizați lingura, și cu ea icoana în sine, adăugând micul bol cu ajutorul unui a 16 x 22 px dreptunghi (# CE9D78) pe care o vom regla prin setarea Rază din colțurile sale de sus 8 px din interiorul Transforma panoul Dreptunghi Proprietăți. Dați forma re
Accentsconagua