Cum se creează o pictogramă pentru o aplicație Windows. Cum să faci o ico. Crearea pictogramei .ico pentru programe. Crearea unui favicon folosind servicii online

Astăzi vom vorbi despre cum să creați corect o pictogramă pentru proiectul dvs. Mai jos sunt câteva sfaturi utile despre designul pictogramelor, precum și servicii pentru crearea acestora.

Analiza asocierii

Înainte de a crea o pictogramă pentru proiectul dvs., trebuie să identificați cuvintele cheie și apoi să încercați să găsiți reprezentarea sau metafora perfectă pentru ele. Va trebui să căutați imagini și simboluri care au o relație directă cu cuvântul cheie dorit. Acest lucru vă va ajuta să găsiți imaginile potrivite pentru pictogramele dvs., care sunt intuitive pentru utilizator.

Cercetarea concurenței

Când creați un design de pictogramă pentru o aplicație mobilă, încercați să nu repetați sau să copiați designul altor pictograme. De ce este nevoie de asta? Imaginează-ți că cauți un manager de activități. Aruncă o privire la pictogramele aplicațiilor de mai jos și întreabă-te ce manager ai alege să instalezi pe smartphone-ul tău?

Pictograma Wunderlist (în primul rând) se compară favorabil cu alte pictograme de aplicație. Cel mai probabil, utilizatorul va descărca Wunderlist și astfel aplicația va primi mai multe instalări.

Pe de altă parte, analiza va ajuta la determinarea ideii principale pe care concurenții o folosesc în pictogramele lor pentru a arăta funcția principală a aplicației.

Scopul icoanei

Când proiectați o pictogramă, este important să luați în considerare modul în care va fi utilizată și care sunt funcțiile acesteia.

De exemplu, pictograma unei aplicații mobile ar trebui să îndeplinească funcția de identificare și să o distingă de alte aplicații de pe un smartphone. Acest lucru se aplică atât listei de programe aflate deja pe smartphone, cât și din magazinul de aplicații (App Store, Google Play).

De asemenea, trebuie să înțelegeți că, concentrându-ne doar pe componenta de marketing a pictogramei, nu trebuie să uităm de scenariile în care aplicația va începe să fie utilizată. Este mai logic să se concentreze pictograma nu pe o singură descărcare, ci pe utilizarea zilnică a produsului de către un utilizator obișnuit.

Unicitate și recunoaștere

Atunci când promovați marca dvs., ar trebui să depuneți toate eforturile pentru a crește vizibilitatea nu numai a logo-ului, ci și a icoanei. Pentru a face acest lucru, trebuie să fie unic și, în același timp, asociat în mod clar cu proiectul dvs., precum și să puteți distinge un Mercedes de alte mărci de mașini prin insigna sa și să găsiți o ciocolată Nestle pe tejgheaua unui supermarket.

Mai puține detalii

Cu cât pictograma este mai concisă, cu atât este mai ușor de reținut și de recunoscut în orice caz. Mulți designeri se străduiesc pentru aspectul cel mai estetic al icoanei, adăugând un număr mare de detalii care nu îndeplinesc nicio funcție, cu excepția decorului și, întâmplător, înfundarea câmpului de informații al icoanei. Aceasta nu este o fotografie, nu este nevoie de detalii meticuloase aici. În plus, într-o dimensiune mică, părțile mici pur și simplu se îmbină într-o masă fără formă.

A doua pictogramă a aplicației arată mai bine datorită simplității și minimalismului.

Prioritizează dimensiunea

Există două abordări pentru a crea o pictogramă.

Primul este să îl creați în dimensiuni mari, cu detalii maxime și, pe baza acestuia, să găsiți opțiuni pentru o dimensiune mai mică și un aspect mai schematic. Al doilea este opusul celui dintâi: în primul rând, se creează o pictogramă cu dimensiunea cea mai frecvent utilizată, iar prin adăugarea sau scăderea detaliilor se elaborează restul opțiunilor. Pe ce cale să ia? Decideți singur, ambele opțiuni funcționează.

Aveți nevoie de mai multe pictograme? Creează un set!

Dacă proiectul dvs. necesită mai multe pictograme, creați-le pe toate simultan în același stil. Ele pot avea aceeași culoare, grosimea conturului, detalii individuale și multe altele și, în același timp, pictogramele pot diferi în conținutul lor. Acest lucru va asigura un aspect armonios și consistent al interfeței.

Nu rezerva spațiu

Pictogramele sunt diferite: late și înguste, înalte și joase. Ei sunt uniți printr-o singură recomandare - nu economisiți spațiu liber și nu căutați să umpleți întreaga zonă disponibilă cu imagini sau inscripții. Lăsați pictograma să respire, lăsați puțin spațiu în jurul compoziției finite atunci când este plasată în interfață sau în altă parte. În același timp, nu există o indicație clară a dimensiunii indentării în pixeli pentru astfel de cazuri, concentrează-te doar pe propria percepție vizuală.

Diferite pictograme pentru diferite platforme

Dacă trebuie să creați o pictogramă pentru diferite platforme, puteți să luați una ca bază și să faceți doar ajustări stilistice minore, pentru a ajunge la mai multe pictograme diferite, demonstrând în același timp afinitatea lor.

Culoarea este foarte importantă

Alegerea culorii potrivite determină în mare măsură percepția pictogramei tale. Încercați să nu utilizați mai mult de două culori contrastante. Apropo, Google a stabilit restricții condiționate și chiar a specificat seturi de culori compatibile în Material Design. Folosește-le în design-ul tău.

Fă fără text

O pictogramă eficientă nu are nevoie de cuvinte pentru a-și comunica conținutul. Lăsați textul pentru site-uri web sau anunțuri banner și încercați să faceți fără el atunci când creați o pictogramă. De ce este asta? Pentru că atunci când reduceți dimensiunea pictogramei, textul va deveni ilizibil și va arăta ca o pată obișnuită de culoare.

Găsiți un echilibru între originalitate și ușurință de percepție

După cum puteți vedea în orice magazin de aplicații, există multe pictograme diferite. Experimentele sunt bune, forma originală atrage întotdeauna atenția. Dar nu uitați de memorabilitate: cu cât forma icoanei este mai simplă, cu atât este mai ușor de reținut. Semnele rutiere sunt o ilustrare bună în acest caz - sunt forme simple, ușor de citit și de reținut, chiar dacă șoferul conduce cu o viteză decentă.

Pentru aplicația dvs., trebuie să veniți cu ceva similar - atât original, cât și simplu ca formă. Trebuie avut în vedere faptul că pictogramele sunt afișate diferit pe ecranele dispozitivelor mobile - în dimensiuni mai mari sau mai mici. Prin urmare, trebuie să vă asigurați că opțiunea pe care o creați arată întotdeauna atractivă.

Nu uitați de fundal

În magazinul de aplicații, pictogramele sunt de obicei afișate pe un fundal deschis - alb sau gri. Dar tapetul dispozitivului pe care utilizatorul vă descarcă aplicația poate fi de orice culoare. Prin urmare, nu uitați să verificați cât de atractivă și vizibilă este pictograma dvs. pe un anumit fundal.

Nu există loc pentru elementele interfeței aplicației pe pictogramă

Nu plasați elemente ale interfeței aplicației pe pictograma acesteia. Acest lucru derutează utilizatorul și este considerat o formă proastă.

Pictograma ar trebui să fie informativă

O pictogramă eficientă prin aspectul său comunică funcția aplicației. Astfel, utilizatorul va putea înțelege pentru ce este produsul dvs. înainte de a căuta în descriere. De exemplu, pentru pictogramele jucătorilor se folosesc imagini cu note, instrumente sau vizualizatoare, pentru camere sau editori grafici - un obiectiv de cameră, iar pentru mesageri precum Viber - nori de mesaje simbolice.

Din pictogramă, utilizatorul încheie ceea ce îl așteaptă în interiorul aplicației. Prin urmare, pictograma trebuie să fie clară, concisă, un minim de obiecte, imaginea ar trebui să fie lizibilă dintr-o privire scurtă.

Ksenia Mayevskaya, dezvoltator de aplicații Remember-Remind.

Acum că am învățat sfaturi despre cum să creați o pictogramă eficientă, vă prezentăm atenției servicii utile pentru crearea uneia.

Servicii și resurse utile pentru crearea unei pictograme

Serviciu online în limba rusă pentru crearea atât de pictograme individuale, cât și de seturi întregi. Selecție mare de pictograme și opțiuni pentru editarea acestora.

Pictograme de font pentru utilizare cu Twitter Bootstrap

Aici puteți găsi atât texturi fără sudură, cât și palete gata făcute. Tot pe această resursă există un forum unde se realizează comunicarea. Un serviciu excelent pentru potrivirea culorii pictogramei tale.

Serviciu online profesional care vă permite să generați o schemă de culori în conformitate cu regulile de culoare de pe roata de culori.

Crearea automată de gradienți.

O resursă care este ideală pentru cei care nu pot decide asupra culorilor și fonturilor pentru proiectul dvs. Interesant este că paleta și fonturile pot fi selectate în funcție de zona afacerii.

management,dedicat Material Design pentru Android

Ghiduri despre interfața umană iOS de la Apple.

Instrucțiuni pas cu pas pentru crearea unei pictograme

Puteți crea o pictogramă pentru un site web sau o aplicație utilizând programe grafice sau servicii online.

Prima modalitate este potrivită pentru designeri experimentați pentru o muncă minuțioasă. Instrumentele online sunt potrivite pentru crearea rapidă sau pentru un număr mare de pictograme, de exemplu, pentru un site web, serviciu. Instrumentele online sunt mai simple și mai ușor de înțeles, așa că sunt ideale pentru începători.

Unul dintre serviciile online care vă permite să creați rapid modern icoane este IconsFlow.

Câteva cuvinte despre capacitățile serviciului:

  • Abilitatea de a exporta pictograme în forme SVG (vector), PNG și ICO;
  • Funcționalitate excelentă de editare;
  • Abilitatea de a crea pachete de pictograme în același stil;
  • Opțiuni gratuite.

Acum să trecem la procesul de creare a unei pictograme.

Pentru a crea o pictogramă sau un set întreg, trebuie să găsiți mai întâi pictograma dorită sau mai multe simultan în editorul online.

Apoi, folosind instrumente de editare, îl puteți personaliza, de exemplu, puteți seta culoarea dorită pentru pictogramă, fundal, adăugați o altă pictogramă, formă, text, desenați un element nou.

După ce pictograma (sau pictogramele) este editată, puteți lucra la fundal, scară, umbre, adăugați un gradient.

Unul dintre avantajele serviciului este că, dacă creați un set întreg de pictograme, puteți face toate editările de mai sus în loturi.

Adică, făcând clic într-un singur loc, modificați designul tuturor pictogramelor simultan: umbre, dimensiune, fundal etc. Foarte util dacă trebuie să creați 3-5 sau mai multe pictograme.

După crearea pictogramelor, serviciul vă va cere să creați un cont de unde puteți descărca pictograme gratuit sau să comandați un plan plătit.

Asta e tot.

După cum puteți vedea, chiar și crearea unui element atât de mic ca o pictogramă ar trebui abordată cu toată responsabilitatea. Un design bun de pictogramă atrage atenția utilizatorilor, în timp ce un design prost le poate dezactiva.

O favicon este o pictogramă mică care apare lângă numele unui site într-o fereastră de browser sau în rezultatele motorului de căutare. Nu are nicio funcție pentru SEO, dar utilizarea lui vă permite să creșteți recunoașterea site-ului și, ca urmare, indicatorul CTR. De asemenea, puteți crea faviconok-uri pentru retină. Ce dimensiune ar trebui să aibă favicon-ul? De obicei, favicon-urile au dimensiuni de 16x16px sau 32x32px.

În ce format voi primi favicon-ul meu?

După ce creați un favicon, veți primi un fișier favicon.ico pentru site, adică un fișier cu extensia * .ico. El este cel care va trebui folosit în viitor. Cum se creează o favicon online? Utilizați generatorul de favicon online de pe site-ul nostru. Puteți nu numai să creați o favicon dintr-o imagine, ci și să utilizați editorul încorporat care vă permite să creați orice pictogramă pentru site.


Cum să plasați un favicon pe site

Trebuie să încărcați favicon-ul în directorul rădăcină al site-ului pentru a obține o adresă precum http://sitename.ru/favicon.ico. Aceasta este calea către imagine. Apoi, trebuie să puneți codul în etichetă. Ar trebui să arate așa:


 ...


 ...

De ce să specificați calea către favicon?

Unele site-uri folosesc diferite favicons, astfel încât utilizatorii să poată naviga mai bine în secțiunile resursei, așa că trebuie să specificați calea. Dacă utilizați o singură favicon pentru întregul site, nu trebuie să specificați calea către acesta.

Favicon-ul va apărea în SERP-uri?

Google nu afișează favicon-uri. Yandex are așa-numitele favicons de indexare, acest proces durează de la o săptămână la o lună.

Când folosim orice dispozitiv, adesea ne plictisim de aceeași interfață și vrem să schimbăm ceva. Aspectul sistemului se schimbă diferit pentru fiecare dispozitiv. Pictogramele sunt unul dintre elementele de bază ale oricărei interfețe, iar schimbarea lor nu este dificilă. Există multe seturi de pictograme pe internet pentru toate tipurile de dispozitive. Dar ele nu sunt unice, nu sunt individuale. Prin urmare, în acest articol, vom lua în considerare cum să faci singur o icoană, astfel încât să fie a ta, unică.

Vom lua în considerare exemplul a două programe simple. Deoarece este foarte ușor să faci o pictogramă pentru un folder, fișier, scurtătură sau alte elemente cu ajutorul lor, acest software devine un instrument excelent în schimbarea aspectului interfeței și individualizarea acesteia. Datorită acestor programe simple, puteți crea pictograme pentru orice elemente de interfață ale diferitelor sisteme de operare.

Fasticona 1.0 portabil gratuit

Nu am văzut niciodată un program mai simplu pentru crearea pictogramelor. Nici măcar nu necesită instalare. Fasticona 1.0 portabil gratuit nu permite desenarea pictogramelor, le face din imagini gata făcute. Puteți face o pictogramă din orice imagine (chiar și din propria fotografie), programul acceptă o varietate de formate. Cu cuvinte simple, este doar un convertor de imagini.

Înainte de a face o pictogramă dintr-o imagine, încărcați imaginea în program folosind butonul „Deschideți fișierul”. Selectați parametrii necesari: dimensiunea, adâncimea culorii (culori și biți pe eșantion), folder de salvare (calea de ieșire, implicit, folderul în care este salvat fișierul de pornire) și numele fișierului pictogramă (ieșire numele).

Fișierul rezultat este salvat în format * .ico. Și numai în ea.

Seanau Icon Tool Kit 6.0

Seanau Icon Tool Kit 6.0 va trebui instalat pe computer, dar va ocupa foarte puțin spațiu. Funcționalitatea sa este mai avansată. Acest program vă permite atât să faceți o pictogramă dintr-o imagine, cât și să o desenați singur. Pentru asta, are o gamă largă de instrumente.

Icon Tool Kit acceptă lucrul cu straturi, vă permite să reglați adâncimea culorii, transparența, există diverse filtre. Fișierul de ieșire poate fi obținut în * .ico, * .png, * .bmp, * .jpg sau * .gif. Este de remarcat faptul că acest software vă permite să aplicați stiluri pictogramelor create, de exemplu, Mac, Vista și altele. Descărcarea programului de creare a pictogramelor este recomandată celor care doresc să încorporeze mai mult idei creative în interfață.

Favicon pentru un site web este una dintre caracteristicile sale distinctive. Acesta este un alt pas către crearea și utilizarea unei identități corporative. Un favicon, în termeni simpli, este o pictogramă (imagine) care este afișată în browser înaintea barei de adrese. De asemenea, favicon este folosit atunci când adăugați o pagină la marcaje. De acord, va fi mai convenabil pentru utilizator să găsească site-ul dvs. în marcaje dacă pictograma dvs. „corporativă” este afișată acolo.

Cred că fiecare dintre voi a observat favicon-ul când a vizitat site-urile preferate. Arată așa (în browserul Google Chrome):

Și pentru comparație, afișarea pictogramei în browserul Internet Explorer:

Cum se creează o pictogramă pentru un site web

Puteți crea o favicon atât folosind funcțiile standard ale Photoshop (sau alt editor grafic), cât și folosind tot felul de servicii web.

Desenarea unui favicon folosind un serviciu web

Cel mai simplu mod de a crea o favicon este să utilizați serviciul www.favicon.cc. Arata cam asa:

Pentru a desena o pictogramă, trebuie doar să selectați culoarea dorită, opacitatea și să desenați căile dorite. Când creați o pictogramă, puteți previzualiza imediat:

Creați o favicon dintr-o imagine redată

Pentru a converti o pictogramă gata făcută în format .png (care, de altfel, poate fi folosită și pentru a seta o favicon), puteți folosi un alt serviciu web: favicon.ru.

Instalați Favicon pe site

Când pictograma este gata, o puteți descărca în format .ico... Pentru a adăuga o favicon la un site, plasați fișierul favicon.ico în directorul rădăcină al site-ului și adăugați între etichete linia:

În mod implicit, dacă pictograma pentru site nu este specificată în mod explicit, browserul încearcă să încarce fișierul favicon.ico de la rădăcină. Dar este mai bine să joci în siguranță.

(pentru Internet Explorer).

Dimensiunea favicon-ului poate fi 16x16, 32x32.

Notă utilă

Un fișier pictogramă poate avea nu numai extensia .ico, ci și .png și se recomandă utilizarea acestei din urmă opțiuni. Acest lucru se datorează faptului că dispozitivele cu afișaj de înaltă rezoluție (de exemplu, iPhone, iPad, iPod) au o dimensiune implicită a pictogramei de 57x57. Pentru a face acest lucru, este mai bine să faceți a doua versiune a pictogramei (la o rezoluție mai mare) și să adăugați o linie suplimentară:

Dar trebuie remarcat faptul că în acest caz pictograma va fi rotunjită la colțuri și i se va suprapune o strălucire (acest lucru se face automat de către dispozitivul însuși). Pentru a evita acest lucru, în loc de pictogramă-măr-touch trebuie sa scriu Apple-touch-pictogramă-precompus.