Kako ustvariti teme Tumblr z zasnovo PSD

Tumblr združuje poudarek na vizualni ustvarjalnosti z dolžino objave, ki je med kratkostjo Twitterja in odprto dolžino tradicionalnega vnosa v spletni dnevnik. Ko uporabljate temo Tumblr po meri, ki razširja videz vaše identitete v omrežju in brez nje, se tumblelog prilega strategiji, ki vključuje druge spletne in družabne medije. Spletni oblikovalci pogosto začnejo razvijati teme po meri v Adobe Photoshopu, pri čemer uporabljajo večplastni format datoteke PSD kot vizualni delovni prostor.

Vzpostavitev dimenzij

Vodila za ravnila in zmožnosti nalaganja Adobe Photoshop poenostavljajo nalogo ustvarjanja osnove teme Tumblr, skupaj z mrežno postavitvijo, ki določa dimenzije področij vsebine. Če za vsak vidik vašega načrta nastavite skupine slojev, vključno z glavnim področjem vsebine in stransko vrstico, lahko vsa vodila za vsak element postavite na en sloj v vsaki skupini. Ta ureditev vam omogoča, da vodnike naredite selektivno vidne, namesto da jih preprosto prikažete in skrijete z bližnjico na tipkovnici Photoshop ali elementom menija, in ohranja povezane elemente vodiča. Poimenujte svoje skupine in sloje, da prepoznate funkcijo vsakega dela vašega oblikovanja. Trenutki, ki jih vlagate v postopne naloge poimenovanja, se izplačajo v času, ko vam ni treba porabiti za vklop in izklop slojev, da ugotovite, kaj vsebujejo. Če želite hitro najti dimenzije katerega koli elementa postavitve, pritisnite "F8", da odprete podokno z informacijami, nato pa na sličici podokna Sloji "Ctrl-click" naložite izbor, ki temelji na slikovnih pikah na tej plasti.

Izbira barv

Ne glede na to, ali s časovno preizkušenim izbirnikom barv izberete odtenke za svojo temo, naložite možnosti iz knjižnice barv, da se ujemajo s tiskanim delom ali logotipom, ali se za vzorčenje odtenkov iz druge datoteke ali grafike zanesete na orodje Eyedropper, Adobe Photoshop ponuja vrsto načinov za izbiro tematskih barv. Ko plast zapolnite s polno barvo, da simulirate barvo ozadja teme Tumblr ali drugih elementov vašega oblikovanja, lahko kopirate barvno formulo kot besedilo iz šestnajstiškega odčitka Color Pickerja in prilepite identifikacijo barve v ime sloja za hitro referenco. Šest alfanumeričnih znakov v šestnajstiški barvi je prikazanih v kodi Tumblr ter v spletnih oblikovanjih za bloge in druge spletne formate.

Ustvarjanje grafike

Glava, ki identificira tumblelog, lahko kot tematsko grafiko uporabi bitno grafiko. Ta kritični element lahko ustvarite s kombinacijo besedila in elementov, ki temeljijo na slikovnih pikah ali vektorjih, v datoteki PSD. Če grafika vključuje prilagodljive elemente, ki ste jih vnesli v Photoshopu, jih pustite kot živo vrsto v svoji tematski datoteki, ki temelji na PSD, in jih rasterizirajte samo v kopijah datoteke, ki jo posredujete drugim, ki nimajo licence za zahtevane datoteke pisave v svoji temi. Ko za risanje v Photoshopu uporabljate vektorska orodja, vključno z orodji Pero in oblikovanje, risite z uporabo vodilnih pravil, ki se poravnajo z osnovno ločljivostjo datoteke predloge. Ta tehnika pomaga, da bodo vaša umetniška dela čim ostrejša, ko jih shranite ali izvozite v rastrizirane različice.

Naslednji koraki

Če znate kodirati HTML in CSS ter razumete specializirane spremenljivke, ki jih Tumblr uporablja v svoji strukturi kode, lahko dimenzije, barvne specifikacije in grafike, ki jih vgradite v PSD, prevedete v delujočo temo Tumblr po meri. Če spletno kodiranje ne spada v vaš nabor spretnosti, lahko PSD posredujete programerju, da vam pripravi temo. Tema Tumblr mora poleg vizualne obdelave vsebovati spremenljivke in bloke. Spremenljivke sprejemajo dinamične vrednosti za ustvarjanje standardnih vizualnih elementov Tumblr. Bloki tvorijo koščke kode, ki združujejo spremenljivke s HTML. Bloki postavljajo objave in trajne povezave, ki jih dosegajo, povezave, ki se premikajo med kosi kronološko organiziranega gradiva in elementi, ki sprejmejo ljudi, ki jim je všeč ali jim sledi posamezen dnevnik.

Informacije o različici

Informacije v tem članku veljajo za Adobe Photoshop CC in Adobe Photoshop CS6. Lahko se nekoliko ali bistveno razlikuje od drugih različic ali izdelkov.