Opmerking:

Adobe Muse voegt geen nieuwe functies meer toe en stopt op donderdag 26 maart 2020 met de ondersteuning. Zie de pagina Einde van levensduur voor Adobe Muse voor meer informatie en assistentie.

Verbeteringen in Adobe Muse CC 2015.1 | februari 2016

U kunt uw ontwerp interessanter en aansprekender maken door overgangen op verschillende objecten op uw webpagina toe te passen. U kunt in elk object ook de vertraging, de duur en de opties voor de timing voor elke staatovergang instellen.

Wijzigingen van schuine kant en gloed in meerdere staten wordt ondersteund voor overgangen van de ene naar de andere staat.

De verschillende staten van objecten begrijpen

De staat van een object bepaalt hoe een object eruitziet als een gebruiker met het object werkt. Bijvoorbeeld hoe het object eruitziet als de muis erboven wordt gehouden (een zgn. rollover), als op het object wordt geklikt, enz. Wanneer interactie wordt uitgevoerd op een object, gaat dat object over van de standaardstaat (de staat Normaal) op een andere staat. Voor dergelijke interacties heeft Adobe Muse vloeiende overgangen toegevoegd.

In Adobe Muse kunt u staten toewijzen aan verschillende typen objecten, zoals tekst, widgetcontainers (van alle typen widgets), afbeeldingen, hyperlinks, knoppen, enzovoort. Staten kunnen afbeeldingsstijlen, alineastijlen, tekenstijlen, enzovoort aannemen.

Wat zijn de verschillende staten voor een object in Adobe Muse?

Adobe Muse biedt de volgende staten waarmee u de weergave van een object op basis van gebruikersinteractie kunt opmaken en wijzigen. 

  • Normaal: de staat Normaal bepaalt de standaardweergave van een object tijdens het laden van de webpagina. Hiermee kunt u de staat van het object instellen wanneer er geen interactie is. Een object gaat van de staat Normaal over op een andere staat.
  • Muisknop ingedrukt: de staat Muisknop ingedrukt bepaalt hoe een object eruitziet als erop wordt geklikt en de muis niet wordt losgelaten. 
  • Rollover: met de staat Rollover kunt u de weergave van een object wijzigen wanneer u de muis over het object beweegt. Het gebruik van de staat Rollover is een van de gemakkelijkste manieren om onderscheid te maken tussen een interactief object en een niet-interactief object op een webpagina.
  • Actief: De actieve staat definieert de weergave van een object wanneer het actief is en er al op is geklikt. Bijvoorbeeld wanneer op een knop is geklikt of wanneer een menu is geselecteerd.
    Wanneer het object overgaat op de status Actief, betekent dat dat het object in gebruik is. Actieve staten kunnen ook worden gedefinieerd voor alle typen objecten, zoals hyperlinks.

Staten toewijzen aan objecten

Aan alle objecten worden standaard alle vier staten toegewezen. Met het deelvenster Staten in Adobe Muse kunt u elk van deze staten echter afzonderlijk aanpassen.

Opmerking:

Als u werkt met staten, is het belangrijk dat u uw selecties bijhoudt met gebruik van de selectie-indicator. Dit komt omdat u in Adobe Muse de staat Normaal van een object standaard kunt bewerken. Dit betekent dat de staat Normaal weer wordt geactiveerd als u tijdens het bewerken van de staat Actief van Object A snel Object B selecteert en daarna weer Object A. Het is daarom belangrijk dat u in het deelvenster Staten altijd expliciet de staat selecteert die u wilt bewerken voordat u een object opmaakt.

Standaard worden op een object aangebrachte bewerkingen opgeslagen als de staat Normaal. U kunt met Muse echter overschakelen naar een andere staat via het deelvenster Staten en het object opmaken door een staat verder aan te passen. U kunt het gedrag van het object voor elk interactietype gericht aanpassen door elk van de staten afzonderlijk te bewerken.

Als u de staat van een object wilt aanpassen of bewerken, gaat u als volgt te werk:

  1. Open het deelvenster Staten door te klikken op Venster > Staten.
  2. Selecteer het object waarvan u de staat wilt bewerken.
  3. Selecteer de Staat die u wilt bewerken en maak het object verder op.
  4. Selecteer in het deelvenster Staten de optie Overgang en daarna de optie Vervagen. Stel de opties Vertraging, Duur en Snelheid van de overgang in. Wanneer u Overgang selecteert, gaat het object van de ene staat over in de andere conform uw instellingen.
Wanneer u een object opmaakt, kunt u een staat ook selecteren via de vervolgkeuzelijst in de selectie-indicator.

Staten toewijzen aan widgets en widgetcontainers

  1. Sluit de browser en ga terug naar Adobe Muse.

  2. Klik eenmaal op de widget om het gehele menu te selecteren. Klik nogmaals op de knop ''food'' om het menu-item ''food'' te selecteren. Als u per ongeluk een derde keer klikt en in de selectie-indicator het woord Label wordt weergegeven, drukt u eenmaal op Escape om één niveau in de hiërarchie omhoog te gaan, zodat het woord Menuoptie wordt weergegeven.

    Aangezien de optie Samen bewerken in het deelvenster Opties is ingeschakeld, worden alle wijzigingen die u doorvoert in de weergave van dit menu-item ''food'' toegepast op alle overige knoppen in de menuwidget Horizontaal. Hierdoor verloopt het bewerken veel sneller. Tenzij een ontwerp vereist dat u op elke knop een andere opmaak toepast, moet u de standaardinstelling van de optie Samen bewerken ingeschakeld laten.

    Selectie-indicator ingesteld op Menu-item
  3. Open het deelvenster Staten door het tabblad te selecteren of Venster > Staten te kiezen.

    Via dit deelvenster kunt u de verschillende manieren bewerken waarop de knop wordt weergegeven, afhankelijk van de activiteit van de cursor van de bezoeker. Er zijn verschillende grijze vakken die de weergave van elke staat definiëren.

    Toen u een voorvertoning van de site bekeek, zag u dat de staat Normaal verwijst naar de manier waarop het menu eruitziet wanneer de pagina voor de eerste keer wordt geladen, wanneer er geen interactie is tussen de cursor van de bezoeker en het menu. Als de bezoeker de cursor op een knop plaatst, worden de stijlen weergegeven die op de staat Rollover zijn toegepast. Wanneer de bezoeker de muisknop indrukt, worden de stijlen weergegeven die op de staat Muisknop ingedrukt zijn toegepast. Als de bezoeker zich op die actuele pagina van de site bevindt (bijvoorbeeld als hij/zij op het menu-item "about" heeft geklikt en nog steeds de pagina "about" bekijkt), ziet de knop eruit zoals u voor de staat Actief hebt ingesteld. Deze laatste staat is optioneel, maar kan in sommige gevallen handig zijn: bezoekers zien in één oogopslag welke pagina ze aan het bekijken zijn.

    Knopstaten
  4. Klik in het deelvenster Staten op elk item in de lijst: Normaal, Rollover, Muisknop ingedrukt en Actief. Terwijl u op elke staat in het deelvenster klikt, wordt de menuwidget op de pagina bijgewerkt om de standaardweergave van die staat weer te geven.

  5. Klik nogmaals op de staat Normaal. Terwijl het menu-item ''Home'' is geselecteerd, gebruikt u de vulkleurchip om een geheel andere kleur te kiezen, zoals rood. Als u een andere vulkleur instelt, wordt de staat Normaal van alle menu-items bijgewerkt, aangezien de optie Samen bewerken is ingeschakeld.

    Knopstaatopties
    Als u de vulkleur voor een van de knopstaten bijwerkt, worden de andere automatisch bijgewerkt wanneer de optie Samen bewerken is ingeschakeld.

  6. Selecteer Overgang en daarna de optie Vervagen. Bij de overgang van de ene staat naar een andere verschijnt of verdwijnt het object langzaam conform uw instellingen.

    U kunt de volgende opties instellen wanneer u de overgangsoptie van de ene staat naar de andere kiest:

    Vertraging: de vertragingstijd van de ene staat naar de andere, in seconden.

    Duur: de duur van de overgang.

    Snelheid: met deze optie kunt u de overgang naar de volgende staat lineair maken of versnellen/vertragen. U kunt ook opties voor Versnellen, Vertragen of Versnellen/vertragen instellen. De objectovergang versnelt of vertraagt conform uw instellingen.

  7. Kies nogmaals Bestand > Voorvertoning van site weergeven in browser. U ziet dan dat u de staat Normaal van de knop hebt aangepast. Wanneer het menu voor de eerste keer wordt geladen, is elke knop, behalve de knop die de huidige pagina aangeeft, nu rood. Terwijl u de cursor op elke knop zet, wordt de grijze standaardkleur voor rollovers weergegeven, waardoor een wisseleffect wordt gecreëerd.

  8. Voor dit voorbeeld selecteert u alle staten in het deelvenster Staten (u kunt ook elke staat selecteren via het menu Staten naast de selectie-indicator in het regelpaneel) en stelt u Vulkleur in op Geen (de witte kleurchip met de rode diagonale streep). Deze instelling verwijdert de knoppen van het menu-item op de achtergrond uit de weergave, zodat de menuknoppen transparant zijn en het achtergrondontwerp zichtbaar is.

Op het moment van schrijven is de buitenste container van de menuwidget Horizontaal standaard transparant. U kunt echter de vulkleurkiezer gebruiken om de vulkleur ervan in te stellen, net als bij de knopcontainers van menu-items. Wanneer u later uw eigen sites maakt, kunt u experimenteren met het instellen van een vulkleur voor de gehele widget en vervolgens een andere vulkleur instellen voor de knopcontainers. U kunt ook proberen een achtergrondafbeelding toe te voegen om de knoppen te ontwerpen.

Dit werk is gelicentieerd onder de Creative Commons Naamsvermelding/Niet-commercieel/Gelijk delen 3.0 Unported-licentie  De voorwaarden van Creative Commons zijn niet van toepassing op Twitter™- en Facebook-berichten.

Juridische kennisgevingen   |   Online privacybeleid