Utilizzo un’istanza Discourse per la gestione dei progetti dei clienti da tempo e ho deciso di arricchirla con contenuti più pubblici, condividere case study e risorse. È ancora un lavoro in corso (stilizzata solo per desktop, la maggior parte degli argomenti ha contenuti minimi) ma sento di averla guardata troppo a lungo per poter ancora esprimere giudizi validi.
Sarebbe fantastico ricevere qualche feedback:
in generale: È intuitivo? Ha senso quello che condivido? Pensate che dovrei condividere qualcos’altro o impostare evidenziazioni diverse?
modifica: ho riscritto questo componente per risolvere i problemi menzionati sul lato tecnico: Un componente di layout centrale che utilizzo è un flusso modificato di sidebar/header. L’obiettivo è mostrare una sola barra di navigazione principale alla volta, o l’header o la sidebar. Il componente base si trova su Manuel Kostka / Discourse / Helpers / Sidebar Flow · GitLab e ho adottato due approcci per costruire il flusso:
ridefinire l’header sopra la sidebar come trasparente e assegnare una griglia per allineare l’interruttore della sidebar e il logo con la larghezza della sidebar
utilizzare un trucco stilistico per estendere lo sfondo della sidebar (dichiarare un drop-shadow per l’intera pagina e poi limitarlo con un clip-path)
Ho scelto questo approccio perché finora ho ottenuto l’animazione più gradevole mantenendo le animazioni di scorrimento predefinite. Quindi è solo la sidebar che scorre, il suo sfondo si estende a sinistra e verso l’header, e l’header trasparente si sovrappone ad essa.
Gli svantaggi che vedo sono che ridefinire l’header come griglia non si integra bene con altri componenti che vengono renderizzati nell’header. E non ho ancora trovato un modo per far funzionare il trucco del clip-path su Safari. Quindi sarei curioso di sapere se alcuni dei maghi del CSS qui hanno idee migliori!
Forse rinominarlo “login cliente”? E prenderei anche in considerazione di spostarlo nell’header. Attualmente si trova nello spazio più prominente del tuo sito, quasi come la CTA principale.
Aprire il menu fa saltare l’intera pagina, rimuovendo i primi due elementi. Questo sembra un po’ poco intuitivo?
Aprire il menu su “about” e “topics” in realtà rimuove tutto il contenuto:
Avevo anche questa aspettativa, anche se aveva senso che fosse per l’accesso del cliente non appena ci ho cliccato.
Anche gli altri feedback di Bas sono pertinenti, ma in generale mi piace questo layout e potrei immaginare che particolari gruppi di utenti e casi d’uso lo troverebbero molto accogliente.
Sì, è effettivamente la CTA principale poiché la piattaforma era interamente dedicata all’accesso dei clienti per la gestione dei progetti. Potrei dover ripensare l’idea di aggiungervi una vetrina pubblica. O almeno come organizzare i due aspetti.
È intesa solo per includere i progetti che ho implementato. Immagino che sarebbe chiaro se li collegassi a un argomento di studio di caso per ciascuno.
Entrambi sono dovuti all’hack CSS con clip-path che ho menzionato e che finora non funziona su Safari.
Nel complesso, è probabilmente ancora troppo sperimentale per essere utilizzato. Forse dovrei provare a lavorare sul flusso della barra laterale in un tema dedicato prima. Questa è la principale sfida di implementazione che voglio risolvere qui, dopotutto: costruire un layout a schermo intero che non incolli la barra laterale al bordo sinistro della finestra, ma che abbia un flusso più fluido.
