Jasne, GIF-y są najbardziej znane ze swojego potencjału memów. Ale są również przydatnym narzędziem do projektowania o niskim wzroście. Udowodnimy to!
Kiedy Steve Wilhite wynalazł Graphic Interchange Format, czyli GIF, jestem prawie pewien, że nigdy nie spodziewał się, że stanie się on tak kultową częścią popkultury.
Ale GIF-y są dobre dla czegoś więcej niż wirusowych memów. W rzeczywistości, na długo przed stratosferycznym wzrostem memów, GIF-y były wykorzystywane do wielu innych celów biznesowych i marketingowych – i nadal mogą być. Małe mapy bitowe zajmują niewiele miejsca w porównaniu z ich odpowiednikami o wysokiej wierności, takimi jak JPG lub PNG. Są szeroko obsługiwane na wszystkich głównych platformach. I mają potencjał, by rzucać się daleko i szeroko.
Do czego więc nadają się GIF-y, oprócz tego, że Twoi obserwatorzy na Twitterze chichoczą lub rozświetlają nudny łańcuch e-maili?
Sposoby korzystania z GIF-ów bez memów
Ulepsz ilustracje lub diagramy
Przekazanie zawiłości tego, jak coś działa, może czasami być trudne w przypadku statycznych wizualizacji. Podobnie wykres lub diagram może nie mieć wpływu, jeśli nie ma dużego odkrycia. Animowany GIF to dobry sposób na wzbogacenie tego doświadczenia, ponieważ może bardziej dynamicznie pokazać, jak działa produkt, lub dać klientowi poczucie podróży w nieoczekiwany sposób.
Tworzenie samouczków (jak ten!)
Zamiast przedstawiać tylko wypunktowaną listę działań w następnym samouczku, dlaczego nie zaoferować miniaturowych migawek samego procesu? Zobacz na przykład drugą część tego utworu.
Prezentacje dla obecnych użytkowników
Wszyscy uwielbiają zestaw super-zgrabnych makiet interfejsu użytkownika. Ale tak dobre, jak są, nigdy nie mogą dać ogólnego wyobrażenia o tym, jak działa produkt cyfrowy. Następnym razem może dołączysz do swoich makiet zestaw animowanych GIF-ów?
Wykorzystaj je, aby pokazać, jak działają Twoje mikrointerakcje lub jak użytkownik przechodzi z jednego ekranu na drugi. Dzięki temu Twoje dema będą bardziej angażujące i zwiększą ich wartość dla interesariuszy i programistów.
Tworzenie kinematografii
Te animacje, w których tylko niewielka część zdjęcia wydaje się poruszać, podczas gdy wszystko inne pozostaje nieruchome, są proste w tworzeniu i wywierają natychmiastowy efekt. Mogą uwydatnić ujęcie produktu lub sesję zdjęciową albo zaangażować widza w krajobraz lub wydarzenie w sposób, którego nie byłyby w stanie zrobić samo z nieruchomą fotografią lub w pełni animowanym filmem.
Jak tworzyć animowane GIF-y
Po pierwsze, warto zauważyć, że GIF to tylko format pliku, taki jak .jpg, .docx, .psd lub dowolny inny plik, który można znaleźć na komputerze. Nie potrzebujesz drogiego zestawu, aby je wykonać — Twój telefon, tablet lub laptop dobrze sobie z tym poradzi — a jest mnóstwo aplikacji (zarówno darmowych, jak i płatnych), aby osiągnąć chwałę animowanego GIF-a.
Możesz utworzyć GIF na dwa sposoby:Zacznij od zestawu obrazów i połącz je, aby utworzyć animację. Lub zacznij od materiału wideo i przekonwertuj go na format GIF.
Na potrzeby tego samouczka przyjmę to pierwsze. Używam Photoshopa, ale jeśli nie masz tego programu, są inne oferty do wyboru, takie jak GIPHY.
Krok 1
Najpierw przenieśmy wszystkie nasze obrazy do Photoshopa (lub preferowanej aplikacji). W programie Photoshop przejdź do Plik> Skrypty> Załaduj pliki do stosu .
Załaduj warstwy pojawi się okno dialogowe. Jest to w zasadzie fantazyjny selektor zasobów, więc kliknij Przeglądaj . Wybierz swoje obrazy, a pojawią się one w Plikach źródłowych Sekcja. Kliknij OK .
Photoshop otworzy się teraz, a każdy z twoich plików zostanie załadowany do stosu, każdy na osobnej warstwie.
Wskazówka: Zmień kolejność warstw, tak aby pierwszy obraz pojawił się na górze stosu, a ostatni na dole. Jest to łatwiejsze niż późniejsze ich przestawianie. Może być konieczne kliknięcie widoczności każdej warstwy „włączone” lub „wyłączone”. Zrób to, klikając oko ikona.
Krok 2
Następnie przejdź do opcji menu i wybierz Okno> Oś czasu , który otworzy oś czasu panelu, zwykle na dole okna programu Photoshop.
Znajdź menu burgerów w prawym górnym rogu osi czasu i wybierz Utwórz ramki z warstw . Dla każdej warstwy zostanie utworzona osobna ramka, ale może być odwrotnie. W takim przypadku po prostu kliknij menu z burgerami ponownie i wybierz Odwróć ramki .
Krok 3
Następnie musisz zdecydować, jak długo każda klatka będzie widoczna w animowanym pliku GIF. Jest to kwestia osobistych preferencji, a także rodzaju tworzonego GIF-a.
Pamiętaj, że każda ramka nie musi mieć tej samej długości. Jeśli chcesz zaakcentować lub przyspieszyć niektóre punkty, nie krępuj się. Kliknij strzałkę w dół pod każdą ramką, a będziesz mieć opcje szybkości (wyrażony w sekundach).
Wskazówka: Możesz zaznaczyć więcej niż jedną klatkę naraz, aby zmienić szybkość wszystkich zaznaczonych klatek — wystarczy kliknąć klatki z wciśniętym klawiszem Shift.
Krok 4
Aby zobaczyć, jak będzie wyglądał GIF, kliknij Odtwórz przycisk i patrz, jak dzieje się magia!
Gdy będziesz zadowolony ze swojego dzieła, po prostu przejdź do Plik> Eksportuj> Zapisz do internetu (starsza wersja) i pojawi się dość skomplikowane okno dialogowe. Nie przejmuj się, będziesz musiał zmienić tylko jedną opcję.
W ustawieniach po prawej stronie wybierz GIF 128 Dithered . Spowoduje to utworzenie nieco większego rozmiaru pliku niż inne opcje, ale zatrzyma wszelkie pasma występujące w końcowym GIF-ie.
Teraz naciśnij Zapisz i gotowe!
Wielka debata o GIF-ach
Nie można napisać artykułu o GIF-ach, nie wspominając o bardzo energicznej, długotrwałej debacie wokół tego, jak w ogóle mówi się GIF . Krótko mówiąc, są dwa obozy — ci, którzy to wymawiają ghifs i ci, którzy to wymawiają jiffs .
Giffery uwierz w trudne G jest odpowiednia głównie ze względu na słowo, które G reprezentuje — grafika , który jest wymawiany za pomocą twardego G .
Z drugiej strony jiffers powiedz to, gdy G poprzedza I , na przykład w magii , marża , pochodzenie lub silnik , słowo jest wymawiane z miękkim G .
Pomimo tego, że sam twórca spada na stronę jiffów , sonda za sondą pokazuje, że większość ludzi to ghiffy . Wojna trwa. Przynajmniej teraz wiesz, jak zrobić o tym mema.
Więcej o ruchomej grafice i projektowaniu, tylko dla Ciebie:
- NEON:Darmowy animowany krój pisma – 36 DARMOWYCH ruchomych elementów graficznych
- Przebiegła i ciągła moc projektowania ruchu
- Dziennik projektanta grafiki:zwiedzanie Japonii poprzez projektowanie
- Low-Poly Design:stenografia 3D i trend w projektowaniu graficznym
- Wskazówki projektowe, które każda legalna, przyjazna dla środowiska marka musi znać
Obraz na okładkę za pośrednictwem Vera Reva.