Pokud jste se na tento článek dostali z vyhledávače, nejspíš víte, co se za tím kouzelným slovem mockup (někdy psáno také mock-up / mock up) skrývá a můžete rovnou přeskočit k návodu.
A když přeci jen tápete, začnu trochou vysvětlením.
mockup vizitky srovnání
Jedná se šablonu vytvořenou z reálné fotky, nebo 3D render objektu, na který můžete umístit grafický návrh.
Díky tomu bude vaše prezentace nejen poutavější, ale klient si i lépe představí, jak budou např. vizitky ve skutečnosti vypadat.
Nejčastěji se používá při vizualizaci:
Nicméně fantazii se meze nekladou a vizualizovat můžete grafický návrh na jakýkoliv objekt, namátkou třeba polep auta.
Máte 2 možnosti, ta jednodušší je najít ho na internetu. Existuje spousta stránek, kde lze mockup zdarma stáhnout např.:
Problém ovšem nastává, když nenajdete, co hledáte, anebo objekt má jiný poměr rozměrů stran, je vyfocen ze špatného úhlu apod. Pak přichází na řadu druhá možnost, vytvoříte si mockup vlastní.
Pokud se vás týká 2. možnost, jdeme na to.
Tento tutoriál je pro pokročilejší uživatele Photoshopu, ale pokusím se ho napsat tak, aby byl srozumitelný i začátečníkům.
ořez objektu s maskou
V grafickém editoru otevřete podkladovou fotku a duplikujete vrstvu. Já se pokaždé řídím heslem, 2× duplikuj, jednou řež :)
Vaší oblíbenou metodou oříznete objekt, na který budete návrh aplikovat.
Pokud jste dali na mou radu, a máte masku, použijte ji na novou vrstvu, kterou vyplníte základní barvou objektu. Zdá se to jako zbytečný mezikrok, ale následně ho oceníte.
Aby vizualizace grafického návrhu vypadala reálně, je potřeba přidat ještě odlesky a stíny.
přizpůsobení – křivky
Vrstvu s objektem opět duplikujte, odbarvíte (Obraz > Přizpůsobení > Odbarvit) a začnete si hrát s křivkami (Obraz > Přizpůsobení > Křivky), cílem je, abyste zvýraznili bílé části a naopak potlačili vše ostatní.
Vrstvu pojmenujte např. odlesky, nastavte jí režim prolnutí „Závoj“ a posuňte na první místo (bude nad ostatními vrstvami).
Když to zdrojový soubor dovolí, použijte opět křivky, jen v tomto případě vám půjde o vytáhnutí oblastí se stíny, ale většinou je rychlejší nakreslit si vlastní.
Postup není nijak složitý, pomocí nástroje pero nakreslete tvar, který kopíruje hrubý obrys stínů a následně použijte filtr na rozostření.
Vrstvu si opět pojmenujte, nastavte prolnutí „Lineárně ztmavit“ a přetáhněte na předposlední místo (poslední vrstvou stále zůstává pozadí), trochu poladit hodnotu krytí a hlavní stíny jsou na světě.
Když to scéna vyžaduje, to samé zopakujte (v nové vrstvě) u vnitřních stínů objektu, jen ji pak posuňte nad objekt.
Dobrá zpráva je, že to nejtěžší máte za sebou, hurá na krok č.2.
pozadí s texturou šachovnice
Toto bude jednoduché, a tak trochu trénink na následující krok.
Pomocí nástroje tvar vytvořte obdélník, který přesáhne celkovou vizualizaci, ten převeďte na inteligentní objekt (Vrstva > Inteligentní objekty > Převést na …), vrstvu pojmenujte a přesuňte až na úplný konec.
Aby to ladilo nejen oku, použijte perspektivu, nebo deformaci (Úpravy > Transformovat cestu > Deformovat / Perspektiva).
Přípravné práce máte hotové, teď je na řadě zábava.
Následující postup se už bude vztahovat k vaší knize, ale princip je stejný i u jiného objektu.
Ideální je, když znáte rozměry objektu, v opačném případě se to pokuste tipnout. Nejde ani tak o to znát skutečné rozměry, jako o poměr stran.
Vytvořte si opět obdélník o rozměrech přední obálky, převeďte na inteligentní objekt a aplikujte transformaci (viz krok č.2) tak, aby kopíroval tvar obálky, to samé zopakujte u zadní části a u hřbetu knihy.
Tyto tři vrstvy označte a seskupte (Vrstva > Seskupit vrstvy) a této skupině přidejte masku, kterou jste si vytvořili na začátku. Já říkal, že se ještě bude hodit :). Skupinu posuňte pod vrstvy s odlesky a vnitřními stíny.
Teď už jen dvakrát klikněte na jednotlivé vrstvy ve skupině, sem vložte svůj design, uložte soubory a otevřete si něco dobrého, je čas slavit, jste ve finále a máte vlastní mockup.
mockup kniha ke stažení zdarma
A protože jste dočetli až sem (anebo odrolovali :), tady slíbený dárek, mockup knihy ve formátu psd ke stažení zcela zdarma.
Soubor poskytuji pod licencí CC0, můžete stahovat, upravovat a šířit dál jak se vám zachce, a to jak pro soukromé, tak i pro komerční účely.
