[TUTORIAL] Creare un Baloon dei Commenti
-
- Utente avanzato
- Messaggi:30
- Iscritto il:sab 19 feb 2011, 20:48
CREARE UN BALOON DEI COMMENTI
ANTEPRIMA:
Salve, oggi ho intenzione di spiegare come creare un baloon che spesso vediamo nei siti web / blog per indicare il numero dei commenti.
PREMESSA
Bene come prima cosa apriamo The Gimp, impostiamo una qualsiasi grandezza e, se volete piazzarlo in un sito, inserite uno sfondo trasparente altrimenti utilizzate uno sfondo bianco.
Ricordatevi di non seguire alla lettera questo tutorial, come dico semrpe: "Meglio essere il più creativo possibile". Quindi, sbizzarritevi con i colori, con le forme e con le opacità! Io darò semplicemente delle linee guida.
PRIMO PASSAGGIO - La selezione:
Creiamo 5 livelli per velocizzarci il lavoro. Il primo (che dovete selezionare) lo chiamiamo "ESTERNO".
Ora, prendiamo lo strumento "SELEZIONE RETTANGOLARE" e, con gli SPIGOLI ARROTONDATI a 33,5, creiamo una selezione.
SECONDO PASSAGGIO - I colori esterni:
Utilizziamo un gradiente per colorare l'esterno del baloon. Io ho scelto:
Scuro :- 5d55a6
Chiaro:- 00b4ff
Il primo è quasi un viola, il secondo è un azzurro. Come ho detto prima, cercate di usare colori di ogni tipo rispettando però la tonalità: prima scuro e poi chiaro. Sempre con la selezione attiva, usiamo lo strumento sfumatura (o gradiente... comunque per chi avesse altri nomi, utilizzare la shortcut L). Tenendo premuto CTRL, tiriamo una riga dall' alto verso la base che passa per il punto più alto della selezione fino alla parte più bassa. Ora dovreste avere una situazione simile:
TERZO PASSAGGIO - Colorare la parte interna:
Tenendo sempre la selezione precedente (chi l'avesse già tolta, vada sul livello, ci clicchi sopra con il tasto destro e prema "Alpha a selezione"), andiamo su: SELEZIONA - RIDUCI e riduciamo di 8. Clicchiamo, poi, sul nuovo livello che chiameremo "INTERNO" e con i colori di prima piu lo strumento gradiente, andiamo a rifare lo stesso passaggio di prima ma al contrario, ovvero dal basso verso l'alto.
Ora dovreste avere questa situazione:
QUARTO PASSAGGIO - Il riflesso sul baloon:
Clicchiamo su un nuovo livello (superiore al baloon interno) e chiamiamolo "Riflesso". Con la selezione precedente attiva, andiamo a prendere lo strumento selezione CIRCOLARE e premendo MAIUSC+CTRL (oppure cliccare dove c'è scritto Modalità - Interseca con la selezione corrente) andaiamo a selezionare la parte più in alto del baloon. ES:
Ora, prendiamo il colore bianco, lo strumento gradiente e, nel suo menu (menu gradienti), andiamo a selezionare il gradiene: da pp a Trasparente. L'immagine è questa:
Ora settiamo l'opacità DEL LIVELLO tra 33 e 40. Dovreste avere una cosa simile:
QUINTO PASSAGGIO - La parte più difficile, il triangolo:
Adesso inizia la parte più difficile. Difficile perchè è possibile sbagliare, farlo storto o tagliuzzato. Ma questo non è un problema, basta stare attenti. Torniamo al livello "Esterno" e nella parte in basso a destra (o in basso a sinistra, come volete voi) facciamo il triangolino per dargli il vero aspetto del fumetto. Per farlo utilizziamo la SELEZIONE A MANO LIBERA. Diamo 4 click: il primo nella parte poco fuori il baloon, poi ne diamo un altro verso il basso, il secondo in linea con il primo ma verso destra e infine li ricolleghiamo; naturalmente potete entrare dentro la parte esterna del fumetto, l'importante è non invaderla troppo. Infine la coloriamo del colore più chiaro che abbiamo messo, in questo caso: 00b4ff.
ES:
SESTO PASSAGGIO - La calma dopo la tempesta, il contorno:
Prendiamo un nuovo livello, spostiamolo sopra il livello "Esterno" (che dovrebbe avere l'aggiunta del triangolo) e chiamiamolo "Contorno". Click sul tasto destro del mouse sul livello "Esterno" e premete su "Alpha a Selezione". Ora vi dovrebbe selezionare il contorno del baloon; andate su: SELEZIONA - BORDO, su "SELEZIONE BORDO DI" mettete 1 e spuntate la casellina "Margini sfumati". Ok, con il colore nero ad un opacità del 20% - 30% andate a colorare dentro il bordo. Ricordatevi che per colorarlo lo dovete fare nel livello "Contorno". Adesso seguite questi passaggi: SELEZIONA - ALLARGA - 5px. FILTRI - SFOCATURE - GAUSSIANA - 5,00px e 5,00px.
Il problema è che abbiamo anche la sfocatura fuori dal baloon. Niente paura, cliccate sul livello "Esterno" e rifate un alpha a selezione. Ora tornate sul livello "Contorno" e fate SELEZIONA - INVERTI e premete CANC. Il gioco dovrebbe essere fatto.
Risultato:
SETTIMO PASSAGGIO - La fine, l'ombra:
Siamo arrivati alla fine. Nell'ultimo livello (che chiameremo Ombra) rimasto prendiamo la SELEZIONE CIRCOLARE e facciamo una piccola e ristretta selezione, spuntando la casellina "margini sfumati" al 10% . Coloriamo con un nero con l'opacità al 20%.
RISULTATO FINALE:
Il numero l'ho inserito io. Grazie a tutti per la visione, se avete qualche problema scrivete pure. Chi vuole inviarmi il proprio lavoro può farlo spedendomi un pm con l'immagine in allegato, oppure può postarlo direttamente qui.
___________________________________________________________________________________________
Gudia creata interamente da Groove's Man. Vietata la copia parziale o totale della guida senza l'autorizzazione dell'autore.
ANTEPRIMA:
Salve, oggi ho intenzione di spiegare come creare un baloon che spesso vediamo nei siti web / blog per indicare il numero dei commenti.
PREMESSA
Bene come prima cosa apriamo The Gimp, impostiamo una qualsiasi grandezza e, se volete piazzarlo in un sito, inserite uno sfondo trasparente altrimenti utilizzate uno sfondo bianco.
Ricordatevi di non seguire alla lettera questo tutorial, come dico semrpe: "Meglio essere il più creativo possibile". Quindi, sbizzarritevi con i colori, con le forme e con le opacità! Io darò semplicemente delle linee guida.
PRIMO PASSAGGIO - La selezione:
Creiamo 5 livelli per velocizzarci il lavoro. Il primo (che dovete selezionare) lo chiamiamo "ESTERNO".
Ora, prendiamo lo strumento "SELEZIONE RETTANGOLARE" e, con gli SPIGOLI ARROTONDATI a 33,5, creiamo una selezione.
SECONDO PASSAGGIO - I colori esterni:
Utilizziamo un gradiente per colorare l'esterno del baloon. Io ho scelto:
Scuro :- 5d55a6
Chiaro:- 00b4ff
Il primo è quasi un viola, il secondo è un azzurro. Come ho detto prima, cercate di usare colori di ogni tipo rispettando però la tonalità: prima scuro e poi chiaro. Sempre con la selezione attiva, usiamo lo strumento sfumatura (o gradiente... comunque per chi avesse altri nomi, utilizzare la shortcut L). Tenendo premuto CTRL, tiriamo una riga dall' alto verso la base che passa per il punto più alto della selezione fino alla parte più bassa. Ora dovreste avere una situazione simile:
TERZO PASSAGGIO - Colorare la parte interna:
Tenendo sempre la selezione precedente (chi l'avesse già tolta, vada sul livello, ci clicchi sopra con il tasto destro e prema "Alpha a selezione"), andiamo su: SELEZIONA - RIDUCI e riduciamo di 8. Clicchiamo, poi, sul nuovo livello che chiameremo "INTERNO" e con i colori di prima piu lo strumento gradiente, andiamo a rifare lo stesso passaggio di prima ma al contrario, ovvero dal basso verso l'alto.
Ora dovreste avere questa situazione:
QUARTO PASSAGGIO - Il riflesso sul baloon:
Clicchiamo su un nuovo livello (superiore al baloon interno) e chiamiamolo "Riflesso". Con la selezione precedente attiva, andiamo a prendere lo strumento selezione CIRCOLARE e premendo MAIUSC+CTRL (oppure cliccare dove c'è scritto Modalità - Interseca con la selezione corrente) andaiamo a selezionare la parte più in alto del baloon. ES:
Ora, prendiamo il colore bianco, lo strumento gradiente e, nel suo menu (menu gradienti), andiamo a selezionare il gradiene: da pp a Trasparente. L'immagine è questa:
Ora settiamo l'opacità DEL LIVELLO tra 33 e 40. Dovreste avere una cosa simile:
QUINTO PASSAGGIO - La parte più difficile, il triangolo:
Adesso inizia la parte più difficile. Difficile perchè è possibile sbagliare, farlo storto o tagliuzzato. Ma questo non è un problema, basta stare attenti. Torniamo al livello "Esterno" e nella parte in basso a destra (o in basso a sinistra, come volete voi) facciamo il triangolino per dargli il vero aspetto del fumetto. Per farlo utilizziamo la SELEZIONE A MANO LIBERA. Diamo 4 click: il primo nella parte poco fuori il baloon, poi ne diamo un altro verso il basso, il secondo in linea con il primo ma verso destra e infine li ricolleghiamo; naturalmente potete entrare dentro la parte esterna del fumetto, l'importante è non invaderla troppo. Infine la coloriamo del colore più chiaro che abbiamo messo, in questo caso: 00b4ff.
ES:
SESTO PASSAGGIO - La calma dopo la tempesta, il contorno:
Prendiamo un nuovo livello, spostiamolo sopra il livello "Esterno" (che dovrebbe avere l'aggiunta del triangolo) e chiamiamolo "Contorno". Click sul tasto destro del mouse sul livello "Esterno" e premete su "Alpha a Selezione". Ora vi dovrebbe selezionare il contorno del baloon; andate su: SELEZIONA - BORDO, su "SELEZIONE BORDO DI" mettete 1 e spuntate la casellina "Margini sfumati". Ok, con il colore nero ad un opacità del 20% - 30% andate a colorare dentro il bordo. Ricordatevi che per colorarlo lo dovete fare nel livello "Contorno". Adesso seguite questi passaggi: SELEZIONA - ALLARGA - 5px. FILTRI - SFOCATURE - GAUSSIANA - 5,00px e 5,00px.
Il problema è che abbiamo anche la sfocatura fuori dal baloon. Niente paura, cliccate sul livello "Esterno" e rifate un alpha a selezione. Ora tornate sul livello "Contorno" e fate SELEZIONA - INVERTI e premete CANC. Il gioco dovrebbe essere fatto.
Risultato:
SETTIMO PASSAGGIO - La fine, l'ombra:
Siamo arrivati alla fine. Nell'ultimo livello (che chiameremo Ombra) rimasto prendiamo la SELEZIONE CIRCOLARE e facciamo una piccola e ristretta selezione, spuntando la casellina "margini sfumati" al 10% . Coloriamo con un nero con l'opacità al 20%.
RISULTATO FINALE:
Il numero l'ho inserito io. Grazie a tutti per la visione, se avete qualche problema scrivete pure. Chi vuole inviarmi il proprio lavoro può farlo spedendomi un pm con l'immagine in allegato, oppure può postarlo direttamente qui.
___________________________________________________________________________________________
Gudia creata interamente da Groove's Man. Vietata la copia parziale o totale della guida senza l'autorizzazione dell'autore.
Ultima modifica di Groove's Man il lun 12 set 2011, 13:48, modificato 1 volta in totale.
Re: [TUTORIAL] Creare un Baloon dei Commenti
Uso gimp per il fotoritcco, resto sempre affascinato da chi riesce a creare "clip art" in cui io sono assolutamente impedito. Niente da fare... open, gratis ed un gran del software!
Complimenti per la guida, mi tornerà comoda per fare qualche bottone del sito.
Complimenti per la guida, mi tornerà comoda per fare qualche bottone del sito.
L'esperienza e' il tipo di insegnante piu' difficile. Prima ti fa l'esame, e poi ti spiega la lezione.
https://www.mora-foto.it - Tutorial Gimp e Fotografia
https://www.ciaocortina.com- Tutto su Cortina d'Ampezzo
https://www.mora-foto.it - Tutorial Gimp e Fotografia
https://www.ciaocortina.com- Tutto su Cortina d'Ampezzo
-
- Utente avanzato
- Messaggi:30
- Iscritto il:sab 19 feb 2011, 20:48
Re: [TUTORIAL] Creare un Baloon dei Commenti
Beh, che dire, grazie mille ^^. Anchio ho sempre usato gimp per fotoritocchi, compositing, ma poi mi sono dato all'ippica (ovvero ai button-icone) quando ho dovuto fare il mio sito. Da allora ho sempre approfondito le mie conoscenze fino ad arrivare ad un buon punto.
Re: [TUTORIAL] Creare un Baloon dei Commenti
Perché le righe sono tagliate a metà e intervallate da spazi bianchi? Così diventa un incubo leggere...Groove's Man ha scritto: Salve, oggi ho intenzione di spiegare come creare un baloon che spesso
vediamo nei siti web / blog per indicare il numero dei commenti.
-
- Utente avanzato
- Messaggi:30
- Iscritto il:sab 19 feb 2011, 20:48
Re: [TUTORIAL] Creare un Baloon dei Commenti
Chiedo scusa, ma avendo scritto tutto la guida su un file .txt (per salvare in caso mi potesse servire in futuro) quella schifezza di editori mi ha gestito lui le righe buttandole a capo quando voleva. In caso ci fossero dubbi posso mostrare il file e le immagine relative al tutorial.
Re: [TUTORIAL] Creare un Baloon dei Commenti
Mi pare strano... Che editor usi? Forse in questi casi è meglio scrivere il documento con qualcosa tipo LibreOffice, senza mettere formattazioni ma solo avendo il testo liscio, e poi il copia-incolla dovrebbe andare bene. Se riesci, metti a posto il primo messaggio così si va meglio a leggere.Groove's Man ha scritto:Chiedo scusa, ma avendo scritto tutto la guida su un file .txt (per salvare in caso mi potesse servire in futuro) quella schifezza di editori mi ha gestito lui le righe buttandole a capo quando voleva.
-
- Utente avanzato
- Messaggi:30
- Iscritto il:sab 19 feb 2011, 20:48
Re: [TUTORIAL] Creare un Baloon dei Commenti
Uso semplicemente l'editor di testi "Blocco Note" di windows, se riesci a darmi un tuo contatto ti spedisco l'intera cartella contenente: Immagini, Xcf, Testo.
-
- Moderatore
- Messaggi:883
- Iscritto il:ven 12 nov 2010, 18:56
- Contatta:
Re: [TUTORIAL] Creare un Baloon dei Commenti
Blocco note
Perche non usi open office o word?
Ciauz!
Perche non usi open office o word?
Ciauz!
-
- Utente avanzato
- Messaggi:30
- Iscritto il:sab 19 feb 2011, 20:48
Re: [TUTORIAL] Creare un Baloon dei Commenti
In quel momento mi era più semplice utilizzare quello. Word fa schifo per le sue funzionalità obsolete, 100 volte meglio openoffice. Naturalmente non avevo ne tempo ne la possibilità di utilizzarlo (essendo sul mio 2° pc).
Re: [TUTORIAL] Creare un Baloon dei Commenti
In effetti basta un semplice blocco note per scrivere qui nel forum. È strano che faccia questo disastro però. Non serve che mi mandi tutto, ora il messaggio è molto più leggibile.
-
- Utente avanzato
- Messaggi:30
- Iscritto il:sab 19 feb 2011, 20:48
Re: [TUTORIAL] Creare un Baloon dei Commenti
Comunque le prossime volte utilizzerò un altro editor!
Re: [TUTORIAL] Creare un Baloon dei Commenti
Grazie per la condivisione...inserito in http://gimpitalia.it/resources/
- samsupergimp
- Principiante
- Messaggi:2
- Iscritto il:gio 29 dic 2011, 18:38
Re: [TUTORIAL] Creare un Baloon dei Commenti
Ciao Groove's Man, bellissima giuda. Anche io ho realizzato il mio ballon, il problema che non sono riuscito a completare il sesto passaggio, ovvero non sono riuscito a colorare la selezione di bordo e non capisco il perchè. Ad ogni modo questa è la mia realizzazione:
Grazie ancora per la guida.
Grazie ancora per la guida.
-
- Utente avanzato
- Messaggi:30
- Iscritto il:sab 19 feb 2011, 20:48
Re: [TUTORIAL] Creare un Baloon dei Commenti
Ciao, scusa se ci ho messo tanto a rispondere. Bravissimo, anche senza il sesto passaggio mi sembra più che ottimo. Se vuoi un consiglio, l'ombreggiatura falla un pò più grande e sottile Non saprei proprio come risolvere, ma a me sembra che vada benissimo anche così com'è.
Strano però, cerco sempre di fare guide dettagliatissime, con molte immagini per far sì che non ci siano errori.
---
In questi giorni vedrò di risolvere un possibile errore e editerò il mio primo messaggio in caso ci fosse un errore. Grazie mille e continua così!
Strano però, cerco sempre di fare guide dettagliatissime, con molte immagini per far sì che non ci siano errori.
---
In questi giorni vedrò di risolvere un possibile errore e editerò il mio primo messaggio in caso ci fosse un errore. Grazie mille e continua così!