Creazione del wireframe del modello degli asili

scuoleparrocchialidesio / www

Gruppo Scuole Parocchiali di Desio

https://www.scuoleparrocchialidesio.it

GNU Affero General Public License v3.0

1 stars 0 forks source link

Creazione del wireframe del modello degli asili #8

Closed EnigmaEdivad closed 5 years ago

EnigmaEdivad commented 5 years ago

Intanto che aspettiamo una risposta, che ne pensi? Mobile: https://ibb.co/znHRCXw

olistik commented 5 years ago

@EnigmaEdivad

Predisporrei almeno un'immagine nella sezione "Team" e anzi potremmo proporre l'uso di una sola immagine del team più un testo. Il testo sarebbe comunque dotato di formattazione (grassetto, corsivo, elenchi, etc.) ma senza la possibilità di mettere immagini. In questo modo conteniamo quella sezione. Se gli sta troppo stretta allora significa che quella sezione diventa troppo grande e va estratta in una pagina a parte.
Potrebbe essere utile chiedere un numero di riferimento delle immagini della galleria. Se ci dicono che molto probabilmente saranno più di 4 allora diventa sensato estrarre quella sezione in una pagina indipendente.

Per il resto è ok. 👍

EnigmaEdivad commented 5 years ago

Desktop: https://ibb.co/gDddM2P Mobile: https://ibb.co/bRLRv2p

olistik commented 5 years ago

@EnigmaEdivad

L'unica aggiunta che mi sembra sensata è la duplicazione dei wireframe nella modalità immagine della galleria aperta, sia per mobile che per desktop.

Abbiamo differenti opzioni ma una semplice potrebbe essere:

mobile: sfondo nero con bottone di chiusura in alto a destra e immagine full screen. Eventualmente con frecce semi-trasparenti next/previous.
desktop: overlay con sfondo semi-trasparente e immagine centrata. Frecce next/previous esterne all'immagine.

Per la didascalia vedo due opzioni:

nella parte bassa dell'immagine, in sovrapposizione, area con sfondo nero semi-trasparente
una sezione con sfondo nero opaco sotto l'immagine

EnigmaEdivad commented 5 years ago

Per la didascalia vedo due opzioni:

1. nella parte bassa dell'immagine, in sovrapposizione, area con sfondo nero semi-trasparente

2. una sezione con sfondo nero opaco sotto l'immagine

Cosa intenti? Quando si è già cliccato sull'immagine?

olistik commented 5 years ago

@EnigmaEdivad Esatto.

EnigmaEdivad commented 5 years ago

Così? Mobile https://ibb.co/x88jbKx

olistik commented 5 years ago

@EnigmaEdivad Va benissimo. Avere le frecce esterne e la didascalia esterne all'immagine ci fa perdere una piccola area orizzontale che lato mobile potrebbe avere valore ma la tua proposta sarebbe adeguata anche al caso desktop e l'uniformità di design è un buon compromesso. Consiglio che lo sfondo non sia semi-trasparente, in modo da focalizzare l'attenzione sull'immagine e sulla didascalia e al tempo stesso sull'icona di chiusura, essenziale per tornare al contesto di provenienza.

EnigmaEdivad commented 5 years ago

Quindi rifaccio la stessa cosa ma con sfondo nero?

olistik commented 5 years ago

@EnigmaEdivad Vogliamo mostrare le didascalie delle immagini solo nella visualizzazione dell'immagine, togliendole quindi visualizzazione delle miniature in pagina?

Quindi rifaccio la stessa cosa ma con sfondo nero?

Se ti sta bene l'approccio, l'importante è ricordarsi che quello sfondo grigio usato nel wireframe significa che è opaco. Se il nero aiuta a ricordarlo, allora usa il nero. 🙂

EnigmaEdivad commented 5 years ago

Ok, quindi tolgo le descrizioni nelle miniature e le mostriamo solo quando si clicca sull'immagine.

EnigmaEdivad commented 5 years ago

Desktop https://ibb.co/7ykRvZv Mobile https://ibb.co/7b3gJBp

olistik commented 5 years ago

@EnigmaEdivad LGTM. 👍