Discussioni categoria:Icone di servizio

Vai alla navigazione Vai alla ricerca
Segui tutte le discussioni nella Bettola, il ritrovo dei nonciclopediani! (come si discute · chat)

Nuovo stile uniforme per le icone decorative di pagine e template

La grafica del sito è abbastanza vecchia, spesso poco curata e poco simile a quella di Wikipedia. Quindi ho lanciato l'idea di decidere un nuovo stile per rinnovare e uniformare pagine e template.
Qui si parla nello specifico di icone decorative, quelle che di solito compaiono sui template ma anche in certe pagine di sistema. La proposta parte qui sul vecchio forum: http://nonciclopedia.altervista.org/phpBB3/viewtopic.php?f=3&t=8029&start=925#p776761
Questo ha dato inizio a un sondaggio, che parte qui: http://nonciclopedia.altervista.org/phpBB3/viewtopic.php?f=3&t=8029&start=950#p777179
I primi esperimenti sono le icone per la Latrina, che trovate nella pagina Categoria:Immagini icone Latrina. Si può notare come degli oggetti (o delle facce di cazzo) reali siano stati resi fumettosi e sgargianti allo stesso tempo con accorgimenti tipo ridurre il dettaglio, rafforzare i colori e disegnare un bordino nero, con una leggera ombra per staccarli dallo sfondo.
Dopo settimane di tentativi infruttuosi, credo di aver raggiunto dei buoni risultati, magari migliorabili ma direi che già così a me andrebbero bene. Quando tornate dal mare date il vostro parere, perché è proprio ascoltando i pareri da voi espressi che sono giusto a questo risultato.
Se vanno bene ne farò molte altre, ma per sicurezza per ora non ne faccio più.-- WEDHRO B A 🗿? 13:44, 18 lug 2016

Questo stile a me piace, infatti ne ho usato uno simile negli ultimi template che ho modificato, proprio perché mi aspettavo che alla fine sarebbe stato usato qualcosa di simile per il resto del sito. È quello più facile da applicare, perché si parte da immagini già esistenti sulle quali si devono eseguire operazioni abbastanza facili e alla portata dei meno grafici.--Treffoconfessa - CCSC 15:57, 18 lug 2016

ei k si scrive qua sembra 1 paggina ma si skive diverso ciao--Utente:Pipìpupù/firma 16:04, 18 lug 2016

È un forum di prova, ci stiamo ancora lavorando, ma per favore scrivi in Italiano.

« Questo stile a me piace, infatti ne ho usato uno simile negli ultimi template che ho modificato, proprio perché mi aspettavo che alla fine sarebbe stato usato qualcosa di simile per il resto del sito. È quello più facile da applicare, perché si parte da immagini già esistenti sulle quali si devono eseguire operazioni abbastanza facili e alla portata dei meno grafici. »
(Treffo)

Occhio però perché per fare quelli ho usato un metodo standard affinché fossero uniformi, se viene accettata l'idea dovrò rifare anche i tuoi per adeguarli (dubito tu abbia usato lo stesso metodo), quindi fossi in te aspetterei un po'. Se ti servono icone nuove te le faccio io, o al limite ti dò un tutorial per GIMP. -- WEDHRO B A 🗿? 16:13, 18 lug 2016

Il tutorial.--Treffoconfessa - CCSC 20:58, 19 lug 2016

Ovviamente si parte da una foto con un soggetto adatto. Una volta completato il ritaglio (con bordi non troppo "morbidi", bisogna evitare bordi sfumati) e i ritocchi:

  • ritaglia l'immagine in modo che tocchi i bordi della superficie
  • scala a 230 px
  • porta la superficie a 250x250 px, centrando l'immagine
  • muovi verso l'alto il livello ma non fargli toccare il bordo

Cartonizzazione

  • copia il visibile
  • incolla come nuovo livello
  • regola i Livelli e la Saturazione fino ad ottenere un disegno ben staccato, luminoso e a tinte cariche. Io in genere sposto la gamma leggermente in alto e il punto bianco in basso, poi se serve aumento un po' la saturazione.
  • duplica il livello e disattiva quello originale
  • sfumatura gaussiana selettiva finché non si riconoscono solo le forme principali e non i dettagli minuti. Qui non c'è una regola universale, ma in genere si ottengono buoni risultati portando il delta a metà barra e lasciando il raggio di sfocatura com'è.
  • se ci sono aree in cui il dettaglio è importante (scritte, capelli ecc.), sfuma solo sul resto dell'immagine. Puoi fare una selezione oppure duplichi il livello prima di sfumare e poi ne cancelli le parti da non sfumare, così si vedono quelle sotto.

Per il bordo

  • seleziona alpha e ingrandisci la selezione di 1px
  • apri nuovo livello
  • riempilo di nero
  • duplica questo livello e sposta in basso l'originale
  • seleziona alpha dal livello nero in cima e riduci di 1px
  • cancella e deseleziona
  • sfumatura gaussiana a 3px
  • imposta il livello come Luce Dura
  • questo crea le linee esterne - aggiungi le linee principali interne a mano con pennello nero a durezza 050 e dimensione 3px, attivando lo Smooth Stroke (non so come l'hanno tradotto in Italiano) con qualità 100 e peso 400; questo serve ad ottenere linee sufficientemente naturali, ma ci vuole comunque mano

Per l'ombra

  • duplica il livello nero che era rimasto in basso
  • sfumatura gaussiana di 10px
  • muovi il livello di 10px verso il basso
  • riduci opacità al 35%

Fatto. Mai detto che fosse semplice, eh.-- WEDHRO B A 🗿? 21:29, 19 lug 2016

Come è stato scelto lo stile per queste icone

Tempo fa lanciai un sondaggio a scelta multipla sul vecchio forum per decidere uno stile uniforme da usare per tutte le icone di sistema (invece che farle a muzzo come negli ultimi 11 anni). La scelta era fra:

  1. Icone piatte stile Twitter. Facile da fare ma scialbo.
  2. Generico stile "glossy" alla Windows XP, come quelle usate su Wikipedia. Difficile da fare.
  3. Papocchi ovunque e stile fumettoso, come adesso. Difficile da fare.
  4. Foto ritagliate invece che disegni, come nell'esempio delle mie icone per l'Horroscopo. Molto facile da fare ma un po' strano su sfondi puliti.

I votanti potevano mettere le opzioni in ordine di preferenza, con punteggi proporzionati alla posizione. Per semplicità, riporto le scelte indicando solo il numero e mettendo per prima la preferita e via via le altre.

Risultato, come punteggio totale e fra parentesi il numero di utenti che hanno messo l'opzione al primo posto:

  • 35) Icone fumettose papocchiate come le attuali. (4)
  • 31) Foto scontornate "fluttuanti". (3)
  • 28) Icone piatte stile Twitter. (4)
  • 26) Icone glossy stile Wikipedia ovvero Windows XP (1).

I risultati non puntano nettamente in una direzione precisa indicando solo una vaga preferenza per l'effetto fumettoso ma anche per le foto scontornate, non esagerando con gli effetti troppo piatti e soprattutto evitando come la peste l'effetto glossy. Punto quindi su uno stile che cerca di mettere insieme queste indicazioni, in pratica scontornando foto e poi bordandole e accentuarne il colore per renderle più fumettose, e ridurne il dettaglio e le sfumature per renderle più piatte.-- WEDHRO B A 🗿? 11:15, mag 4, 2017 (CEST)