U ovom vodiču ćemo naučiti kako nacrtati prekrasnu TV ikonu u Adobe Photoshopu.
Korak 1.
Stvoriti novi dokument (Datoteka > Novo) sa prikazanim postavkama
Korak 2.
Ispunite pozadinu #FFFFFF boju, a zatim na nju nanesite sljedeće Efekti slojeva.
Korak 3.
Koristi se sa radijusom 35px TIJELO, otvoren Stilovi slojeva i primijeniti sljedeće postavke.
Takođe dodajte Moždani udar sa slojem TIJELO sa sljedećim postavkama
Korak 4.
Korak 5.
Koristi Alat za zaobljeni pravougaonik (U) sa radijusom 35px i kreirajte pravougaonik bilo koje boje. Imenujte ovaj sloj BODY_2 i nakon toga primenite sledeće efekte na ovaj sloj.
Takođe dodajte Moždani udar na sloj BODY_2 sa sljedećim postavkama.
Nakon toga dodajte Unutrašnja sjena na sloj BODY_2 sa sljedećim postavkama.
Korak 6.
Trebali biste dobiti sličan rezultat.
Korak 7
TIJELO. Imenujte ovaj sloj BASE. Koristi Alat za zaobljeni pravougaonik (U) sa radijusom 35px
Da biste to učinili, odaberite sloj TIJELO kliknite desnim klikom i odaberite Kopiraj stil sloja a zatim odaberite osnovni sloj, kliknite na desnu tipku miša i odaberite Zalijepi stil sloja.
Nakon toga potrebno je korigirati debljinu Moždani udar on 3px u sloju BASE.
Korak 8
Trebali biste dobiti sličan rezultat.
Korak 9
Kreirajte novi sloj i postavite ga ispod sloja TIJELO. Imenujte ovaj sloj FOOT. Koristi Alat za zaobljeni pravougaonik (U) sa radijusom 35px a zatim na njega primijenite sljedeće efekte sloja.
Primijenite također Unutrašnja sjena na sloj FOOT.
Korak 10
Trebali biste dobiti sličan rezultat.
Korak 11
Sada duplirajte sloj FOOT i postavite kao što je prikazano na slici.
Korak 12
Kreirajte novi sloj, dajte mu naziv GLOSSY i stavite ga na vrh svih slojeva, a zatim odaberite Alat za četkicu (B) i velikim kistom s mekim rubovima obojite jednu bijelu mrlju.
Onda se promeni Blend Mode on Preklapanje sa smanjenjem Transparentnost on 50%
Korak 13
Kreirajte novi sloj i nazovite ga SCREEN i stavite na vrh svih slojeva.
Koristi Alat za zaobljeni pravougaonik (U) sa radijusom 35px da kreirate pravougaonik. Onda kopiraj Stil sloja BODY_2 i nanesite na sloj SCREEN. Sada podesite debljinu poteza na 10px u sloju SCREEN.
Korak 14
Trebali biste dobiti sličan rezultat.
Korak 15
U ovom koraku napravićemo sam ekran. Kreirajte novi sloj SCREEN_2. Stavite ga na ostale slojeve. Koristi Alat za zaobljeni pravougaonik (U) sa radijusom 35px da kreirate pravougaonik. Zatim se prijavite Gradijent V Stilovi slojeva sa sljedećim postavkama.
Zatim se prijavite Unutrašnja sjena na sloj SCREEN_2.
Zatim se prijavite Unutrašnji sjaj na sloj SCREEN_2.
Onda Shadow na sloj SCREEN_2.
Korak 16
Trebali biste dobiti sličan rezultat.
Korak 17
Kreirajte novi sloj i nazovite ga SCREEN GLOSSY i stavite ga na druge. Zatim odaberite Alat za olovke (P) i nacrtajte konturu kao što je prikazano na slici. I napunite ga bijelim #FFFFFF. Zatim smanjujemo transparentnost prije 20%
Korak 18
Kreirajte novi sloj i pozovite ga LIGHT DOT i stavite ga na ostatak u sloju. Nakon toga biramo Alat za četkicu (B) i sa velikom veličinom četkice, sa mekim ivicama, postavite jednu veliku bijelu tačku u centar ekrana.
Korak 19
U ovom koraku ćete napraviti dugmad. Uzmi Alat elipsa (U) i napravite krug i postavite ga otprilike kao na slici, nazovite ovaj sloj BUTTON.
Sada se vratite na sloj BODY_2 i kopiraj ga Layer Style desnim klikom na njega i odabirom Kopiraj stil sloja. Nakon toga primijenite kopirani stil na sloj BUTTON.
Korak 20.
Nakon toga se prijavljujemo Layer Style kao što je prikazano na slici, na našu kopiju kruga.
Zatim dodajemo Shadow.
Korak 21
Trebali biste dobiti sličan rezultat.
Korak 22
Ponavljamo prve korake i primjenjujemo Stilovi slojeva na pravougaonik, ali malo izmijenite postavke Senke.
Korak 23
Trebali biste dobiti sličan rezultat.
Korak 24
Dupliciramo sloj BUTTON stavite ga ispod prvog dugmeta, a zatim ga malo zarotirajte. Takođe uređujemo Layer Style Gradijent drugo dugme.
Korak 25
Sada su naša dugmad spremna.
Rezultat bi trebao biti kao na slici.
Korak 26
Hajde da napravimo zvučnik. Trebamo napraviti pravougaonik sa zaobljenim uglovima ispod dugmadi, kao na slici. Nazovimo ovaj sloj SPEAKER.
Korak 27
A sad da otvorimo Layer Style i primijeniti sljedeće postavke.
Primjenjivo Unutrašnja sjena na sloj SPEAKER.
Hajde da dodamo Moždani udar na sloj SPEAKER.
Softverski programeri, pokušavajući da idu u korak sa tehnološkim napretkom, smislili su velika količina razni, moćni grafički uređivači za različite oblasti grafike, za različite ukuse, za različite operativne sisteme, šta god odgovara duši dizajnera ili fotografa
ne sviđa mi se. O prednostima PhotoShopa, CorelDRAW-a i drugih sa liste teškaša ne vrijedi ni govoriti, već svi znaju za njih. Sa njima možete napraviti jako lijepe ikone, svijetle, šarene i realistične koje su tražene modernog društva. Ali šta je sa onima koji više vole pikselsku grafiku i retro dizajn u interfejsu svog operativnog sistema?! Ovdje sam se zbunio. Lično, smatram da je veoma nezgodno crtati sliku piksel po piksel u ovim čudovištima. Trebao mi je uređivač koji je jednostavan, razumljiv i zgodan, iako ne toliko moćan, ali da može učiniti sve što je potrebno za crtanje ikona piksela i ništa drugo. Šta onda raditi...
Šta može IconLover?
Kreirajte ikone standardne veličine, od 16x16 do 256x256 piksela za različite platforme. Osim toga, veličina ikone se može mijenjati ručno, čineći je nekvadratnom, ili sa rezolucijom mnogo većom od 256x256 piksela.
Stare prečice na radnoj površini u pikselima bile su uglavnom u 16 boja, 16x16 ili 32x32 piksela. Vjerovatno u to vrijeme jednostavno nije bilo drugih mogućnosti da ih obojite u najmanje 256 boja. I ja, po staroj školi, crtam u bojama 32x32/16. Ali ako je potrebno, uvijek možete dodati novu na nacrtanu ikonu, druge veličine ili boje. Naš urednik to dozvoljava.
Podrazumevano, nacrtana ikona će biti sačuvana u ico ekstenziji, ali se vrlo lako može izvesti u druge formate, png, xpm, jpeg i mnoge druge. Nacrtanu minijaturu spremam u ico formatu za Windows (može biti korisno), a za Linux je pretvaram u png.
Naš uređivač vam omogućava da pronađete sve ikone na vašem računaru i napravite prikladnu biblioteku od njih, a zatim uredite i izdvojite slike koje vam se sviđaju iz njega.
Još jedna važna prednost uređivača je kreiranje programskih prečica od slika ili fotografija. Sada ću vam pokazati primjer:
Ali najčešće crtam na uobičajen način, olovkom piksel po piksel. Osim olovke, postoje i drugi alati, možete ih vidjeti na posljednjoj slici. Možete odabrati „prozirnu boju“.
Šta je tu još zanimljivo? Možete kreirati animirane ikone, ali meni to još ne treba.
Ovo je zanimljiv uređivač koji vam omogućava da kreirate prekrasne prečice za radnu površinu u retro stilu. Toplo ga preporučujem onima koji traže sličan program, ili se nisu odlučili za svoj izbor. Možda neko voli nešto drugo softver- stvar ukusa, ali glavna stvar je direktno se baviti crtanjem, a ne gubiti vrijeme na proučavanje složene strukture programa, ili iskusiti stalnu nelagodu zbog činjenice da su alati nezgodni ili su razbacani na nejasnom mjestu. Nadam se da vi, dragi čitaoci, nemate problema sa ovim i da ne gubite svoje dragoceno vreme, zbunjeni pitanjem - .
Postupno ću objavljivati tematske zbirke ikona u budućim člancima. I prve na listi biće minijature posvećene
Nedavno sam pročitao članak Scotta Lewisa, koji je profesionalni dizajner ikona na Iconfinder.com. Scott je diplomirao grafički dizajn na Univerzitetu East Carolina i dizajnirao je ikone više od 25 godina.
Zanimali su me njegovi savjeti o kreiranju ikone, kao i pristup.
Tri ključa za dobar dizajn ikona
Dobro dizajnirane ikone demonstriraju promišljen pristup trima bitnim atributima svakog dizajna - formi, estetskoj koheziji i prepoznatljivosti. Kada razvijamo novi skup ikona, razmotrimo svaki od ovih atributa po redu.Neću reći da savršen dizajn zahtijeva samo tri komponente, ali to je dovoljno da počnete. I tako da počnemo.
Forma
Oblik je osnovna struktura ikone. Ako zanemarite detalje i samo nacrtate linije, onda bi ukupni rezultat mogao ispasti neuredan, bez ukupne geometrije. Basic geometrijske figure: Krug, kvadrat i trokut – stvorite vizualno čvrstu osnovu za dizajn ikona. Stoga u početku ikona treba biti kreirana od najjednostavnijih formi, a tek nakon toga dodajemo detalje, ali onoliko koliko je zaista potrebno za prenošenje koncepta.
Estetsko jedinstvo
Elementi koji se koriste za kreiranje jedne ikone ili skupa ikona, kao što su zaobljeni ili oštri uglovi određene veličine (2, 4 ili 8 piksela), debljina linije (2 piksela ili 4 piksela), stil (ravno, obris), shema boja, itd., moraju biti isti.Dakle, estetsko jedinstvo je skup dizajnerskih elemenata koji se ponavljaju kroz cijeli set. To se može vidjeti u primjeru ispod.
Priznanje
Prepoznavanje je glavni kriterijum, to je suština ikone. Prepoznatljivost uključuje ona svojstva koja osoba obično povezuje s određenim objektom, s određenom idejom, ali može uključivati i nešto neočekivano - to stvara jedinstvenost, na primjer, nepotpuni obris i zaokružene naglaske.Ovo su bile tri glavne komponente efektivnog dizajna ikona. Zatim ćemo detaljnije pogledati šest koraka za rješavanje ovih problema.
Net
Uvijek počnite crtati ikone u mreži. Koristim mrežu od 32x32 piksela, ostavljajući vanjska dva piksela uvijek prazna. Svrha ove zone je stvaranje slobodnog prostora oko ikone. Ako pravite okrugle ikone, onda treba da dodiruje sve četiri ivice, ne ulazeći u prostor slobodnog prostora, ali ponekad, kako bi se održao integritet ikone, neki element se može proširiti izvan kruga, kao na slici:Zabave
Kvadratne ikone ne moraju da se protežu ili dodiruju sve četiri strane. Da bi se održala vizuelna proporcija sa okruglim i trouglastim ikonama, većina pravougaonih i kvadratnih ikona će biti poravnata sa ključnom središnjom linijom.Mreža je tu da vam pomogne da vaše ikone budu uredne i dosljedne, ali ako morate birati između toga da ikona izgleda lijepo ili da prekršite pravila, prekršite pravila - ali to učinite vrlo pažljivo.
Geometrijski oblici
Počnite s jednostavnim geometrijskim oblicima. Čak i ako ikona postane organskija, ipak počnite s jednostavnim geometrijskim oblicima Adobe Illustrator. Kada je u pitanju kreiranje ikona, posebno malih, osnovni geometrijski oblici će učiniti ivice preciznijim i omogućiti vam da brzo prilagodite relativnu skalu elemenata.Brojevi: ivice, linije, uglovi, krive
Da dizajn ne bi izgledao mehanički i dosadno, uglovi, linije, ivice i krive moraju biti matematički precizni. Drugim riječima, pratite brojeve i ne pokušavajte crtati okom ili rukom kada su detalji u pitanju. Nedosljednost ovih elemenata može smanjiti kvalitetu ikone.UGLOVI
U većini slučajeva morate se držati ugla od 45 stepeni ili višestrukog ugla. Izglađivanje ugla od 45 stepeni sprečava pojavu nepotrebnih piksela, čime se dobija jasan rezultat sa idealnom dijagonalom, stvarajući prijatne i prepoznatljive obrise za ljudsko oko. Ovi obrisi ujedinjuju čitav skup ikona, a takođe stvaraju jedinstvo unutar jedne ikone. Ako vas vaš dizajn prisiljava da prekršite pravilo ugla od 45 stepeni, pokušajte da ga napravite od 22,5 ili 11,25 stepeni, jer će zaglađivanje biti manje-više ravnomerno.KRIVE
Ovo su najuočljivija područja koja mogu narušiti kvalitet ikone. Zahvaljujući njima, možete razlikovati profesionalca od amatera. Jer ljudsko oko može otkriti male netočnosti, tada vam crtanje rukom neće pomoći da postignete svoje ciljeve. Oslonite se na alate, oblike i brojeve da biste kreirali krivulje.ZAKLJUČIVANJE UGLOVA
Radijus ugla je 2 piksela. Za ikonu veličine 32x32 piksela, ovaj radijus je dovoljan da ugao bude zaista zaobljen, bez omekšavanja uglova dovoljno da se dizajn zaokruži u balon. Glavna stvar koju treba zapamtiti je da će dizajn same ikone ovisiti o izboru radijusa zaokruživanja.PIXEL SMOOTHING
Savršeno poravnanje piksela je neophodno za male dizajne ikona. Zaglađivanje uglova na takvim ikonama može učiniti ikonu mutnom i nejasnom. Prostor između linija koji nije poravnat sa mrežom piksela će se izgladiti i postati nejasan. Kao što je već pomenuto, 45 stepeni uglovi a više njih se bolje izglađuje.Međutim, napominjem da izglađivanje postaje manje relevantno kada velike veličine i na ekranima sa visoka rezolucija, kao što je retina displej.
DEBLJINA LINE
Općenito, najbolje je koristiti ne više od dvije opcije debljine linije u jednoj ikoni, ali ponekad su tri opcije jednostavno neophodne. Vaš cilj je vizualno pružiti hijerarhiju i raznolikost bez narušavanja integriteta cijelog kompleta. Korištenje više od tri utega linija može uništiti strukturu i koheziju. Što se tiče same širine linije, bolje je ponovo uzeti višekratnike od dva i četiri piksela; lako ih je skalirati i napraviti jednake korake. Pokušajte da izbegnete mnogo toga fine linije, posebno u osnovnim ikonama i ravnim ikonama, ali ovo pravilo ne vrijedi ako namjerno kreirate ikone od tankih linija.Koristite ponavljajuće elemente dizajna i akcente u setovima ikona
Na primjer, Hemmo de Jong, poznati holandski dizajner, koristi element koji se ponavlja u svim svojim ikonama - oštar ugao.Detalje i ukrase koristite vrlo pažljivo. Ikona treba brzo da komunicira objekat, ideju ili akciju. Previše malih detalja učinit će sliku složenom i stoga manje prepoznatljivom, posebno na manjim veličinama.
Nivo detalja u jednoj ikoni ili skupu ikona jednako je važan aspekt estetskog jedinstva i prepoznatljivosti. Glavno pravilo je minimum detalja potrebnih za prenošenje značenja ikone.
Učinite ikonu jedinstvenom
Broj talentiranih dizajnera koji stvaraju visokokvalitetne setove ikona, od kojih su mnogi sada dostupni besplatno, raste svakim danom u geometrijska progresija. Nažalost, većina njih se fokusira na trendove i stilove najpopularnijih dizajnera. Stoga je veoma važno da vaš dizajn bude nezaboravan i zaista jedinstven.Sve ovo jednostavnim koracima treba posmatrati kao početnu tačku, a ne kao konačan vodič. Nakon što savladate teorijske i tehničke osnove, svoju energiju možete usmjeriti na stvaranje jedinstvenih ikona koje će se izdvojiti iz gomile zahvaljujući vašoj kreativnoj viziji.
Skup ikona koje su korištene na
Iskusni momci mogu uopće izbjeći skiciranje, već sami sebi naprave listu slika i odmah rade s varijacijama.
Ako crtate ikone po narudžbi, crtate skice, tako ćete izbjeći dodatni posao prilikom crtanja, nakon što ste prethodno pokazali svoje slike kupcu.
Četvrti korak: Veličina
Ovo je općenito najvažnija stvar: odlučiti se za minimalnu veličinu.
čemu služi? Ako želite da vaše ikone budu oštre ivice, savršene u pikselima i ispravno skalirane, morate odlučiti o veličini i debljini objekata na najmanjoj veličini (x1). Preporučujem korištenje jednakih veličina ikona.
Peti korak: Proces
Kreirajte dokument sa vrijednostima
Gdje je razmak udaljenost između montažnih ploča.
Width and Height - visina i širina montažne ploče.
Rasterski efekti — rezolucija (ppi) pogodno za ikone 72
Poravnaj nove objekte... - ovaj kvadratić je odgovoran za povezivanje tačaka sa mrežom piksela. Savjetujem vam da ga uključite, ali tokom rada uvijek ga možete isključiti.
- Odaberite prvu montažnu ploču, ona će napraviti sve ikone, a gotove će biti umetnute na susjedne ploče.
- Napravite kvadrat koji odgovara vašem radnom području.
- Postavite vodiče kako biste olakšali proces crtanja.
- Koristi Pregled piksela
- Označite gotove ikone na listi slika, tako da možete jasno pratiti svoj napredak.
- Slijedite savjete i zadnji članak O .
- Ne činite svoj prvi set prevelikim, mogli biste se brzo umoriti i odustati na pola puta. Normalna brzina će biti oko 20 ikona dnevno, tada mogu brzo da dosade...
- Dizajnirajte izvornu datoteku i ne zaboravite posložiti stvari u slojevima, pripremite datoteku za Photoshop i skicirajte, na primjer.
- Pripremite udarac za dribling i behance, kreirajte objavu za društvene mreže. Ovo je najbolji PR za vaš rad i pristup novim narudžbama. Ne zaboravite na hashtagove: #design #best #mamalubitmenya #kupiteikonky
Gdje prodati:
graphicriver.net je besplatna platforma za trgovanje bilo kojim digitalnim sadržajem.
creativemarket.com - da biste ovdje kreirali račun, od vas će se tražiti da prikažete račune u drugim trgovinama i svoj portfelj.
thenounproject.com — sajt je verovatno sa najvećom bazom ikona, nude izbor: ili besplatno ili za jednokratnu uplatu, postoji i funkcija mesečne pretplate, ali ne bih se kladio na ovu uslugu ako želite da zaradite .
icons8.com - Ne znam ništa o ovoj prodavnici, ako neko ima iskustva neka podijeli u komentarima.
Odnosno, da li je moguće garantovati da će se kliknuti kada se prikaže visokokvalitetan prikaz n-objekta?
Kako bismo riješili ovaj problem, odlučili smo pogledati ikone vrhunskih iOS igara na tržištima SAD-a, Kine i Njemačke. Ovaj izbor smo napravili na osnovu sledećih pretpostavki:
- SAD su lakmus test za tržište mobilnih igara. Većina igrača na tržištu se fokusira na to.
- Kina je bliska budućnost tržišta mobilne telefonije. Sada je ovo tržište u povojima.
- Njemačka je jedno od centralnih tržišta u Evropi. Općenito je prihvaćeno da se njemačka maloprodaja ozbiljno razlikovala od svjetske. Je li to istina za tržište mobilnih uređaja?
Ikone - SAD
Grossing
Ikona King's Candy Crush Saga teško da je idealna. Međutim, ističe se ne samo na vrhu, već iu dućanu: neobična ivica (bijela i ljubičasta), zastrašujući bomboni na plavoj pozadini. Inače, ista pozadina je prisutna iu Pet Rescue Sagi. Tek u drugom slučaju King je odlučio da na ikonu postavi sliku jednog od likova iz igre.
Što se tiče ikone Clash of Clans. Možda smo zbunjujući, ali upravo je Supercell pokrenuo trend muškaraca koji vrište na ikone. U ruskoj blagajni ponekad je situacija dostigla tačku da su top 5 u potpunosti preuzele igre sa sličnim ikonama.
Ikona War of Hereoes takođe nije idealna. Zastrašujuće je, ali je namijenjeno strogo određenoj publici, obožavateljima Marvela i herojima ovog univerzuma.
Plaćeni grafikon
Ovdje je vrlo teško pronaći zajedničko u plaćenim ikonama. Svaki od njih se obraća svojoj publici. Na ikoni Ljute ptice Ratovi zvijezda II Rovio je smatrao potrebnim napisati samo " ratovi zvijezda"; Plague Inc. ima dva nacrtana simbola - biološku infekciju i DNK; Minecraft ima pikseliziranu teksturu; Heads Up! odražava kako se igra igra, a ikona NFL prikazuje igrača američkog fudbala.
Besplatna karta
I ovdje postoji, da tako kažem, igra sa simbolima. Samo gledajući ikone možete shvatiti o čemu se radi. Izuzetak je Deer Hunter 2014, u kojem ne morate igrati kao jelen, već ga lovite.
Ikone - Kina
Grossing
Većina igara predstavljenih u kineskom vrhu ima nevjerovatnu crtanu umjetnost. Neću davati nazive igara (sve su na kineskom), ali ovdje je situacija malo suprotna od one na američkom tržištu. Ikone, u pravilu, ne govore korisniku ništa (među gore prikazanim su trkač, borac, kartaška igra i MMO). Ali postoji ozbiljan naglasak na licima, koja zauzimaju veći dio ekrana. Njihov zadatak je da korisniku pošalju ne informacije o igri, već raspoloženje.
Plaćeni grafikon
Prva aplikacija (部落守卫战) - mobilna verzija popularna MMO odbrana tornja u Kini (da, čini se da se to dešava). Dakle, želja programera da postave originalni logo na ikonu je sasvim razumljiva. U slučaju aplikacije broj četiri (狂斩三国), to su učinili jer govorni naslov— “Tri isjeckana” (hvala, Google). Sasvim dobro ime za slasher.
Besplatna karta
U besplatnom grafikonu sve je jasno: postoje aplikacije čija je ikona simbol, a postoje i one koje su „o raspoloženju“.
Ikone – Njemačka
Grossing
U četiri od pet slučajeva, ovdje se nalaze likovi koji prenose određeno raspoloženje.
Plaćeni grafikon
Čak i da nismo napisali kakva tržišta gledamo, zahvaljujući vodstvu Construction Simulatora 2014 na plaćenom grafikonu, lako bi se moglo pretpostaviti: ovo je Njemačka. Da li želite da se popnete na nemački vrh? Napravite simulator civilne opreme (kombajn, traktor, tramvaj, građevinsku dizalicu ili nešto slično).
Besplatna karta
Najbolji za nas velika tajna— prve dvije ikone. Ne govore nam ništa. O čemu su igre i za koga je strogo čuvana tajna. Ali ne štede saobraćaj na njima.
Sažimanje
Nećemo otkriti Ameriku ako o ikonama igara kažemo sljedeće: kada ih kreirate, možete poći od dvije dvije premise.
1. Fokusirajte se na sadržaj (ako je igra o pticama, crtamo ptice, ako se radi o utrkama, crtamo automobile). Ovaj pristup se aktivno koristi na zapadnim tržištima.
2. Naglasak na raspoloženju (želimo da ugodimo korisniku, pa zašto ga ne obradovati osmehom karakter igre ili, ako je igra horor, naprotiv, ne pokušavajte da ga uplašite).
Pripremili smo i infografiku o tome kako različiti izdavači pristupaju kreiranju ikona. Uživajte u gledanju.
