Eksportowanie obrazów i animowanych plików GIF

  1. Podręcznik użytkownika programu Adobe Animate
  2. Wprowadzenie do programu Animate
    1. Nowości w programie Animate
    2. Słownik wizualny
    3. Wymagania systemowe programu Animate
    4. Skróty klawiaturowe programu Animate
    5. Praca z wieloma typami plików w programie Animate
  3. Animacja
    1. Podstawowe informacje o animacjach w programie Animate
    2. Korzystanie z klatek i klatek kluczowych w programie Animate
    3. Animacja klatka po klatce w programie Animate
    4. Praca z animacjami klasycznymi w programie Animate
    5. Narzędzie Pędzel
    6. Linie pomocnicze ruchu
    7. Animacje ruchu a język ActionScript 3.0
    8. Informacje o animacjach ruchu
    9. Animacje ruchu
    10. Tworzenie animacji ruchu
    11. Używanie klatek kluczowych właściwości
    12. Animowanie położenia za pomocą klatek pośrednich
    13. Edytowanie animacji ruchu za pomocą Edytora ruchu
    14. Edytowanie ścieżki ruchu animacji
    15. Operacje na animacjach ruchu
    16. Dodawanie własnych krzywych dynamiki
    17. Tworzenie i stosowanie ruchów predefiniowanych
    18. Konfigurowanie zakresów animacji
    19. Praca z animacjami ruchu zapisanymi jako pliki XML
    20. Porównanie animacji ruchu i animacji klasycznych
    21. Animowanie kształtów metodą klatek pośrednich
    22. Animacja oparta na narzędziu Kość w programie Animate
    23. Tworzenie konstrukcji postaci w programie Animate
    24. Używanie warstw maskujących w programie Adobe Animate
    25. Praca ze scenami w programie Animate
  4. Funkcje interaktywne
    1. Tworzenie przycisków w programie Animate
    2. Konwertowanie projektów programu Animate na dokumenty innych typów
    3. Tworzenie i publikowanie dokumentów HTML5 Canvas w programie Animate
    4. Programowanie elementów interaktywnych za pomocą wycinków kodu w programie Animate
    5. Tworzenie własnych składników HTML5
    6. Używanie składników w zawartości HTML5 Canvas
    7. Tworzenie własnych składników: przykłady
    8. Wycinki kodu dla składników dostosowanych
    9. Sprawdzone procedury — reklama oparta na programie Animate
    10. Tworzenie i publikowanie materiałów rzeczywistości wirtualnej
  5. Przestrzeń robocza i obieg pracy
    1. Tworzenie pędzli malarskich i zarządzanie nimi
    2. Używanie czcionek Google Fonts w dokumentach HTML5 Canvas
    3. Korzystanie z Bibliotek Creative Cloud w programie Adobe Animate
    4. Korzystanie ze stołu montażowego i panelu Narzędzia w programie Animate
    5. Obieg pracy i przestrzeń robocza w programie Animate
    6. Używanie czcionek internetowych w dokumentach HTML5 Canvas
    7. Osie czasu a język ActionScript
    8. Praca z wieloma osiami czasu
    9. Ustawianie preferencji
    10. Korzystanie z paneli narzędziowych programu Animate
    11. Tworzenie warstw na osi czasu w programie Animate
    12. Eksportowanie animacji do aplikacji mobilnych i platform gier
    13. Przesuwanie i kopiowanie obiektów
    14. Szablony
    15. Znajdowanie i zamienianie w programie Animate
    16. Cofanie, ponawianie i panel Historia
    17. Skróty klawiaturowe
    18. Korzystanie z osi czasu w programie Animate
    19. Tworzenie rozszerzeń HTML
    20. Opcje optymalizacji obrazów i animowanych plików GIF
    21. Eksportowanie ustawień obrazów oraz plików GIF
    22. Panel Zasoby w programie Animate
  6. Multimedia i wideo
    1. Przekształcanie i łączenie obiektów graficznych w programie Animate
    2. Tworzenie i obsługa wystąpień symboli w programie Animate
    3. Obrys obrazu
    4. Używanie dźwięku w programie Adobe Animate
    5. Eksportowanie plików SVG
    6. Tworzenie plików wideo do używania w programie Animate
    7. Dodawanie wideo w programie Animate
    8. Praca z punktami sygnalizacji wideo
    9. Rysowanie i tworzenie obiektów w programie Animate
    10. Przekształcanie linii i kształtów
    11. Obrysy, wypełnienia, i gradienty w programie Animate CC
    12. Korzystanie z programów Adobe Premiere Pro i After Effects
    13. Panel Kolory w programie Animate CC
    14. Otwieranie plików programu Flash CS6 w programie Animate
    15. Praca z tekstem klasycznym w programie Animate
    16. Umieszczanie kompozycji w programie Animate
    17. Zaimportowane bitmapy w programie Animate
    18. Grafika 3D
    19. Praca z symbolami w programie Animate
    20. Rysowanie linii i kształtów przy użyciu programu Animate
    21. Praca z bibliotekami w programie Animate
    22. Eksportowanie dźwięków
    23. Zaznaczanie obiektów w programie Animate CC
    24. Praca z plikami AI programu Illustrator w programie Animate
    25. Stosowanie wzorków przy użyciu narzędzia Rozpylacz
    26. Stosowanie trybów mieszania
    27. Układanie obiektów
    28. Automatyzacja zadań za pomocą menu Polecenia
    29. Teksty wielojęzyczne
    30. Korzystanie z kamery w programie Animate
    31. Korzystanie z programów Animate i Adobe Scout
    32. Praca z plikami programu Fireworks
    33. Filtry graficzne
    34. Dźwięk a język ActionScript
    35. Preferencje rysowania
    36. Rysowanie za pomocą narzędzia Pióro
  7. Platformy
    1. Konwertowanie projektów programu Animate na dokumenty innych typów
    2. Obsługa platform niestandardowych
    3. Tworzenie i publikowanie dokumentów HTML5 Canvas w programie Animate
    4. Tworzenie i publikowanie dokumentów WebGL
    5. Pakowanie aplikacji na potrzeby środowiska AIR for iOS
    6. Publikowanie aplikacji dla środowiska AIR for Android
    7. Publikowanie dla środowiska AIR na komputery
    8. Ustawienia publikowania kodu ActionScript
    9. Sprawdzone procedury — porządkowanie kodu ActionScript w aplikacji
    10. Korzystanie z kodu ActionScript w programie Animate
    11. Sprawdzone procedury — wskazówki dotyczące ułatwień dostępu
    12. Ułatwienia dostępu w przestrzeni roboczej programu Animate
    13. Pisanie skryptów i zarządzanie nimi
    14. Włączanie obsługi platform niestandardowych
    15. Omówienie obsługi platform niestandardowych
    16. Tworzenie zawartości z ułatwieniami dostępu
    17. Praca z wtyczkami obsługi platform niestandardowych
    18. Debugowanie kodu ActionScript 3.0
    19. Włączanie obsługi platform niestandardowych
  8. Eksportowanie i publikowanie
    1. Eksportowanie plików z programu Animate CC
    2. Publikowanie plików OAM
    3. Eksportowanie plików SVG
    4. Eksportowanie grafiki i wideo w programie Animate
    5. Publikowanie dokumentów ActionScript 3.0
    6. Eksportowanie animacji do aplikacji mobilnych i platform gier
    7. Eksportowanie dźwięków
    8. Eksportowanie plików wideo QuickTime
    9. Sterowanie zewnętrznym odtwarzaniem wideo przy użyciu kodu ActionScript
    10. Sprawdzone procedury — wskazówki dotyczące tworzenia zawartości dla urządzeń przenośnych
    11. Sprawdzone procedury — konwencje dotyczące wideo
    12. Sprawdzone procedury — wskazówki dotyczące tworzenia aplikacji SWF
    13. Sprawdzone procedury — określanie struktury pliku FLA
    14. Sprawdzone procedury optymalizowania plików FLA dla programu Animate
    15. Ustawienia publikowania kodu ActionScript
    16. Określanie ustawień publikowania w programie Animate
    17. Eksportowanie plików projektora
    18. Eksportowanie obrazów i animowanych plików GIF
    19. Szablony publikowania w formacie HTML
    20. Korzystanie z programów Adobe Premiere Pro i After Effects
    21. Szybkie udostępnianie i publikowanie animacji

W tym artykule przedstawiono metody eksportowania obrazów i animowanych plików GIF.

W programie Animate wprowadzono funkcje Eksportuj obraz oraz Eksportuj animowany plik GIF. Dzięki nim można wygodnie i interaktywnie eksportować zasoby do formatów PNG i JPEG oraz statycznego lub animowanego formatu GIF.

Przygotowując obrazy do prezentacji w Internecie, staje się często przed koniecznością rezygnacji z idealnej jakości obrazu na rzecz zmniejszenia jego pliku.

Do optymalizacji służą funkcje optymalizacyjne w oknie dialogowym Eksportowanie obrazu, które umożliwiają podgląd zoptymalizowanych obrazów w różnych formatach i z różnymi atrybutami. Można jednocześnie wyświetlać wiele wersji jednego obrazu i modyfikować ustawienia optymalizacji, podglądając jej efekty. Pozwala to wybrać kombinację ustawień najlepiej dostosowaną do potrzeb użytkownika. Można również określać opcje przezroczystości i otoczki, sterować ditheringiem oraz zmieniać wymiary obrazu, podając nową wielkość w pikselach lub jako procent oryginalnej wielkości

Zapisując zoptymalizowany plik za pomocą polecenia Eksportuj obraz, można również wygenerować plik HTML dla tego obrazu. Plik ten zawiera cały kod niezbędny do wyświetlenia obrazu w przeglądarce internetowej.

W programie Animate można zapisywać obrazy w formacie GIF, JPEG lub PNG, korzystając z polecenia Zapisz jako. W zależności od formatu pliku można określać opcje jakości obrazu, przezroczystości tła lub otoczki, wyświetlania kolorów i metody pobierania. Jednak w plikach takich nie zostaną zapisane elementy ani funkcje internetowe — takie jak łącza i animacje.

Kopie folderu obrazów w formacie JPEG można zapisać także za pomocą Procesora obrazów programu Animate. Procesor obrazów może też służyć do zmieniania rozmiaru obrazów i zmieniania profilu kolorów na standardowy, stosowany w Internecie sRGB.

Eksportowanie obrazów

Za pomocą okna dialogowego Eksportowanie obrazu (Plik > Eksportuj > Eksportuj obraz oraz Plik > Eksportuj > Eksportuj animowany plik GIF) można wybrać opcje optymalizacji i wyświetlić podgląd obrazu po optymalizacji.

A. Opcje wyświetlania B. Menu podręczne Optymalizuj C. Opcje predefiniowane D. Opcje rozmiaru obrazu E. Opcje animacji F. Podgląd G. Paski narzędzi 

Podgląd obrazów w oknie dialogowym

W górnej części obszaru obrazu kliknij zakładkę, aby wybrać opcję wyświetlania:

Oryginał

Wyświetla obraz bez optymalizacji.

Optymalizacja

Wyświetla obraz po zastosowaniu bieżących ustawień optymalizacji.

2 strony

Wyświetla dwie wersje obrazu obok siebie.

Nawigacja w oknie dialogowym

Jeżeli obraz nie jest w całości widoczny w oknie dialogowym Eksportowanie obrazu, można za pomocą narzędzia Rączka przesunąć widok na inny obszar. Można także użyć narzędzia Lupka i powiększyć lub zmniejszyć bieżący widok.

  • Należy wybrać narzędzie Rączka (lub przytrzymać klawisz spacji) i przeciągnąć jego kursorem w celu wyświetlenia innego obszaru obrazu.
  • Aby to zrobić, należy wybrać narzędzie Lupka  i kliknąć na widoku, aby powiększyć wyświetlanie; przytrzymać klawisz Alt (Windows) lub Option (Mac OS) i kliknąć na widoku, aby pomniejszyć wyświetlanie.

    Można też wpisać wartość procentową powiększenia lub wybrać ją u dołu okna dialogowego.

Wyświetlanie informacji dotyczących zoptymalizowanego obrazu i czasu pobierania

Obszar adnotacji pod każdym obrazem w oknie dialogowym Eksportowanie obrazu zawiera wartościowe informacje związane z optymalizacją. W adnotacji dotyczącej oryginalnego obrazu są widoczne nazwa pliku i jego wielkość. Adnotacja zoptymalizowanego obrazu zawiera informacje o zaznaczonych opcjach optymalizacji, wielkości zoptymalizowanego pliku i szacunkowym czasie pobierania pliku przy danej szybkości modemu. Szybkość modemu można określić w wyskakującym menu Podgląd.

Podgląd obrazu przy różnych wartościach gamma

Wartość parametru gamma monitora komputerowego decyduje o jasności obrazu w przeglądarce internetowej. Istnieje możliwość symulacji podglądu obrazów na systemach używających innych wartości gamma i dokonania odpowiednich zmian tych wartości w celu wyrównania różnic. Włączenie opcji podglądu przeglądarki nie ma wpływu na ostateczną postać obrazu.

  • W oknie dialogowym Eksportowanie obrazu wybierz jedną z następujących opcji z menu Podgląd.

Kolory monitora

Parametr gamma obrazu nie jest zmieniany. Kolory monitora to ustawienie domyślne.

Starsze Macintosh (brak zarządzania kolorami)

Symulacja domyślnej wartości gamma 1.8, używanej w systemie Mac OS 10.5 oraz jego wcześniejszych wersjach.

Windows (brak zarządzania kolorami)

Symulacja domyślnej wartości gamma wynoszącej 2,2, stosowanej w systemach Windows i Mac OS 10.6 oraz ich nowszych wersjach.

Użyj profilu dokumentu

Wartość gamma jest dostosowywana do wartości określonej w profilu koloru dołączonym do dokumentu (dokument podlega systemowi zarządzania kolorem).

Optymalizowanie obrazu na potrzeby Internetu

  1. Wybierz polecenie Plik > Eksportuj obraz lub Plik > Eksportuj animowany plik GIF.

  2. W górnej części okna dialogowego kliknij zakładkę, aby wybrać opcję wyświetlania: Zoptymalizowany lub 2 na ekranie.

  3. (Opcjonalnie) Jeśli obraz zawiera wiele plasterków należy zaznaczyć plasterki przeznaczone do optymalizacji.

  4. Wybrać gotowe ustawienie optymalizacji z menu Ustawienia lub ustawić własne opcje optymalizacji. W zależności od wybranego formatu pliku są dostępne różne opcje.

  5. Poprawiać ustawienia optymalizacji, aż do uzyskania zadawalającego kompromisu między jakością obrazu i wielkością pliku. Jeśli obraz zawiera wiele plasterków, nie należy zapomnieć o zoptymalizowaniu wszystkich plasterków.

    Uwaga:

    Aby z podglądu zoptymalizowanego odtworzyć oryginalną wersję obrazu, zaznacz obraz z menu Ustawienia wybierz polecenie Oryginalny.

  6. Aby mieć pewność, że kolory na zoptymalizowanym obrazie wyglądają tak samo w różnych przeglądarkach, przekonwertuj je na standard sRGB.

    Uwaga:

    Metadane wyjściowe są zgodne ze standardami organizacji Metadata Working Group, w związku z czym niektóre metadane JPEG są przechowywane w formatach EXIF i IIM zamiast w formacie XMP.

  7. Skorzystaj z następujących opcji:

    Brak

    Brak zachowanych metadanych (z wyjątkiem informacji o prawach autorskich w formacie EXIF w plikach JPEG). Daje pliki o najmniejszym rozmiarze

    Prawa autorskie

    Zapisuje uwagi o prawie autorskim, warunkach użytkowania, stanie praw autorskich i adresach z informacjami o nich.

    Prawa autorskie i informacje kontaktowe

    Zapisuje wszystkie informacje o prawach autorskich oraz następujące informacje: twórca, stanowisko, adresy e-mail, adres, telefony, witryny internetowe.

    Wszystko oprócz informacji o aparacie

    Zapisuje wszystkie metadane z wyjątkiem danych EXIF dotyczących ustawień aparatu, takich jak czas otwarcia migawki, data i godzina, ogniskowa, kompensacja ekspozycji, wzór pomiaru oraz obecność/brak lampy błyskowej.

    Wszystko

    Zapisuje wszystkie metadane w pliku.

  8. Kliknij przycisk Zapisz..

  9. W oknie dialogowym Zapisz zoptymalizowany jako wykonaj następujące czynności i kliknij przycisk Zapisz:

    1. Wpisać nazwę pliku i wybrać lokalizację wynikowego pliku lub plików.

    2. Zaznacz opcję formatu zapisywanych plików: plik HTML i pliki obrazów, tylko pliki obrazów, tylko plik HTML.

    3. (Opcjonalnie) Ustawić opcje wyjściowe pliku HTML i plików obrazów.

    4. Jeśli obraz zawiera wiele plasterków, przejść do menu Odcięcia i wybrać opcję zapisu plasterków: Wszystkie plasterki lub Wybrane plasterki.

      Uwaga:

      Aby przywrócić ostatnio zapisaną wersję ustawień optymalizacji, należy wcisnąć klawisz Alt (Windows) lub Option (Mac OS) i kliknąć na Wyzeruj. Aby przy ponownym otwarciu okna Zapisz dla Internetu obowiązywały te same ustawienia, należy wcisnąć klawisz Alt/Option i kliknąć przycisk Zapamiętaj.

    5. Film przedstawiający zapisywanie plików dla Internetu w programie Illustrator można obejrzeć na stronie internetowej www.adobe.com/go/vid0063_pl.

Zapisywanie i usuwanie predefiniowanych ustawień optymalizacji

Ustawienia optymalizacji można zapisać w nazwanym zestawie i stosować je później do innych obrazów. Zapisane ustawienia pojawiają się w wyskakującym menu Ustawienia, obok nazw predefiniowanych ustawień. Gdy nazwany zestaw lub gotowy zestaw zostanie poddany edycji, w menu Ustawienia ukaże się pozycja “Bez nazwy”.

  1. Ustaw pożądane opcje optymalizacji i wybierz polecenie Zapisz ustawienia z menu palety Optymalizuj.

  2. Nadaj nazwę ustawieniom i zapisz je w odpowiednim folderze:

    Photoshop

    (Windows XP) Document and Settings\[Nazwa użytkownika]\Dane aplikacji\Adobe\Adobe Photoshop CS5\Optimized Settings

    (Windows Vista) Users\[Nazwa użytkownika]\AppData\Roaming\Adobe\Adobe Photoshop CS5\Optimized Settings

    (Mac OS) Użytkownicy/[Nazwa użytkownika]/Biblioteki/Preferences/AdobePhotoshop CS5Settings/Optimized Settings

    Illustrator

    (Windows XP) Document and Settings\[Nazwa użytkownika]\Dane aplikacji\Adobe\AdobeIllustrator CS5 Settings\[Język]\Save for Web Settings\Optimize

    (Windows Vista) Użytkownicy\[Nazwa użytkownika]\AppData\Roaming\Adobe\AdobeIllustrator CS5 Settings\[Język]\Save for Web Settings\Optimize

    (Mac OS) Użytkownicy/[Nazwa użytkownika]/Biblioteki/ApplicationSupport/Adobe/Adobe Illustrator CS5/[Język]/Save for Web Settings/Optimize

    Uwaga:

    Jeżeli ustawienia zostaną zapisane w innym miejscu, nie będą one dostępne w wyskakującym menu Ustawienia predefiniowane.

  3. Aby usunąć zestaw ustawień, należy zaznaczyć go w menu wysuwanym Ustawienia, przejść do menu Optymalizuj i wybrać polecenie Usuń ustawienia.

Kompresowanie grafiki internetowej do określonego rozmiaru

  1. Wybierz polecenie Plik > Eksportuj > Eksportuj obraz lub Plik > Eksportuj > Eksportuj animowany plik GIF.

  2. W górnej części okna dialogowego Eksportowanie obrazu lub Eksportowanie animowanego pliku GIF kliknij zakładkę i wybierz opcję wyświetlania obrazu: Zoptymalizowany lub 2 na ekranie. 

  3. (Opcjonalnie) Zaznacz plasterki, które mają być zoptymalizowane, i wybierz format pliku.

  4. Z menu Optymalizuj (po prawej stronie menu Ustawienia predefiniowane) wybierz opcję Optymalizuj do rozmiaru pliku.

  5. Podać wymagany rozmiar pliku.

  6. Wybrać opcję w polu Rozpocznij od:

    Bieżące ustawienia

    Jest używany bieżący format pliku.

    Automatyczny wybór GIF/JPEG

    Automatycznie wybiera optymalny format w zależności od zawartości obrazu.

  7. Za pomocą opcji Użyj określić, czy określony rozmiar pliku ma obowiązywać tylko dla bieżącego plasterka, dla wszystkich plasterków danego obrazu czy dla wszystkich plasterków. Kliknij przycisk OK.

Zmiana rozmiaru kompozycji podczas optymalizacji

W oknie dialogowym Eksportowanie obrazu można zmieniać wymiary obrazu. Nowy rozmiar można określić w wartościach bezwzględnych (pikselach) lub jako procent pierwotnego.

  1. W oknie dialogowym Eksportowanie obrazu kliknij kartę Rozmiar obrazu.

  2. Ustaw dowolne opcje dodatkowe:

    Zachowaj proporcje

    Zachowuje bieżące proporcje szerokości pikseli do ich wysokości.

    Uwaga:

    W przypadku plików SWF i SVG nie są dostępne żadne funkcje palety Rozmiar obrazu oprócz funkcji Przytnij do obszaru roboczego.

  3. Wpisz nowe wymiary wyrażone w pikselach lub określ procent o jaki ma być zmieniony rozmiar obrazu i kliknij Zastosuj.

Podgląd zoptymalizowanych obrazów w przeglądarce internetowej

Podgląd zoptymalizowanego obrazu można wyświetlić w dowolnej przeglądarce internetowej zainstalowanej na komputerze, korzystając z okna dialogowego Eksportowanie obrazu (Plik > Eksportuj > Eksportuj obraz lub Plik > Eksportuj > Eksportuj animowany plik GIF). Podgląd w przeglądarce wyświetla obraz z opisem zawierającym typ pliku, wymiary pikseli, rozmiar pliku, parametry kompresji oraz inne informacje o pliku HTML.

  • Aby wyświetlić podgląd obrazu w domyślnej przeglądarce internetowej, kliknij ikonę tej przeglądarki w dolnej części okna dialogowego Eksportowanie obrazu.
  • W oknie dialogowym Przeglądarki znajdują się wszystkie przeglądarki zainstalowane w systemie. Można tutaj ustawić przeglądarkę domyślną do podglądu obrazu.

Więcej tematów pomocy

Logo Adobe

Zaloguj się na swoje konto