Home page - contribuiamo!

Area per le discussioni e gli scambi di idee su argomenti non legati ai giochi e che non trovano posto in altri forum. Attenzione, anche se è un forum abbastanza libero, anche qui vanno osservate le regole generali e le indicazioni dei moderatori!

Moderatori: Cippacometa, pacobillo, Rage, Sephion

Home page - contribuiamo!

Messaggioda tika » 21 gen 2015, 18:50

Apro un nuovo topic perché l'altro si è molto disordinato, a mio parere. Eventualmente se pensate sia il caso cancellate e spostate di là, ma vorrei che qui rimanessero piuttosto interventi organici e costruttivi e non solo: a me non piace, a me piace.

Allora, dato che me l'ero ripromesso, questo pomeriggio mi sono preso finalmente il tempo di cominciare a fare mente locale sulla nuova homepage. In realtà mente locale l'avevo già fatta, ma mi sono preso il tempo per tradurre in realtà quello che avevo in testa.
Come giustamente qualcuno ha detto: non si critica per distruggere, ma per costruire.
Non mi sto a dilungare ancora una volta su quanto apprezzi e rispetti il lavoro di altri. L'ho già scritto tante volte e non è cambiato niente! Il mio intento è cercare di dare una mano e cerco di farlo come penso sia il modo che mi riesce meglio, cioè facendo un discorso ben organizzato e strutturato pur magari a volte severo (anche se non è nel mio intento).

Io penso che la nuova homepage sia densa di potenzialità, ma sono tutt'ora convinto che dal punto di vista grafico molte cose vadano.. sistemate. In realtà più che sistemate vanno ri-organizzate, seguendo però non tanto quella che dovrebbe essere la mia opinione, quanto cercando di rispettare alcune regole che stanno alla base del lavoro di un webdesign.
Attenzione da questo punto di vista: nel attuale mondo che ruota attorno a internet si sono venendo separati i compiti del designer da quelli del webmaster. Il designer lavora unicamente sull'aspetto grafico mentre il webmaster costruisce poi in linguaggio ciò che il designer ha elaborato su un mero programma di grafica (che poi esistano persone che sanno fare l'uno e l'altro lavoro questo non lo si può negare). Questo è dovuto al fatto che ormai il design dei siti web è decisamente una capacità professionale, anche piuttosto complessa. Costruire (intendo progettare, disegnare) un sito che sia piacevole, funzionale, accattivamente e semplice è molto difficile, richiede competenze ed impegno.

Lungi da me volermi atteggiare a designer, non lo sono per niente. Ho cercato di convincere mio fratello a darmi una mano, dato che sta seguendo un master in design per applicazioni (dove però affrontano molti dei concetti base del design di una pagina che sono abbastanza simili a quelli per un normale browser web). Purtroppo nn ha assolutamente il tempo di farlo, quindi ho cercato, per quanto possibile, di raffazzonare qualche idea fondamentale.

Immagine


Partendo dal presupposto che le foto della Gobcon sono in uno spazio temporaneo, secondo me possiamo comunque fare qualche osservazione, che risulterà però ancora più efficace facendo un rapido confronto con qualche sito di riferimento. Ho fatto delle scelte abbastanza casuali prendendo due social network (per forza all'avanguardia dal punto di vista del design, perché vivono di quello), un giornale sportivo (Espn) e un quotidiano di informazione. Mi perdonerete se nn ho scelto siti italiani perché, senza altri termini, in generale non sono famosi per essere all'avanguardia da questo punto di vista.

Ecco le immagini. (ATTENZIONE: il sito su cui ho caricato le immagini me le ha ridimensionate male, per cui l'immagine è sfuocata)

Immagine

Immagine

Immagine

Immagine

Ci sono alcune differenze che saltano all'occhio:
1 - La barra del logo. Il primo elemento fondamentale che appare è la localizzazione della barra del logo. Nel caso di facebook il logo, essendo ormai il brand conosciuto, è direttamente diventato la F. Nel caso di Twitter c'è addirittura solo l'uccellino. Espn ha la sua sigla semplice e NYT chiaramente il suo nome.
E' chiaro che Tana dei Goblin non può fare a meno del suo logo. Il suo brand non è ancora conosciuto, quindi il nome va per esteso. Il logo, ma questo è un parere personale, forse dovrebbe essere un po' "aggiornato", ma nn ci interessa per ora. Quello che importa è che noi dobbiamo tenere il logo e il nome. Ciò non toglie però che rispetto a tutti questi siti noi abbiamo dedicato uno spazio enorme per la barra del logo. Altra scelta differente rispetto a tutti è che abbiamo messo lo spazio dei banner SOPRA la barra del logo. ATTENZIONE: l'occhio ne viene attratto: sono grandi, addirittura con uno spazio in mezzo.
Osserviamo bene: guardate quanto piccole sono e dove si trovanole barre di Facebook e Twitter. Questo minimizzare lo spazio per il logo e barra del logo fa sì che la prima schermata cui il visitatore accede è ben densa di altri contenuti.
Non scordiamoci che la prima schermata (e non tutta la homepage, ma solo quanto si presenta nella prima specifica visualizzazione) è la "copertina" della tana. Deve essere accattivante, chiara, perfetta, studiata nei dettagli.

La mia prima riflessione è dunque quella che sarebbe meglio intanto spostare la barra del logo più in alto, ridurla se possibile di dimensioni e sfruttarne lo spazio vuoto per inserirvi il menù.

1 - Sotto la barra.
Come dicevamo sopra ciò che compare nella prima visuale è fondamentale. Per quanto temporaneo, avere un elemento estraneo come le foto della gobcon in questo posto è sicuramente una scelta sbagliata dal punto di vista del design. Piuttosto posso inserire un articolo che compaia nello slideshow. Ora infatti per esempio qui abbiamo come esempi tre siti molto diversi: Espn fa uso di uno slideshow come la tana. NYtimes si limita ad una foto, mentre facebook e twitter in generale hanno un'impostazione diversa che ci interessa relativamente al momento.
Anche la tana, giustamente, ha scelto lo slideshow, e non mi è sfuggito che si è scelto di dargli una dimensione particolare (schiacciata potremmo dire) affinché rientri nella prima schermata (sempre a patto che non la si sposti come ora, cosa che infatti non ha senso).
La scelta dello slideshow è certamente corretta perché ovviamente è accattivante, moderno, rapido, permette di raccogliere nella prima schermata tutte le ultime news. Vi sono però delle contro-indicazioni.
Lo slideshow è basato quasi sempre sull'utilizzo di immagini. Se non si hanno immagini uno slideshow è quasi inutilizzabile ( http://www.corsia4.eu usa uno slideshow di solo testo proprio per mancanza di immagini, perché non può pagarle e mettere immagini brutte ha poco senso!).
Il problema è però che le immagini devono essere valide e devono essere valide per le dimensioni dello slideshow. In queste settimane secondo me è stato chiaro che questo è un problema. La scelta di un formato anomalo comporta che quasi tutte le normali immagini trovate su internet siano assolutamente inadatte. Ci scontriamo così a volte con immagini sgranate, a volte deformate, a volte semplicemente tagliate.
Tornando alla questione che la prima schermata è la copertina della tana dei goblin, l'impatto di queste immagini, dobbiamo ammetterlo, non è dei più entusiasmanti. E' chiaro che in questo senso si può superare il problema trovando delle immagini adatte. Ma c'è il tempo / le persone per farlo? se sì ben venga il formato anomalo, però dobbiamo farlo, altrimenti penserei a tornare indietro su questa scelta. Avere una bella home rovinata da brutte immagini mi sembra alquanto sciocco.

3 - La composizione degli spazi.
In tutti i quattro siti sopra indicati, (con corsia4 bonus molto più semplice) si può osservare una maniacale organizzazione degli spazi. C'è sempre equilibrio, e l'occhio è aiutato a muoversi nella pagina attraverso semplici espedienti. Dove c'è un peso da una parte devo ribilanciare dall'altra, dove ho un vuoto un altro vuoto. E' quasi una piccola forma d'arte, che deve seguire alcune linee di forza. Twitter tra gli esempi postati è il più simmetrico, Espn per la prima schermata propone uno slideshow che attira l'occhio ribilanciandolo a destra con del testo piuttosto fitto e ordinato con colori semplici per bilanciare la pioggia di colori delle fotografie.
Il NYT è interessante perché forse più simile ancora all'idea della home della tana. L'immagine grande al centro sinistra (che potrebbe essere uno slideshow) è bilanciata dallo spazio per video che sta più in basso sulla destra, in una sorta di gioco in diagonale. Sempre a controbilanciare i colori c'è una scelta per colori tenui e rilassanti. Il gioco è rifinito dalla foto piccola in alto a destra che aiuta l'occhio a non cadere immediatamente nello spazio video ma bilancia e incornicia invece il piccolo spazio per le news in alto a destra. Questo spazio non sarà grande ma è fondamentale, perché l'occhio nostro entra, vede il logo, vede l'immagine, legge il titolo dell'immagine, e poi si sposta su questo spazio a destra leggendone il contenuto. Solo DOPO tutto questo percorro la homepage.

4 - La definizione degli spazi.
In questo nessuno di questi siti si differenzia molto. Se c'è un colore è in genere lasciato allo sfondo, il quale semmai è ribadito con colori molto tenui in alcuni dei campi. Nessuno, se non per lo sfondo, usa sfumature di colore che stancano l'occhio. Al limite per dare l'idea di moderno (come Espn) sfumano solo il punto di contatto, ma sotto il testo il colore è SEMPRE omogeneo e tenue.
Diverso è per Corsia4 che utilizza i colori per farne un elemento compositivo ben definito, ma sempre con grande attenzione al contrasto con i colori del testo, per favorire al massimo la chiarezza e la leggibilità.
Possiamo però osservare in tutti i casi quanto siano definite sempre al meglio le cornici, e come quasi sempre la scelta sia di scrivere sul bianco come sfondo.

5 - Il contenuto.
Anche la forma del contenuto è molto molto semplice. Si prediligono pochissimi colori, testo piuttosto piccolo (il grande è per il web 1.0). Anche questo è importante ed è un elemento che aiuta a dare ordine alla pagina e all'occhio, che sa sempre cosa aspettarsi.
Offline tika
Saggio
Saggio

Avatar utente
 
Collezione: tika
Messaggi: 2119
Iscritto il: 29 agosto 2008
Goblons: 240.00
Località: Trento

Re: Home page - contribuiamo!

Messaggioda tika » 21 gen 2015, 18:55

UNA MIA IDEA DI UN POMERIGGIO!

Link all'immagine a risoluzione reale

Immagine

Una nuova proposta:
Quelli del topic sopra sono, secondo me, alcuni elementi che possono essere messi in luce come "punti deboli" dell'attuale homepage della TdG. Ho quindi cercato, lavorando solo sul design e quindi senza praticamente idea (se non in linea di massima) di cosa comporti dal punto di vista della programmazione, sul riordino della schermata cercando di mantenere laddove sono riuscito se scelte che penso siano di Triade, ma di evolverle per far sì che rispettino per quanto possibile le conclusioni di cui sopra. Ho mantenuto inalterato anche lo spazio per i banner, il quale certamente è un elemento "scomodo" da gestire nella prima schermata, ma questo dipende anche dagli accordi che ci sono tra Tana e i suoi sponsor di cui non so nulla (nn ho idea se ci siano accordi su dimensione/posizione) dei banner.

COSA HO FATTO:
Ho cercato di mantenere la struttura del corpo su tre colonne. Anche se si vede poco nella schermata della home, come potete notare in fondo ho lasciato tre colonne. Ovviamente qui si potrà riempirle come più piace, la struttura della pagina a questo punto diventa piuttosto lineare.
Ho dato allo slideshow una misura più standard, così che sia più facile utilizzarlo con immagini che lo valorizzino.
Ho cercato di dare un po' di movimento alla pagina creando piccole rientranze (notate che le caselle a destra e a sinistra non sono sempre perfettamente allineate), ma cercando di mantenere anche un certo equilibrio strutturale. Per fare questo mi sono basato più sull'istinto che su una reale conoscenza teorica dell'argomento (che come già dicevo sopra, non ho). Mi sembra che però la cosa funzioni.
Ho pensato che la home è un bel posto dove valorizzare i grandissimi contributi di Eldaran a cui ovviamente risale l'origine dei bellissimi avatar. Per ora ho utilizzato quelli già creati da lui, giusto per fare un esempio, poi sarebbe da chiedergli se è disposto a creare qualcosa ad hoc. Già così, praticamente a caso, l'effetto però mi sembra decisamente notevole nel puntualizzare il nostro spirito goblin e nel rendere la pagina al tempo stesso più moderna ed elegante.
Ho inserito uno spazio apposito per le istagoblin, in modo tale che non sia più necessario spostare niente per inserirle nella homepage.
Credo di aver mantenuto lo stile e i colori che hanno ispirato triade.

Cosa mi piace meno?
L'insieme mi sembra ancora un pochino pesante. E' già più aereoso dell'attuale sito, ma nn lo so... mi da la sensazione ancora di essere eccessivamente carico.


Bene ora linciatemi pure!!!

PS: ovviamente dato che sono un pirla, mi sono accorto solo quando avevo già finito che in realtà nn si visualizza tutto nel browser. Cmq in linea di massima si può giocare sulle dimensioni dei singoli campi per far sì che la visualizzazione sia il più ottimale possibile, quindi il concetto non cambia!
Offline tika
Saggio
Saggio

Avatar utente
 
Collezione: tika
Messaggi: 2119
Iscritto il: 29 agosto 2008
Goblons: 240.00
Località: Trento

Re: Home page - contribuiamo!

Messaggioda Triade » 15 apr 2015, 15:38

Questa mi era sfuggita. chiedo venia. Interessantissimo.
Immagine
Offline Triade
Goblin Judoka
Goblin Judoka

Avatar utente
TdG Administrator
TdG Programmer
TdG Moderator
TdG Organization Plus
TdG Admin Staff
 
Collezione: Triade
Messaggi: 3728
Iscritto il: 12 settembre 2003
Goblons: 499,267,997.00
Località: Internet
Utente Bgg: Triade73
Board Game Arena: Triade73
Yucata: Triade
Facebook: david.rossi.733
Twitter: triade73
Agricola fan Android Netrunner Fan Puerto Rico Fan Recensioni Minute  Fan Sgananzium Fan Tocca a te fan 10 anni con i Goblins
Sono stato alla Gobcon 2015 Sei nella chat dei Goblins Sono un Goblin Ho partecipato alla Play di Modena Cthulhu Wars Fan Star Wars: X-Wing Fan The Castles of Burgundy Fan
Formula D Fan Caylus Fan Call of Cthulhu LCG Fan Magic the gathering fan Io gioco col nero Mi piace il judo Gdt Live Fan
Sono un Sava follower Triade, il verde e' troppo verde... Amo la Nutella!!!! Queen fan Stephen King fan Pizza fan Ho sostenuto la tana alla Play 2016
Jones 'Incazzoso' Fan! Ashes Rise of the Phoenixborn Fan Boba fan

Re: Home page - contribuiamo!

Messaggioda notfound » 15 apr 2015, 16:18

...abbandonerei il verde, stacchiamoci da quest'idea per favore! Va bene un richiamo, un accenno ai Goblin ma che non sia predominante, è pesante e costringe a dirigere la scelta dei colori su toni chiaro/scuri e fortemente contrastanti tra di loro, soprattutto a scapito del testo che è un'altra nota dolonte, individuare un font leggibile che si stende su un bello sfondo chiaro atto alla lettura sarebbe cosa buona e giusta... una funzionalità che manca poi è la versione stampabile, per risparmiare inchiostro se si vuole stampare la pagina o anche solo per leggere a video un articolo scevro di grafica.

resto dell'idea che ci vuole un template di stampo editoriale che dia spazio agli articoli, news e altro quindi che abbia una struttura tipo rivista online, se diamo un'occhiata ai numerosi siti per template dedicati per esempio a joomla, ne troviamo a bizzeffe tipo questi segnalati di seguito, ma le fonti d'ispirazione possono essere tante altre:

http://www.templatemonster.com/it/demo/52025.html

http://www.templatemonster.com/it/demo/48966.html

oppure questi

https://www.joomla-monster.com/all-templates/16-news

p.s. oggi più che mai, il web designer deve essere formato anche sui linguaggi di programmazione, soprattutto se produce layout per CMS Open Source, perchè non può progettare la grafica a caso se non conosce il framework dell'applicazione...
Ultima modifica di notfound il 15 apr 2015, 19:21, modificato 1 volta in totale.

Immagine

Offline notfound
Grande Saggio
Grande Saggio

Avatar utente
 
Collezione: notfound
Messaggi: 2862
Iscritto il: 02 gennaio 2011
Goblons: 60.00
Località: Napoli
Utente Bgg: NotFound

Re: Home page - contribuiamo!

Messaggioda MichyLo » 15 apr 2015, 18:24

Credo che questo topic sia sfuggito a molti (me compresa) ma faccio i complimenti a tika per la propositività :grin: .
Trovo che la tua immagine sia molto gradevole, lo sfondo verde tenue che vira al bianco gradevole e i riquadri non mi sembra diano il problema dei toni menzionato nel post sopra da notfound.
Tutto da discutere con chi di dovere ma è un bel punto di partenza! :approva:
Immagine
Offline MichyLo
Grande Saggio
Grande Saggio

Avatar utente
TdG Moderator
 
Collezione: MichyLo
Messaggi: 3161
Iscritto il: 24 aprile 2013
Goblons: 6,299,090.00
Località: Bricherasio(TO)
Ho partecipato alla Play di Modena Sono stato alla Gobcon 2016 Ho parteciapto al torneo di Clash Royale Vincitore del torneo Clash Royale

Re: Home page - contribuiamo!

Messaggioda notfound » 15 apr 2015, 19:18

una precisazione: la mia considerazione sull'uso del colore verde era rivolta all'attuale sito web e non alla proposta di Tika, in genarale è un colore che appesantisce e non è facile abbinare con le altre cromie, ed anche nello sfondo sfumato usato nell'esempio da Tika risulta essere "spento", se dobbiamo dare una bella " lavata di faccia " al portale personalmente lo userei con parsimonia predilegendo colori chiari e tenui da contrastare con altri elementi (chessò un segno grafico ricorrente che evidenzia un box riservato al testo) caratterizzati da colori brillanti, in modo da rendere attraente l'home page e evitando di far deprimere il visitatore.

Immagine

Offline notfound
Grande Saggio
Grande Saggio

Avatar utente
 
Collezione: notfound
Messaggi: 2862
Iscritto il: 02 gennaio 2011
Goblons: 60.00
Località: Napoli
Utente Bgg: NotFound

Re: Home page - contribuiamo!

Messaggioda blackholexan » 16 apr 2015, 15:23

Bei suggerimenti Tika, complimenti :approva:

Vediamo se ne scaturiscono di buone anche da altri utenti (spremo le meningi un po anche io...)
Offline blackholexan
Grande Saggio
Grande Saggio

Avatar utente
 
Collezione: blackholexan
Messaggi: 2832
Iscritto il: 04 marzo 2010
Goblons: 100.00
Località: Bari
Utente Bgg: blackholexan
Twitter: Mischievious D
Sei iscritto da 5 anni. Sei nella chat dei Goblins Ho partecipato alla Play di Modena

Re: Home page - contribuiamo!

Messaggioda Sephion » 20 apr 2015, 10:08

Ottimo lavoro Tika.
Per dare al topic la visibilità che merita l'ho trasformato in un annuncio.

Ricordo a tutti che anche se il topic è in Sproloqui in realtà è di grande importanza per la Tana in questo momento, perciò evitiamo post tipo "ma che bella pagina che hai fatto" oppure "ehi ma di chi è quell'avatar?" ecc. ecc.

Considerate questo topic come un vero annuncio e raccogliamo pensieri e idee come quelli che sono stati espressi adesso.

Commenti e feedback vanno benissimo purché motivati!

Mia opinione: Mi piace la proposta di modifica di home page, utilizzando una struttura a tre colonne il sito risulta molto più fruibile e leggibile.
Per la questione dei colori, come verrebbe il sito eliminando lo sfondo verde dai post introducendo però una cornice di colore verde? magari utilizzando diverse sfumature di verde, o cambiando il colore della cornice in base al contenuto ( es. interventi di moderazione=cornice rossa).
Questo non so se però è fattibile, è un'idea data senza avere esperienza in campo informatico.
I know I was born and I know that I'll die, but in between is mine.

Aiutaci a creare il gioco della Tana dei Goblin!
la-tana-dei-goblin-gdt-bozze-dei-disegni-t87061-90.html

Qual'è il tuo gioco preferito? Votalo nella classifica non-ufficiale!
la-classifica-gdt-non-ufficiale-dei-goblins-t87953.html

Immagine
Offline Sephion
Saggio
Saggio

Avatar utente
Tdg Supporter
TdG Moderator
TdG Organization
 
Collezione: Sephion
Messaggi: 2223
Iscritto il: 27 novembre 2011
Goblons: 20.00
Località: Fiumicello (UD)
Sei iscritto da 5 anni. Ho partecipato alla Play di Modena Berserk fan Birra fan Playstation fan Cloud Strife fan


Torna a Sproloqui e chicche varie

Chi c’è in linea

Visitano il forum: Nessuno e 0 ospiti