Mockup i obiekty inteligentne

Mockup (czyt. mokap) to makieta, dzięki której możesz zaprezentować swój projekt i zobaczyć jak będzie wyglądał jako gotowy produkt. Może to być prezentacja serwisu www, aplikacji mobilnej, wizytówki, nadruku na t-shircie lub kubku, etc.

Kilkakrotnie spotkałam się na różnych stronach/blogach nad zachwytami typu wow, a jak wkleiłaś/eś to w tego laptopa? - to nic innego jak mockup. Mockupy to głównie zdjęcia wysokiej jakości lub realistyczne grafiki z dopasowanymi obiektami inteligentnymi, dzięki którym bardzo szybko możesz podmienić grafikę na swoją. Takie makiety można oczywiście robić samemu, jednak jest to trochę czasochłonne zajęcie.

W czasach, kiedy gonią nas deadline'y lub najzwyklej na świecie "nie umiemy w grafikę", ale fajnie by było coś wkleić w ekran laptopa lub smartfona - możemy posłużyć się darmowymi mockupami. Najprościej wpisać w Google "free mockup", jednak osobiście polecam Mockupworld. Znajdziesz tam dużo różnych darmowych plików, dodatkowo jest teraz do pobrania niemała paczka naprawdę fajnych i przydatnych mokapów.

Jak podmienić grafikę na swoją - obiekt inteligentny

Powyższy mockup pochodzi z darmowej paczki Mockupworld i tak wygląda przykładowa wersja z moim zdjęciem i tekstem. Niestety, a może stety każdy mockup jest plikiem PSD to znaczy, że będzie Ci potrzebny program Photoshop.

  • Otwórz wybrany plik PSD w Photoshopie. Mój plik z darmowej paczki nazywa się mockupworld-macbook-pro-in-kitchen.psd

Jak widać, ten mockup nie należy do najbardziej rozbudowanych (a i takie się zdarzają). Po otworzeniu pliku usuń górną warstwę Remove Layer, interesować Cię będzie warstwa Replace me - i to jest właśnie obiekt inteligentny.

W zależności od twórcy mockupu możesz spotkać się z kolorowymi warstwami, głównie czerwonymi, a obiekty inteligentne mogą mieć różne nazwy takie jak replace me, put your design here, etc.

  • Tak naprawdę cała zabawa z podmianą grafiki trwa chwilę (o ile wcześniej przygotowałeś sobie już projekt). Obiekty inteligentne to przygotowane warstwy z odpowiednio dopasowanymi stylami warstw, z odpowiednią perspektywą w przypadku monitorów, itd.
    W celu podmienienia warstwy Replace me musisz kliknąć dwa razy - szybko - w małą ikonkę w prawym dolnym rogu:

Po kliknięciu zobaczysz dwa informacyjne komunikaty, z czego ten drugi nie zawsze będzie się pojawiał.

Zatwierdź OK.

Na tym etapie zawsze wybieram zachowaj warstwy, jeżeli wybierzesz spłaszcz też nic się nie stanie, jednak zdarzają się przypadki, kiedy jakiś przykładowy tekst lub logo ma dodatkowe style warstw i wtedy można je skopiować i na przykład trochę zmodyfikować według uznania. Dlatego lepiej wybrać zachowaj warstwy.

  • Po zatwierdzeniu komunikatów możesz zauważyć, że otworzył się nowy dokument. Tutaj dokonujesz zmian na całym obszarze, a warstwę Replace me możesz usunąć, albo ukryć (klikając na oko).

Kiedy skończysz, zamknij dokument Rechteck_1212.psb klikając w x na karcie u góry. Zapisz zmiany i podejrzyj efekt na mockupie. Zawsze możesz go zmienić, poprawić, dodać screen swojej strony www, etc.

Gotowy mockup

Istnieje również możliwość indywidualnego zaprojektowania wizytówki, w tym celu skontaktuj się ze mną.

---
Chcesz być na bieżąco z informacjami i nowymi wpisami?
Znajdziesz mnie na Facebooku, Instagramie i Twitterze.

Podziel się wpisem ze znajomymi...