Uwaga:

Do programu Adobe Muse nie są już dodawane nowe funkcje, a jego obsługa zostanie wycofana 26 marca 2020 r. Aby uzyskać szczegółowe informacje i pomoc, zobacz stronę na temat wycofania usługi Adobe Muse.

Usprawnienia w Adobe Muse CC 2015.1 / Luty 2016 r.

Możesz sprawić, że Twój projekt będzie bardziej interesujący i angażujący, stosując przejścia stanów do różnych obiektów na stronie internetowej. Możesz również ustawić opóźnienie, czas trwania i opcje czasu dla każdego przejścia stanu, w każdym obiekcie.

Zmiany faz i blasków w stanach są obsługiwane w przejściu stanów.

Omówienie różnych stanów obiektów

Podczas interakcji z użytkownikiem stan obiektu decyduje o jego wyglądzie. Interakcje te mogą polegać na najechaniu wskaźnikiem myszy (nazywane także najazdem), kliknięciu itd. Podczas interakcji z obiektem dochodzi do przejścia ze stanu zwykłego w inne stany. Dzięki programowi Adobe Muse takie przejścia przebiegają bez zakłóceń.

W programie Adobe Muse można zastosować stany do różnych typów obiektów, takich jak tekst, kontenery widżetów (wszystkich typów widżetów), obrazy, hiperłącza, przyciski itd. Stany mogą przyjmować style graficzne, akapitowe, znakowe itd.

Jakie stany obiektów występują w programie Adobe Muse?

W programie Adobe Muse dostępne są następujące stany, umożliwiające zmianę wyglądu obiektu na podstawie interakcji użytkownika. 

  • Zwykły: stan zwykły określa domyślny wygląd obiektu po wczytaniu strony. Pozwala to na zdefiniowanie stanu obiektu dla braku interakcji. Obiekt przechodzi ze stanu Zwykły w inne stany.
  • Wciśnięty klawisz myszy: stan Wciśnięty klawisz myszy decyduje o wyglądzie obiektu przy wciśniętym przycisku myszy. 
  • Najazd: stan najazd umożliwia zmianę wyglądu obiektu po umieszczeniu wskaźnika myszy na obiekcie. Za pomocą stanu Najazd można w łatwy sposób rozpoznać obiekty interaktywne na stronie internetowej.
  • Aktywny: stan Aktywny decyduje o wyglądzie obiektu, jeśli jest on aktywny i został już kliknięty. Może to być na przykład naciśnięcie przycisku lub wybranie opcji menu.
    Wskazuje to, że obiekt jest w użyciu podczas przejścia w stan aktywny. Stany aktywne można zdefiniować dla wszystkich rodzajów obiektów, w tym hiperłączy.

Przypisywanie stanów do obiektów

Domyślnie wszystkim obiektom są przypisywane wszystkie cztery stany. W programie Adobe Muse każdy z nich można jednak oddzielnie dostosować za pomocą panelu Stany.

Uwaga:

Podczas pracy ze stanami ważne jest, aby śledzić zaznaczenia za pomocą Wskaźnika zaznaczenia. Wynika to z faktu, że program Adobe Muse domyślnie umożliwia edytowanie stanu Zwykły obiektu. Oznacza to, że nawet po edycji stanu Aktywny obiektu A, wybraniu obiektu B i cofnięciu zaznaczenia obiektu A program przyjmuje stan Zwykły. Dlatego ważne jest, aby w panelu Stany wyraźnie zaznaczać stan, który ma być edytowany przed każdorazową stylizacją obiektu.

Domyślnie zmiany edycyjne na obiekcie zostają zapisane jako stan Zwykły. Jednak program Muse umożliwia przełączenie do innego stanu za pomocą panelu Stany oraz stylizację obiektu, aby lepiej dostosować go do własnych potrzeb. Edytując osobno każdy stan, można skoncentrować się na sposobie zachowania obiektu dla każdego typu interakcji.

Aby dostosować lub edytować stan obiektu, należy wykonać następujące kroki.

  1. Otwórz panel Stany, klikając opcję Okno > Stany.
  2. Zaznacz obiekt, którego stan chcesz edytować.
  3. Wybierz Stan, który chcesz edytować, i kontynuuj stylizację obiektu.
  4. W panelu Stany wybierz Przejście, a następnie wybierz opcję Blaknięcie. Ustaw Opóźnienie, Czas trwania i Prędkość dla przejścia. Po wybraniu opcji Przejście obiekt będzie przechodzić od jednego stanu do drugiego zgodnie z ustawieniami.
Podczas stylizacji obiektu można także wybrać stan za pomocą menu rozwijanego Wskaźnik zaznaczenia.

Przypisywanie stanów widżetom i kontenerom widżetów

  1. Zamknij przeglądarkę i powróć do programu Adobe Muse.

  2. Kliknij widżet jeden raz, aby zaznaczyć całe menu. Kliknij przycisk „food”, aby zaznaczyć pozycję menu „food”. Jeśli przez przypadek klikniesz po raz trzeci, a Wskaźnik zaznaczenia wyświetli słowo Etykieta, naciśnij klawisz Esc, aby przeskoczyć o jeden poziom wyżej w hierarchii. We wskaźniku zaznaczenia pojawi się słowo Pozycja menu.

    Ponieważ opcja Edytuj razem jest włączona w panelu Opcje, wszelkie zmiany w wyglądzie pozycji menu „food” zostaną zastosowane wobec pozostałych przycisków w widżecie Menu poziome. Dzięki temu edytowanie trwa krócej. Domyślna opcja Edytuj razem powinna być włączona, o ile projekt witryny nie wymaga zastosowania odrębnej stylizacji wobec poszczególnych przycisków.

    Wskaźnik zaznaczenia ustawiony na pozycję menu
  3. Otwórz panel Stany, klikając jego kartę lub wybierając polecenie Okno > Stany.

    Panel ten umożliwia edytowanie różnych sposobów wyświetlania grafiki przycisku w zależności od operacji wykonywanej kursorem przez gościa witryny. Zwróć uwagę, że istnieje kilka szarych pól, które określają wygląd każdego stanu.

    W podglądzie witryny można było zauważyć, że stan Zwykły odnosi się do wyglądu menu po pierwszym wczytaniu strony, gdy kursor gościa nie został jeszcze użyty na żadnym elemencie. Jeśli osoba odwiedzająca witrynę umieści kursor na przycisku, zostaną wyświetlone style zastosowane wobec stanu Najazd. Jeśli osoba odwiedzająca naciśnie ten przycisk, zostaną wyświetlone style zastosowane wobec stanu Wciśnięty klawisz myszy. Wreszcie, jeśli gość znajduje się na danej stronie witryny (np. kliknął pozycję menu about i wciąż przegląda stronę about), wygląd przycisku odpowiada ustawieniom stanu Aktywny. Ostatni stan jest opcjonalny, jednak przydaje się w niektórych sytuacjach i np. pozwala gościom zorientować się, na której stronie aktualnie przebywają.

    Stany przycisków
  4. W panelu Stany kliknij każdą z pozycji na liście: Zwykły, Najazd, Wciśnięty klawisz myszy i Aktywny. Zwróć uwagę, że w miarę klikania kolejnych stanów w panelu widżet Menu na stronie aktualizuje się i wyświetla domyślny wygląd stanu.

  5. Kliknij ponownie stan Zwykły. Zaznaczywszy pozycję menu „Home”, kliknij ikonę koloru wypełnienia i wybierz całkowicie inny kolor, np. czerwony. Po ustawieniu innego koloru wypełnienia wszystkie pozycje menu aktualizują stan Zwykły, ponieważ opcja Edytuj razem jest włączona.

    Opcje stanu przycisku
    Po zaktualizowaniu koloru wypełnienia dla jednego stanu przycisku pozostałe przyciski zostają automatycznie zaktualizowane, ponieważ opcja Edytuj razem jest włączona.

  6. Wybierz opcję Przejście, a następnie wybierz Blaknięcie. Przejście między stanami obiektu wiąże się z jego wyblaknięciem lub rozjaśnieniem, zgodnie z ustawieniami.

    Po wybraniu opcji przejścia z jednego stanu do drugiego można ustawić następujące opcje:

    Opóźnienie: opóźnienie przejścia z jednego stanu do drugiego, w sekundach.

    Czas trwania: czas trwania przejścia.

    Prędkość: w tym miejscu można utworzyć przejście liniowe lub ułatwić przejście do kolejnego stanu. Możesz także wybrać opcje Zmniejsz tempo, Zwiększ tempo lub Zmniejsz/zwiększ tempo. Przejście obiektu zwalnia lub przyspiesza zgodnie z ustawieniami.

  7. Wybierz ponownie polecenie Plik > Podgląd witryny w przeglądarce, aby sprawdzić dostosowany stan Zwykły przycisku. Po pierwszym załadowaniu menu wszystkie przyciski są czerwone poza tym, który oznacza bieżącą stronę. Po najechaniu kursorem na każdy z przycisków jest wyświetlany domyślny szary kolor stanu Najazd, który tworzy efekt najazdu.

  8. Na potrzeby tego przykładu zaznacz każdy ze stanów w panelu Stany (lub zaznacz każdy z nich za pomocą menu Stany obok wskaźnika zaznaczenia w panelu sterowania) i ustaw kolor wypełnienia na brak (biała próbka z ukośną czerwoną kreską). To ustawienie usuwa kontury przycisków pozycji menu z widoku, dzięki czemu stają się przezroczyste i widać przez nie tło.

W chwili sporządzania tego artykułu zewnętrzny kontener widżetu menu poziome jest domyślnie przezroczysty. Jeśli jednak zajdzie taka potrzeba można ustawić kolor jego wypełnienia za pomocą próbnika kolorów wypełnienia w taki sam sposób, jak ma to miejsce w przypadku kontenerów przycisków pozycji menu. Podczas tworzenia własnych witryn w przyszłości można eksperymentować z ustawieniem koloru wypełnienia całego widżetu oraz różnych kolorów wypełnienia dla poszczególnych przycisków. Przyciski można również tworzyć, dodając obraz tła.

Ta zawartość jest licencjonowana na warunkach licencji Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License  Posty z serwisów Twitter™ i Facebook nie są objęte licencją Creative Commons.

Informacje prawne   |   Zasady prywatności online