Jak zrobić kinografię w Photoshopie

Opublikowany: 2023-03-03

Kinografiki to od kilku lat jeden z moich ulubionych trendów w projektowaniu. Stanowią oszałamiającą mieszankę zdjęć i filmów, dzięki czemu stanowią eleganckie dzieło sztuki dla Twojej witryny, które dodaje odrobinę tajemniczości.

Jest też kluczowy praktyczny powód, dla którego kinografiki są świetne: mały rozmiar pliku. O wiele łatwiej jest dodać krótkie momenty ruchu do swojej witryny, w przeciwieństwie do całego pliku wideo! Ale poza logistyką jest jeszcze jeden ostatni powód, dla którego kinografiki są tak magiczne: w rzeczywistości są o wiele łatwiejsze do stworzenia, niż mogłoby się wydawać!

Gotowy żeby zacząć? Przysuń krzesło, otwórz program Photoshop i wykonaj siedem prostych kroków, aby stworzyć własny kinograf!

1. Wybierz swój plik wideo

Aby utworzyć kinografię, zacznij od podstawowego pliku wideo. Idealnie byłoby, gdybyś sam nakręcił film, aby był on specyficzny dla Twojej firmy i idealnie pasował do Twojej marki, ale jeśli tylko eksperymentujesz, pobranie standardowego wideo będzie działać dobrze!

W tym samouczku używam filmu, który nakręciliśmy w domu z trasy Jenga na zwykłym niebieskim tle. (Ten sam plik otrzymasz, jeśli zapiszesz się na kurs Design Trends!)

Wieża Jengi

Wybierając idealne wideo do kinografu, należy pamiętać o kilku rzeczach:

  • Aparat musi pozostać nieruchomy przez cały czas. Jeśli sam kręcisz film, wykop stary statyw, aby wszystko było jak najbardziej stabilne. Jeśli przeglądasz opcje na akcje, szukaj jak najmniejszego ruchu!
  • Ruch, który chcesz zachować, powinien być łatwy do wyizolowania. Jeśli obiekty krzyżują się przed sobą lub poruszają się po całym ekranie, trudniej będzie wyizolować pożądany ruch przy jednoczesnym utrzymaniu nieruchomego tła.
  • Wideo powinno się zapętlić . Aby kinograf był ponadczasowy, musi się zapętlać. Chociaż Photoshop może zdecydowanie pomóc w wygładzeniu, najłatwiej jest użyć wideo, które można łatwo zapętlić lub ma odwracalny początek i koniec.

Po uzyskaniu pliku wideo możesz załadować go do programu Photoshop.

2. Zaimportuj plik wideo

Po uruchomieniu programu Photoshop przejdź do Plik > Otwórz . Wybierz plik, a zobaczysz wideo jako warstwę. Jeśli nie pojawi się automatycznie, upewnij się, że możesz zobaczyć oś czasu, przechodząc do opcji Okno > Oś czasu .

Edycja osi czasu w Photoshopie

Zauważysz, że plik wideo jest automatycznie umieszczany w grupie „Grupa wideo 1”. Możesz go tam zostawić, ale jeśli przeszkadza Ci tylko jedna warstwa w grupie, możesz wyciągnąć warstwę wideo i usunąć grupę! To nie jest konieczne.

3. Wyczyść oś czasu

Odtwórz plik wideo kilka razy – czy potrzebujesz całości? Jeśli przed sekcją lub po niej znajduje się dodatkowy materiał filmowy, na którym chcesz się skupić, przytnij plik, aby nie przeszkadzał. Możesz to zrobić, klikając krawędź pliku na osi czasu i przeciągając go do żądanego znacznika czasu.

Jeśli plik wideo jest długi i masz problem z wyświetleniem całości lub dotarciem do wybranego miejsca, możesz użyć skali u dołu okna osi czasu, aby powiększyć lub pomniejszyć.

Uwaga: Część pliku, którą przycinasz, nadal zostanie zapisana, więc nie martw się o utratę danych! Zawsze możesz kliknąć i przeciągnąć krawędź z powrotem, jeśli zdecydujesz, że potrzebujesz później określonej części.

Jak wyczyścić oś czasu

Mój oryginalny plik wideo zakończył się przewróceniem wieży Jenga, co nie byłoby łatwe do zapętlenia. Więc wyciąłem tę część i przyciąłem trochę od samego początku, aby uprościć czas, z którym pracowałem!

Po zakończeniu czyszczenia osi czasu nadszedł czas, aby ukryć ruch, którego nie chcesz.

4. Utwórz warstwę maskującą

Teraz stworzysz „fotograficzny” aspekt kinografu. Zatrzymaj wideo na „obrazie”, który chcesz utworzyć, a następnie zaznacz cały obszar. Skopiuj i wklej to do nowej warstwy.

Jak utworzyć warstwę maskującą

Jeśli klikniesz odtwarzanie, zauważysz, że teraz nie możesz zobaczyć żadnego filmu, ponieważ jeszcze późniejszy jest na górze. Teraz czas na dodanie maski, która pozwoli nam wybrać dokładny ruch, który chcemy pokazać!

Śmiało dodaj maskę warstwy, korzystając z opcji na dole panelu Warstwy lub przechodząc do Warstwa > Maska warstwy > Pokaż wszystko.

Jak odsłonić warstwę maskującą

5. Odizoluj ruch

Upewnij się, że wybrano Maskę warstwy (zamiast samej warstwy), a następnie chwyć narzędzie Pędzel. Podobnie jak w przypadku każdej maski, szczotkowanie czernią ukryje maskę (odsłaniając zawartość z warstwy pod spodem), podczas gdy szczotkowanie bielą odsłoni maskę (ukrywając zawartość warstwy pod spodem).

W tym przykładzie chciałem, aby ruch wieży Jenga był widoczny, podczas gdy wskazówki pozostają nieruchome. Aby to osiągnąć, pomalowałem maskę na czarno na szczycie wieży, a resztę zostawiłem na biało.

Spojrzenie na to, jak wyizolować ruch w Photoshopie

Pozwala to wyizolować ruch, ujawniając tylko ten ruch, który chcesz pokazać na kinografie, podczas gdy reszta pozostaje zamrożona.

6. Eksportuj jako GIF

Gdy będziesz zadowolony ze swojego kinografu, czas go wyeksportować! Po prostu przejdź do Plik > Eksportuj > Zapisz dla Internetu (starsza wersja) . Istnieje wiele opcji, z którymi możesz eksperymentować, ale dwie najważniejsze to:

  1. Zapisz jako gif (znajduje się w górnej części okna dialogowego)
  2. Ustaw opcje pętli na Zawsze (znajdujące się w dolnej części okna dialogowego)

Zawsze istnieje pewna równowaga między rozmiarem pliku a jakością, więc zdecydowanie polecam eksperymentowanie z ustawieniami, aby upewnić się, że otrzymujesz dokładnie taki eksport, jakiego potrzebujesz.

Gif chwiejnej wieży jenga

I to wszystko! Właśnie stworzyłeś swój własny kinograf, aby podzielić się nim ze światem. Jak wyszło? Chcielibyśmy wiedzieć w komentarzach.

Jak korzystać z pliku Photoshop

Gdy otworzysz ten plik w Photoshopie, zobaczysz gotowy kinograf. Możesz go używać, jeśli chcesz, lub możesz się pobawić i zobaczyć, jak wszystko skonfigurowaliśmy!

Zacznij od zdemaskowania wszystkich warstw, z wyjątkiem „Nagrania podstawowego”. To jest oryginalny plik filmowy, od którego zaczęliśmy. Jeśli klikniesz przycisk odtwarzania, będziesz mógł zobaczyć, jak bardzo porusza się ręka, aby potrząsnąć planszą Jenga!

Następnie dodaliśmy warstwę maskującą, aby wyizolować ruch, i powiem wam – wybór takiego geometrycznego kształtu na jednolitym tle sprawił, że proces maskowania był bardzo prosty! W zależności od pliku wideo może być konieczne podanie nieco większej dokładności, ale pozostawiamy to Tobie.

Następnie postanowiliśmy skupić się tylko na fragmencie filmu, który dobrze się zapętlił, aby stworzyć ponadczasowy efekt. Zostawiliśmy tam jednak cały plik, abyś mógł zobaczyć całość!

Na koniec zmieniliśmy krzywe, aby poprawić niektóre kolory w pliku. Może to być konieczne lub nie, w zależności od filmu, ale pamiętaj: zawsze możesz kontynuować edycję po utworzeniu kinografu!

I to wszystko! Masz kinograf, który jest gotowy do wyświetlenia na Twojej stronie. Powiedz nam w komentarzach poniżej: Co zamierzasz stworzyć z tym trendem?