În cazul în care pictograma va fi folosită pe ecran. Dacă faceți imediat un raster, atunci când scalați liniile se vor estompa și nu se vor mai încadra în pixeli. Dar nu are rost să desenați altundeva: oricum, apoi importați-l în aspect în Photoshop.

Să începem cu faptul că problema cursei „moale” este rezolvată de setările de contur:

Acum poți desena ceva. Am nevoie doar de o pictogramă de ziar.

Mai întâi studiez obiectul înfățișat. Google sugerează proporțiile:

Remarc caracteristicile pe ceea ce este la îndemână:

Voi lua ca exemplu prima pagină din arhivă. NY Times. Am ajustat imediat dimensiunea pentru a se potrivi cu alte pictograme. Ceea ce este important aici este greutatea vizuală, nu parametrii matematici:

Pentru ca punctele de ancorare să se lipească de grila de pixeli, trebuie să bifați caseta de aici:

cmd+k

Pentru liniile de obiecte rotite la un unghi care nu este un multiplu de 45°, lipirea de grilă poate fi dăunătoare, astfel încât cheile și [k] se pot uza rapid :-)

Este deja clar că ziarul se dovedește a fi „mai greu” decât alte obiecte. il reduc putin:

La scalare, punctele de ancorare ies din grila de pixeli. Le introduc înapoi acolo unde este nevoie.

Adaug detalii. Verific dacă cele 6 coloane sunt stivuite astfel încât marginile ziarului să fie egale (am aflat accidental că da. Altfel ar fi trebuit să fac ziarul cu un pixel mai lat.)

Aici liniile se lipesc între ele în mod dezgustător, formând o pată întunecată. Când este mărit, acesta nu este vizibil, dar în captura de ecran anterioară vă atrage imediat atenția:

Acum numele. În pictogramele mele, toate liniile au aceeași grosime, așa că nu îmi pot permite să desenez o linie groasă în loc de titlu. Schiț rapid literele, ignorând detaliile:

reduc la dimensiunea potrivităși am pus fiecare literă într-o grilă de pixeli:

Completez ziarul:

Aproape gata. Sunt confuz de cantitatea de cerneală. Icoana s-a dovedit a fi mult mai densă decât vecinii săi. Descarc liniile, scot Titanic-ul.

Ziarul este rulat în partea de jos. Pentru a spori acest efect, aveți nevoie de o umbră. Dar nu puteți folosi o umbră, așa că am venit cu un truc inteligent - am așezat liniile de jos mai aproape de marginea ziarului, astfel încât lângă margine densitatea liniilor să crească, creând o întunecare aparentă.

Sincer să fiu, chiar îmi place așa:

Mă voi gândi în continuare ce opțiune să aleg. Asta e tot pentru azi.

Băieții cu experiență pot evita deloc schițele, dar își fac o listă de imagini și lucrează imediat cu variații.

Dacă desenați pictograme la comandă, desenați schițe, astfel încât să puteți evita munca inutilă atunci când desenați, arătând mai întâi imaginile clientului.

Pasul patru: dimensiune

Acesta este, în general, cel mai important lucru: să decideți asupra dimensiunii minime.
Pentru ce este? Dacă doriți ca pictogramele dvs. să aibă muchii ascuțite, pixeli perfecti și să fie scalate corect, trebuie să decideți asupra dimensiunii și grosimii obiectelor în sine. mărime mică(x1). Recomand să utilizați dimensiuni egale pentru pictograme.

Pasul cinci: Proces

Creați un document cu valori

Unde Spațiere este distanța dintre panourile de artă.

Lățimea și înălțimea - înălțimea și lățimea mesei de artă.

Efecte raster — rezoluție (ppi) potrivit pentru icoane 72

Aliniați noi obiecte... - această casetă de selectare este responsabilă pentru legarea punctelor la grila de pixeli. Vă sfătuiesc să-l porniți, dar în timpul lucrului, îl puteți opri oricând.

1. Selectați prima planșă de artă, va face toate pictogramele, iar cele terminate vor fi inserate pe planurile de artă adiacente.
2. Creați un pătrat care să se potrivească Zona de lucru.
3. Configurați ghiduri pentru a ușura procesul de desen.
4. Utilizare Previzualizare pixeli
5. Marcați pictogramele gata făcute în lista de imagini, astfel încât să vă puteți monitoriza în mod clar progresul.
6. Urmați sfaturile și articolul anterior despre.
7. Nu face primul set prea mare, s-ar putea să obosești repede și să renunți la jumătatea drumului. Viteza normală va fi de aproximativ 20 de pictograme pe zi, apoi pot deveni rapid plictisitoare...
8. Proiectați fișierul sursă și nu uitați să puneți lucrurile în ordine în straturi, pregătiți un fișier pentru Photoshop și schițați, de exemplu.
9. Pregătește o lovitură pentru dribling și behance, creează un post pentru retele sociale. Acesta este cel mai bun PR pentru munca și accesul la comenzi noi. Nu uitați de hashtag-uri: #design #best #mamalubitmenya #kupiteikonky

Unde se vinde:

graphicriver.net este o platformă gratuită pentru tranzacționarea oricărui conținut digital.

creativemarket.com  - pentru a crea un cont aici vi se va cere să afișați conturi în alte magazine și în portofoliul dvs.

thenounproject.com  — site-ul este probabil cu cea mai mare bază de date de pictograme, oferă o alegere: fie gratuit, fie pentru o singură plată, există și funcție de abonament lunar, dar nu aș paria pe acest serviciu dacă vrei să faci bani .

icons8.com  - Nu știu nimic despre acest magazin, dacă cineva are experiență, împărtășește-o în comentarii.

Cum să desenezi pictograme Warface

Cum să desenezi pictograme Warface

În această lecție vom învăța cum să desenăm pictograme din jocul Warface. Primul va fi logo-ul jocului în sine, al doilea o pictogramă pentru realizări.

1.Iată sigla. Da, pentru cei care nu știu, pozele sunt mărite.

Trebuie să desenați un dreptunghi. Facem asta: trageți o linie dreaptă, împărțiți-o în jumătate (aruncați o linie verticală în jos), măsurați această jumătate în jos de la punctele extreme și încă puțin, trageți o linie orizontală, apoi faceți un pas înapoi - acesta va fi mijlocul dreptunghiul (marcat cu o linie dreaptă mică). Desenați două linii drepte cu ochiul (am o indentație din partea de sus și de jos a dreptunghiului, respectiv), dar distanța de la mijloc din dreapta și din stânga ar trebui să fie aceeași. Nu trebuie să faci toate acestea, ci să le desenezi cu ochiul.

Desenăm partea de mijloc, linii diagonale pe lateral, vom avea nevoie de ele pentru desenul ulterioară.

Ștergem toate liniile auxiliare, lăsând doar la mijloc și desenăm mai departe.

Puteți picta în mod primitiv peste pictogramă în acest fel.

2. Pictograma, rezoluția sa este foarte mică. Am vrut să fac mai multe icoane, dar sunt atât de mici, este foarte greu să vezi detaliile, așa că avem ce avem. Sa incepem.

Desenați un cerc și linii directoare, apoi forma capului. Liniile unui leu sunt aspre și drepte. Desenați trăsăturile feței și ștergeți cercul.

Desenăm dinții, limba și liniile drepte care se extind din cap.

Desenăm coama, dacă sunt trase linii subțiri, atunci o desenați și abia vizibilă.

Iată ce ar trebui să obținem:

Pictogramele sunt o parte importantă a designului interactiv și web. Deși icoanele sunt mici, pot fi foarte dificil de creat. În tutorialul de astăzi vom demonstra cum să creați o pictogramă de folder folosind diferite formeși reflexe în Photoshop. Să începem!

Pasul 1 - Fișier nou/ Tehnica penelor
Deschide Photoshop și creează document nou(Ctrl + N). Utilizare următoarele setări:
Rezoluție: 72 dpi
Modul color: Culoare RGB
Dimensiuni: 600 × 600 pixeli

Creați următoarea formă folosind instrumentul PixInstrument(P) (Pene). Culoare: #3da1e2

Pasul 2 - Crearea formelor folosind stiloul
A desena înapoi foldere folosind Instrument stilou(Pen) folosind aceeași tehnică de desen. Apoi trageți o dungă așa cum se arată în imagine.
Culoare: #003658 #3da1e2 #08517e

Pasul 3 - Terminați forma
După ce ați terminat de desenat folderul, trebuie să adăugați o bucată de hârtie și o săgeată, așa cum se arată în imagine. Acum ar trebui să aveți 5 straturi. Fiecare formular va fi activat strat separat. Dați fiecărui strat un nume.
Culoare: #ffffff #32e732

Pasul 4 - Adăugarea efecte de culoare
Adăugați următoarele stiluri de straturi în partea din față a folderului. Reduceți opacitatea la 90%.

Adăugați următoarele stiluri de straturi pentru hârtie. Reduceți opacitatea stratului la aproximativ 90-95%.

Adăugați următoarele stiluri de straturi pentru dungă.

Adăugați următoarele stiluri de straturi în spatele folderului.

Adăugați următoarele stiluri de strat pentru săgeată.

Acum pictograma ta arată așa.

Pasul 5 - Adăugarea reflexelor
Adăuga grup nou numite „Reflexe”. Utilizare Instrument stilou(Pen) pentru a desena reflexia așa cum se arată în imagine. Asigurați-vă că desenați doar conturul și nu forma. După ce ați închis calea, faceți clic Click dreapta mouse-ul peste zona de lucru și selectați face selecția(Creează o selecție) (penă 0). Luați o pensulă mare (diametru aproximativ 470, duritate 0) și vopsiți peste partea dreapta selecție, ca în imagine, pentru a crea o reflexie albă. Schimbați modul de amestecare la Acoperire(Suprapunere) și reduceți opacitatea la 63%.

Pasul 6 - Margini
Creați un grup nou numit „Margini”, creați strat nouîn el (Ctrl + Shift + N sau faceți clic pe pictograma Creați un nou strat). Adăugarea de evidențieri la margini oferă pictogramei un efect 3D. Utilizare Instrument stilou(Pen) pentru a crea linii de contur în jurul colțurilor și a tuturor marginilor folderului, hârtiei și săgeților. Apoi faceți clic dreapta pe spațiul de lucru și selectați Calea cursei(Accident vascular cerebral) - Perie(Perie). Setările pensulei ar trebui modificate în avans, diametrul principal 8 pixeli și duritatea 0.

Etapa7 - Umbre
Creați un nou strat (Ctrl + Shift + N) pentru umbre și plasați-l într-un nou grup (Ctrl + G). Faceți o selecție așa cum ați făcut la pasul 5 pentru a crea reflexiile. Completați selecția cu negru și apoi estompați marginile cu instrumentul Instrument de estompare(Estompa). Dacă umbrele par prea întunecate, reduceți opacitatea stratului la 40%.

Pasul 8 - Adăugarea textului
Adăugați text folosind orice font doriți. Am ales „Agenția FB”. Dimensiunea fontului: 40, opacitatea stratului: 75%.

Pasul 9 - Adăugarea finală reflexe și umbre
Adăugați mai multe reflexii pe hârtie folosind aceleași metode ca la Pasul 5.

Adăugați umbră folosind Instrumentul Elipse(E) (Elipsă). Desenați o elipsă așa cum se arată în imagine și adăugați câteva Filtru -Estompa-Neclaritate de miscare(Filtru - Blur - Motion Blur). Reduceți opacitatea după bunul plac.

Vizionare finală
Sper că v-a plăcut acest tutorial. Am adăugat câteva pictograme suplimentare pe care le-am creat folosind aceleași tehnici.

Mulți oameni nu iau în serios editorii de pictograme online, dar, de fapt, astfel de instrumente facilitează foarte mult fluxul de lucru. Doar câteva clicuri vă pot economisi ore de căutare, de navigare sau de dezvoltare. În plus, nu are rost să le folosim pe cele cu drepturi depline atunci când sunt disponibile servicii speciale cu funcții personalizate pentru aceste sarcini specifice.

Site-urile editorului de pictograme ca acestea sunt foarte eficiente. Ele vă permit:

• creați ușor și rapid materiale noi;
• oferiți dezvoltărilor existente un aspect finit;
• salvați rezultatul în diferite formate(SVG, ICO și PNG);
• creați pictograme pentru .

În acest articol, am selectat cele mai bune cinci editori de pictograme gratuite online și, pentru comparație, am încercat să creăm un set în fiecare dintre ele.

IconsFlow

IconsFlow.com - pictograme vectoriale + editor care vă permite să creați seturi personalizate și să le exportați calitate bună(SVG, ICO și PNG). Principalul avantaj al serviciului este prezența a doi editori:

• cea principală, în care sunt selectate paleta, stilul, efectele;
• Editor de formulare, unde puteți modifica forma curentă sau puteți desena una nouă.

Dacă ați creat deja pictograme în Illustrator, descărcați fișierele SVG și experimentați medii diferite. În IconsFlow există anumite restricții la utilizare gratuită, așa că asigurați-vă că vă familiarizați cu ele înainte de a începe. Există lecții și o secțiune de ajutor pentru utilizatorii începători și, de asemenea, este posibil să lucrați în editorul de pictograme în limba rusă.

Vedere a editorului de vectori IconsFlow:

Exemple de lucru:

FlatIcons

Cu FlatIcons.net vă puteți crea propria pictogramă plată (în stil plat) bazat șabloane gata făcute. Setați dimensiunile, alegeți un model și fundalul principal (cercuri, inele, dreptunghiuri), schimbați culoarea. Acest editor de pictograme este gratuit, dar are două dezavantaje:

• În primul rând, puteți descărca fișiere numai în format PNG.
• În al doilea rând, va trebui să creați fiecare obiect separat, deoarece... Este imposibil să dezvoltați un întreg set deodată.

În ciuda faptului că vârful popularității a trecut deja, mulți oameni le folosesc în design-ul lor. De exemplu, dezvoltatorii vă permit să descărcați set gratuit icoane sociale plate. Rezultatul lucrului în editorul FlatIcons:

Launcher Icon Generator

Proiectul Launcher Icon Generator este gratuit și credem că este mai potrivit pentru utilizatorii avansați. Acest editor de pictograme online vă permite să încărcați imagini/cliparturi și să adăugați text. Puteți descărca câte o pictogramă odată în 5 dimensiuni (48 x 48; 72 x 72; 96 x 96; 144 x 144; 192 x 192).

Un set de grafică în Stilul material Design de la GitHub. Serviciul conține setări precum: umplutură, formă, culoare de fundal sau transparență, scalare + efecte suplimentare. Rezultat:

Android Material Icon Generator este un alt instrument pentru crearea pictogramelor plate. Punctul culminant al serviciului este cu siguranță efectul sub forma unei umbre lungi. Dacă aveți nevoie de soluții similare, acest editor de pictograme va fi o opțiune ideală.

Începeți prin a alege o imagine din galerie, apoi determinați culoarea, forma fundal(cerc sau pătrat), lungimea umbrei, saturație, atenuare - și pictograma dvs. este gata. Totul este extrem de simplu. Pentru uz personal site-ul este complet gratuit.

După descărcare, veți găsi 6 PNG-uri în fișierul de arhivă marimi diferiteși vector fișier SVG. Pictograma SVG va fi neclară în Illustrator, dar, din fericire, arată bine în browser. Rezultatul final este ceva de genul:

Site-ul Simunity este un generator HTML5 unde puteți crea o pictogramă și apoi copiați codul pentru a-l afișa în proiectele dvs. web. Pictogramele din Font Awesome sunt folosite ca materiale sursă, pentru care sunt selectați diferiți parametri: culoare, cadru, dimensiune și stil de umbre.

Acest serviciu este util dacă trebuie să creați rapid pictograme simple și originale pentru site-ul dvs. web. Rezultatul utilizării Simunity:

Total. Discutat mai sus editori online pictogramele sunt instrumente excelente pentru optimizarea muncii designerilor. Nu are rost să descărcați programe când totul se poate face ușor și rapid online. Din această selecție, poate, se poate distinge IconsFlow. Conține maximul număr mare caracteristici: galerie de pictograme, descărcare SVG, cod încorporat, previzualizare, Creație propriile șabloane, export PNG, ICO și SVG, adaptare la dimensiune, stiluri de modași încorporat editor vectorial. Pe langa asta e singurul editor gratuit icoane în rusă, dacă acest lucru este important pentru dvs.

Daca mai stii ceva servicii similare, trimite-ți opțiunile în comentarii.