Chiudete il browser e tornate ad Adobe Muse.
Ultimo aggiornamento il
Nota:
Non verranno più aggiunte ulteriori funzioni ad Adobe Muse, e il supporto verrà sospeso a partire dal giovedì 26 marzo 2020. Per ulteriori informazioni e assistenza, consultate la sezione con le domande frequenti sulla fine del servizio per Adobe Muse.
Funzione migliorata in Adobe Muse CC 2015.1 | Febbraio 2016
Per rendere il design più interessante e coinvolgente, provate ad applicare le transizioni di stato a diversi elementi sulla pagina Web. Potete anche impostare il ritardo, la durata e le opzioni di tempo per ciascuna transizione di stato, per ogni elemento.
Le transizioni di stato supportano anche le modifiche di smusso e bagliore da uno stato all’altro.
Nozioni di base sugli stati diversi degli elementi
Lo stato di un oggetto determina l’aspetto dell’oggetto quando un utente interagisce con esso, ad esempio quando vi passa sopra con il puntatore del mouse o fa clic su di esso. A seguito di un’interazione, un oggetto passa dal suo stato predefinito o Normale a un altro stato. Adobe Muse aggiunge transizioni uniformi per tali interazioni.
In Adobe Muse, potete applicare degli stati a vari tipi di oggetti, compresi testo, contenitori di tutti i tipi di widget, immagini, collegamenti ipertestuali, pulsanti e così via. Agli stati è possibile applicare stili di grafica, di paragrafo, di carattere e altri attributi.
Quali sono gli stati diversi di un oggetto in Adobe Muse?
Adobe Muse offre i seguenti stati e consente di formattare e modificare l’aspetto di un oggetto in base all’interazione da parte dell’utente.
- Normale: lo stato Normale determina l’aspetto predefinito di un oggetto quando viene caricata la pagina Web. Consente di definire come si presenta l’oggetto quando non vi è alcuna interazione da parte dell’utente. Un oggetto passa dallo stato Normale agli altri stati.
- Mouse premuto: lo stato Mouse premuto determina l’aspetto che assume l’oggetto quando l’utente tiene premuto il mouse, prima di rilasciarlo.
- Rollover: consente di modificare l’aspetto di un oggetto quando vi si passa sopra il cursore del mouse. Utilizzando lo stato Rollover è possibile differenziare facilmente gli oggetti interattivi da quelli non interattivi presenti su una pagina Web.
- Attivo: lo stato Attivo determina l’aspetto di un oggetto quando l’utente ha fatto clic su di esso per renderlo attivo. Esempio di oggetti attivi sono un pulsante su cui l’utente ha fatto clic o una voce di menu che ha selezionato.
Quando un oggetto passa allo stato Attivo, significa che è in uso. Gli stati attivi possono essere definiti per tutti i tipi di oggetti, inclusi i collegamenti ipertestuali.
Assegnare gli stati agli oggetti
Per impostazione predefinita, a tutti gli oggetti sono assegnati quattro stati. Tuttavia, è possibile personalizzare i singoli stati separatamente mediante il pannello Stati di Adobe Muse.
Nota:
Quando lavorate con gli stati, è importante tenere traccia delle selezioni utilizzando l’indicatore della selezione. Per impostazione predefinita Adobe Muse consente di modificare lo stato Normale di un oggetto. Pertanto, se state modificando ad esempio lo stato Attivo di un oggetto A, quindi selezionate l’oggetto B e infine selezionate nuovamente l’oggetto A, questo si troverà nello stato Normale. È quindi importante selezionare esplicitamente di volta in volta lo stato che si desidera modificare nel pannello Stati prima di applicare attributi di stile a un oggetto.
Per impostazione predefinita, le modifiche apportate a un oggetto vengono salvate nello stato Normale. Tuttavia, utilizzando il pannello Stati di Muse è possibile passare a uno stato diverso e personalizzarlo modificando l’aspetto dell’oggetto. Potete concentrarvi sul comportamento dell’oggetto per ciascun tipo di interazione modificando separatamente ogni stato.
Per personalizzare o modificare lo stato di un oggetto, effettuate le seguenti operazioni:
- Aprite il pannello Stati facendo clic su Finestra > Stati.
- Selezionate l’oggetto con gli attributi da modificare.
- Selezionate lo Stato che desiderate modificare e continuate a formattare l’oggetto.
- Nel pannello Stati, selezionate Transizione e scegliete l’opzione Dissolvenza. Impostate le opzioni Ritardo, Durata e Velocità per la transizione. Quando selezionate Transizione, l’oggetto passa da uno stato all’altro secondo le impostazioni scelte.
Assegnare stati ai widget e ai contenitori di widget
-
-
Fate clic una volta sul widget per selezionare l’intero menu. Fate clic ancora una volta sul pulsante “food” per selezionare la voce di menu corrispondente. Se per errore fate clic a una terza volta e nell’indicatore della selezione viene visualizzata la dicitura Etichetta, premete Esc per tornare indietro di un livello e ottenere la dicitura Voce di menu.
Poiché nel pannello Opzioni è abilitata l’opzione Modifica insieme, tutte le modifiche apportate all’aspetto di questa voce di menu vengono applicate anche a tutti gli altri pulsanti del widget per menu orizzontale. In questo modo la modifica risulta molto più rapida. A meno che non desideriate applicare una formattazione diversa a ciascun pulsante, tenete attivata l’impostazione predefinita Modifica insieme.
-
Aprite il pannello Stati selezionandone la scheda o scegliendo Finestra > Stati.
Questo pannello consente di modificare il modo in cui si presenta il pulsante a seconda dell’attività del cursore del visitatore. Diversi riquadri grigi definiscono l’aspetto di ogni stato.
Lo stato Normale si riferisce al modo in cui si presenta la voce di menu quando la pagina viene inizialmente caricata e prima che il visitatore porti su essa il cursore del mouse. Se il visitatore passa il cursore su un pulsante, vengono visualizzati gli stili applicati allo stato Al passaggio del mouse. Se il visitatore tiene premuto il pulsante del mouse sul pulsante, vengono visualizzati gli stili applicati allo stato Mouse premuto. E infine, se il visitatore si trova sulla pagina del sito che corrisponde al pulsante del menu (ad esempio, se ha fatto clic sulla voce di menu “about” e sta visualizzando la pagina “about”) il pulsante si presenta con lo stile dello stato Attivo. Quest’ultimo stato è facoltativo, ma può risultare utile in alcuni casi, poiché permette al visitatore di vedere a colpo d’occhio su quale pagina si trova.
-
Nel pannello Stati, fate clic sui singoli stati: Normale, Al passaggio del mouse, Mouse premuto e Attivo. Mentre fate clic su ogni stato nel pannello, il widget per menu sulla pagina si aggiorna e visualizza l’aspetto predefinito dello stato.
-
Fate di nuovo clic sullo stato Normale. Quando è selezionata la voce di menu “Home”, usate il campione del colore di riempimento per scegliere un colore completamente diverso, ad esempio rosso. Poiché è attivata l’opzione Modifica insieme, quando impostate un colore di riempimento diverso viene aggiornato lo stato Normale di tutte le voci di menu.
Se l’opzione Modifica insieme è attivata, quando aggiornate il colore di riempimento per lo stato di un pulsante vengono aggiornati automaticamente anche gli altri pulsanti. -
Selezionate Transizione e quindi Dissolvenza. A secondo delle impostazioni, l’oggetto passa da uno stato all’altro con una dissolvenza.
Quando scegliete l’opzione di transizione da uno stato all’altro, potete impostare le seguenti opzioni:
Ritardo: tempo di ritardo da uno stato all’altro, espresso in secondi.
Durata: durata della transizione.
Velocità: con questa opzione, potete scegliere se la transizione allo stato successivo deve avvenire in modo Lineare o Graduale. Potete anche scegliere Accelerazione, Decelerazione oppure Accelerazione e Decelerazione. La transizione dell’oggetto avviene in modo graduale con accelerazione o decelerazione a seconda delle impostazioni.
-
Scegliete di nuovo File > Anteprima sito nel browser e osservate lo stato Normale personalizzato del pulsante; quando il menu viene inizialmente caricato, tutti i pulsanti eccetto quello che descrive la pagina corrente sono rossi. Quando passate il cursore su ciascun pulsante, viene visualizzato il colore grigio predefinito dello stato Al passaggio del mouse.
-
Per questo esempio, selezionate ciascuno degli stati nel pannello Stati (o dal menu Stati accanto all’indicatore della selezione nel pannello di controllo) e impostate il colore di riempimento su Nessuno (campione colore bianco con barra diagonale rossa). Con questa impostazione lo sfondo dei pulsanti delle voci di menu viene rimosso; i pulsanti del menu diventano quindi trasparenti e lasciano trasparire il design di sfondo.
Al momento, il contenitore esterno del widget per menu orizzontale è trasparente per impostazione predefinita. Tuttavia, se necessario potete utilizzare il selettore Colore riempimento per impostarne il colore di riempimento, come per i contenitori dei pulsante delle voci di menu. Quando dovrete creare un vostro sito, potrete provare a impostare un colore di riempimento per l’intero widget e un colore diverso per i contenitori dei pulsanti. Potete inoltre provare ad aggiungere un’immagine di sfondo per i pulsanti.
Accedi al tuo account