occhio
mosaico_learning_logo
Ecco il modo migliore per realizzare il peggior corso E-learning 1
mosaico_logo_elearning
p11
Ecco il modo migliore per realizzare il peggior corso E-learning 1

Every day, our brains are bombarded by a barrage of notifications and an onslaught of information and new content to explore and learn Yet we're also subjected to a myriad of variables that distract us.

 

Key data on the use of mobile devices, the internet and social media provide some food for thought: having access to such vast amounts of different tools and information can lead to a strong feeling of cognitive disorientation.

 

There’s a reason for all of this.

What we call the attention curve is the short frame of time when our minds are physiologically able to concentrate on a certain topic and so are primed and ready for successful learning.

Attention sky rockets and peaks in about 7 minutes, and then begins to decrease.

 

Various cognitive psychology theories agree on one thing: if the cognitive load (i.e. the amount of information that our memory has to process within a certain period of time) is too high, it may use up the cognitive resources required to learn and become gridlocked.

 

In light of these studies and theories, this easybook provides some tips to help you learn in the best way possible, stress-free and enthusiastically.

 

With this book you’ll learn:
 

•    The inbuilt mechanisms of your brain that influence learning

•    How to manage cognitive load using two key tools: content segmentation and pacing

•    The 7Minutes solution, the cornerstones when it comes to accessible, micro and mobile online training.

CONTATTACI

Come ho decostruito un semplice progetto di visual design per un corso in Rise 360

2019-04-03 09:35

mosaicoelearning

Digital learning, Tutorial, steve Jobs, crisi, storyline, online, microsoft, beta, screenr, corso, stile, trainer, conferenza, corsi elearning, Articulate Replay, archivi, video interattivo, Articulate 360, rise, video 3d, rise 360,

Come ho decostruito un semplice progetto di visual design per un corso in Rise 360

phone-7930461920-.jpg
banner21-1024x230-.png

Qualche giorno fa ho creato alcune immagini per una pagina di menu di un corso sviluppato con Rise 360. Per questo progetto, ho passato un po’ di tempo a giocare con idee di visual design diverse, e oggi le condividerò assieme alle considerazioni e alle motivazioni che hanno portato a determinate modifiche sul mio progetto.


visual-design-elearning-tips-2-.png

 


Visual Design: Il Set-Up

Inizierò affermando che la maggior parte di queste considerazioni sono soggettive, quindi non c'è una cosa giusta o sbagliata.


aspect-ratio-1-.png

Con questo particolare menu, avevo bisogno di un'immagine con proporzioni 10:3. In questo caso, le immagini sono 1280x384. Il l’


aspect ratio calculator

è una buona risorsa se è necessario determinare la proporzione di un video o la risoluzione delle immagini.


La proporzione corta ma ampia crea un vincolo impegnativo su ciò che puoi mostrare. Ed è per questo che ho giocato con idee diverse.


Esempio 1

A causa dei vincoli dimensionali, ho iniziato con il solo testo. Ma inserendo solo il testo, il contenuto sembra vuoto e poco interessante. Visto che queste immagini facevano parte di uno scenario interattivo, volevo aggiungere un po’ più di personalità.


02-.png

Ho aggiunto un personaggio al testo. Questo crea una connessione visuale con lo scenario. Volevo inserire anche degli spazi bianchi, per rendere più semplice all’utente scansionare con gli occhi lo schermo. In linea generale il risultato è gradevole e lo spazio bianco è bello in quanto il corso Rise è responsive per la visualizzazione sui dispositivi mobili.


Esempio 2

Non ero entusiasta del personaggio inserito in una dimensione così ridotta, ma come notato prima, l'altezza dell'immagine creava alcuni vincoli. Così ho giocato con il personaggio facendolo più grande. Questo significa che l’ho posizionato parzialmente fuori dallo schermo.


03-.png

Inoltre, ho pensato che l'immagine più grande sarebbe stata troppo “ingombrante” se fosse rimasta a colori. Quindi mi sono sbarazzato del colore e ho schiarito un po’ l'immagine.


Mi piaceva l'immagine grigia e la sovrapposizione del testo. Ma non era gradevole, specialmente nella visualizzazione da mobile con la parte superiore delle testa tagliata.


Il secondo progetto è OK, ma sembra un po’ squilibrato. Il lato destro del menu ha un testo e un forte elemento visivo con il pulsante. È come aver riempito il lato destro, lasciando il lato sinistro un po’ spoglio e strano.


Esempio 3

Lasciando il personaggio in scala di grigi, ho giocato con le dimensioni per riempire quel lato del menu. Aggiunge un po’ di peso, ma non mi piaceva il modo in cui i volti erano tagliati.


04-.png

Mi piace nella visualizzazione da mobile perché riempie la colonna e l'immagine più chiara con i pulsanti più scuri funziona.


 


Esempio 4

In un , ho condiviso un suggerimento di visual design semplice che chiamo la “tecnica di eco trasparente” (in inglese “the transparent echo technique”). L'idea è di aggiungere la stessa immagine due volte. Uno è disattivato e funge da sfondo e l'altro è un hotspot.


slide9-.png

L'immagine sopra era il mio primo tentativo. Ma il risultato sembrava un po’ pieno e gli occhi erano troppo grandi… ed era anche un po’ inquietante.


05-.png

Così ho sovrapposto un colore scelto in precedente per il pulsante. Ho anche spostato l'immagine e ho usato la sua maglietta e non la faccia. Mi piace la texture che crea l'eco. Puoi vedere parte della maglietta in modo che ci sia un leggero contesto visivo e la texture aggiunge una profondità che mi piace di più di un semplice colore. Inoltre, l'eco non distrae.


Ora ho un visual design che mi piace però sembra stilisticamente troppo pesante. Infatti il mio obiettivo originale era avere uno spazio bianco.


Esempio 5

Per guadagnare spazio bianco ho deciso di inserire la forma a ellisse dei pulsanti. Ciò gli conferisce una certa coesione visiva legando l'intestazione con il pulsante.


Estendendo le teste al di fuori della forma si crea ulteriore spazio bianco. E gli angoli arrotondati con i personaggi che spuntano fuori dalla forma sembrano un po’ più organici e informali, il che si presta bene a un corso con scenario interattivo.


01-.png

Ho anche schiarito i pulsanti in modo che fossero un po’ più sommessi e meno pesanti.


Principi di progettazione visiva

Definire un visual design è una questione soggettiva, ma ho pensato di darti un'idea del mio processo di pensiero mentre creavo la grafica e facevo delle prove. Mentre alcune scelte sono soggettive, ci sono alcuni principi fondamentali da considerare quando si creano le immagini per i propri corsi.


  • Usa lo spazio bianco per dare una pausa agli occhi. Lo spazio bianco aiuta anche a distinguere quali contenuti ci sono sullo schermo e in che modo sono correlati fra di loro.
  • Consistenza visiva tra elementi di design. Mi piace l'immagine finale e di come richiama i pulsanti ellittici. I colori servono anche a legare insieme gli oggetti.
  • Gioca con i colori. Rimuovi i colori dalle immagini per neutralizzarli. Quindi aggiungi alcuni toni di accento o un singolo colore per attirare l'attenzione.

Nel prossimo articolo, mostrerò come ho utilizzato PowerPoint per creare rapidamente tutte queste immagini e apportare modifiche in pochi secondi.


 


Quale disegno ti piace di più? C'è qualcosa che avresti fatto diversamente?


 



Ti è piaciuto l'articolo di Tom?



Allora incontra al Digital Learning Tour!



Tom sarà in Italia per la prima volta dal vivo!

Prenota ora il tuo posto!


Traduzione autorizzata tratta dal post originale di Tom Kuhlmann sul “Rapid E-Learning Blog”.Il post originale è disponibile qui.Ti è piaciuto questo articolo? Segnalalo ai tuoi colleghi!

Articulate

Per acquistare o ricevere informazioni sui prodotti Articulate articulate@mosaicoelearning.it
 

Digital Learning

Per richiedere un preventivo su corsi o servizi corsi@mosaicoelearning.it

Digital Learning

Per richiedere un preventivo su corsi o servizi corsi@mosaicoelearning.it

MOSAICOELEARNING SRL 
VIA DEL MELOGRANO, 77

97100 RAGUSA RG

C.F./P.IVA: 01638210888

09321855211 – 3348437664

DPO

Per qualunque informazione e/o segnalazione riguardante la privacy e la protezione dei dati personali dpo@mosaicoelearning.it
 

Assistenza

Per richiedere assistenza o segnalare malfunzionamenti assistenza@mosaicoelearning.it
 

Assistenza

Per richiedere assistenza o segnalare malfunzionamenti assistenza@mosaicoelearning.it
 

Training

Per ricevere informazioni sulle attività di training in aula o online training@mosaicoelearning.it
 

Training

Per ricevere informazioni sulle attività di training in aula o online training@mosaicoelearning.it
 

risorsa 13

facebook
instagram
twitter
linkedin

www.mosaicoelearning.it @ All Right Reserved 2022 - Sito Realizzato da Flazio Experience

PRIVACY POLICY  |  COOKIE POLICY | MODELLO ESERCIZIO DEI DIRITTI

k2.svg
k1.svg
k4.svg
p2.svg
k5.svg
k3.svg