Photopea

Photopea
Recursos Digitals I
Inici de sessió
Per entrar al Photopea heu d’anar a la pàgina web
https://www.photopea.com/ i heu d’iniciar sessió amb el vostre compte de
s’institut.
Tancar sessió
Per tancar la sessió anar al menú “Compte” o “Cuenta” segons l’idioma
1
2
Pantalla principal
Configura l’idioma de la pàgina
Projecte nou
Paràmetres del projecte nou
Nom: nom del projecte
Amplada i alçada: mida del nostre llenç.
DPI: Dots per inch. Per defecte és 72. Calidad
estàndar.
Si volem imprimir la imatge, hauría de ser 150.
Si volem bona qualitat 300.
Quanta més qualitat més “pesa” la imatge.
Fons: color de fons del nostre llenç.
També podem triar una plantilla.
Barra de menús
Entorn de treball Photopea
Barra d’eines
Barra d’eines
El nostre llenç.
Àrea de treball.
Finestra de
capes, canals i
traçats.
Historial
de les
accions
fetes.
Guardar directament al drive
Per guardar tots els nostres arxius directament al drive, s’ha d’anar al menú Arxiu
- Guardar - Guardar Más - PSD to Storage.
1
2
Us demanarà que seleccioneu els vostre compte
de Google i Accepteu.
Obrir una imatge
Per obrir una imatge s’ha d’anar al menú Arxiu i obrir.
Si la imatge està guardada al vostre drive heu de fer Arxiu - Abrir Más - Storage.
Se us obrirà la vostra carpeta del Drive i d’allí heu de triar la imatge que voleu
obrir.
1
1
2
Barra d’eines
La barra d’eines principal és la que està situada a l’esquerra.
Barra d’eines (II)
Barra d’eines (III)
Cada eina té unes propietats i característiques personalitzades.
Per exemple, quan seleccionem el pinzell
surten unes propietats
determinades que es poden canviar a la part superior de la pantalla.
Aquestes propietats són diferents i canvien depenent de l’eina seleccionada.
Aquestes són les corresponents a l’eina degradat.
Eina pinzell
Aquesta eina ens permet pintar al nostre llenç.
Podem canviar el tipus de pinzell a les propietats de
la barra superior o al botó del pinzell de la part de la
dreta.
Tasca 1. Pinzell.
Obrir un projecte nou amb els paràmetres per defecte.
Triar el següents pinzells i fer una línea.
1- Pinzell Soft Round, mida 15, color negre, duresa 0.
2- Pinzell Soft Round, mida 25, color blau, duresa 0.
3- Pinzell Soft Round, mida 25, color blau, duresa 25%.
4- Pinzell Soft Round, mida 25, color vermell, duresa 25%, espaiat 150%.
5- Pinzell Hard Round, mida 10, color verd, duresa 100%.
6- Pinzell Hard Round, mida 10, color verd, duresa 10%.
7- Pinzell Big Marker 02, mida 10, color rosa.
8- Pinzell Big Marker 02, mida 30, color rosa.
9- Pinzell Inking, mida 100, color groc.
10. 4 pinzells amb diferents colors, mides i característiques.
Guardar el dibuix al drive amb el nom pinzells 1 i envia’l a la tasca corresponent.
Carregar més pinzells
1
Selecciona l’eina pinzell.
Fer clic a la fletxa del costat de la mida.
1
2
Fer clic a la fletxa a sota de la duressa .
2
Seleccionar els pinzells “pencil.abr” i/o
“trees.abr” per carregar més pinzells.
3
4
Tasca 2. Pinzells
Carregar els dos pinzells predeterminats: pencil i tree.
Obrir un arxiu nou i utilitzar els pinzells carregats.
Fer una mostra de 3 / 4 pinzells de cada utilitzant diferents colors, mides, dureses,
espaiats.
Eina degradat
L’eina degradat ens permet creat fons diferents amb degradats de colors.
Els degradats poden ser de diferents tipus.
Agafa els colors que tenguis per defecte de primer i segón pla.
Eina Degradat (II)
Es pot jugar amb l’editor del degradat per
seleccionar els colors.
També amb l’opacitat.
Tasca 3. Degradats
Crear un projecte nou amb les següents característiques:
800 ample, 1200 altura i150 pixels.
Fer un degradat de tipus líneal amb color taronja i blau.
Anomena l’arxiu degradat 1.
Crear un projecte nou amb les següents característiques:
400 ample i 400 altura i 100 pixels.
Fer un degradat de tipus diamant amb els dos colors que més t’agradin.
Anomena l’arxiu degradat 2.
Crear un projecte nou amb les següents característiques:
1440 ample i 720 d’altura i 172 pixels.
Fer un degredat del tipus que t’agradi més i dels dos colors que més t’agradin.
Anomena l’arxiu degradat 3.
Paleta de colors
La paleta de colors ens dóna el color del pinzell i el color del llenç.
De forma predeterminada el color del pinzell és negre i el del llenç és blanc.
Per canviar els colors entre ells utilitza la tecla X.
Per tornar als colors predeterminats utilitza la tecla D.
Cada color ve determinat per un codi en hexadecimal
determinat per la composició de 3 colors bàsics:
vermell (R), verd (G) i blau (B).
Cada color pot tenir un valor entre el 0 i 255. (si s’utilitza el sistema RGB).
Exemple de codis de colors utilitzant el sistema RGB
Mida de la imatge
Si obrim una imatge amb el photopea podem retocar la seva mida original.
Anem al menú “Imatge” - Mida de la imatge.
Podem retocar la seva amplada i la seva alçada.
Si està el cadenat enganxat les mides es retoquen
de forma proporcional, sinó es pot retocar una amplada
i una alçada que es vulgui.
No confondre la mida de la imatge amb la mida del
llenç.
Exportar imatges
Les imatges es guarden amb format .pds que és format per
defecte del Photopea. Aquest format és molt “pesat”.
1
Les imatges, però, es poden exportar en formats més “lleugers”
que poden ser emprats en pàgines web, xarxes socials .. etc.
Per exportar les imatges s’ha d’anar al menú
“Arxiu - Exportar imatge”.
2
Capes
Una imatge pot estar formada per una sola o diverses capes.
Les capes són com fulles transparents superposades una sobre l’altra.
Cada capa pot contenir diferents objectes que es poden superposar i crear efectes diferents.
Ús de les capes:
●
●
●
●
Crear un text a sobre d’una imatge. Es crea una capa de text i així la imatge no es veu afectada.
Si es vol crear un efecte a les imatges o una màscara, millor també utilitzar capes.
Si es vol crear una composició de diverses imatges i posar una imatge a cada capa diferent.
Si es vol crear un disseny amb diferents elements, formes i text, es pot crear una capa per cada
element.
Capes (II)
Paràmetres d’una capa:
●
●
●
●
Nom.
Farcit (relleno).
Bloqueig.
Opacitat.
Operacions amb les capes:
●
●
●
●
Encadenat
Estil de capa
Eliminar capa.
Afegir màscara.
Capes (III)
Visibilitat de les capes: Podem tenir capes que siguin visibles o no.
Sabem si una capa és visible si veiem l’ull o no.
Enllaçat de les capes: Dues o més capes poden estar enllaçades. Per estar
enllaçades, s’han de seleccionar les capes, amb la tecla “Control” si no estàn
col·locades de forma consecutiva i fer clic a la cadena.
Duplicar capa: Una capa es pot duplicar i així tenim els
elements duplicats.
Duplicar en: Es pot copiar un element en una capa en concret.
Bloquejar. Una capa es pot bloquejar i no es pot modifcar el seu contingut.
Apareix un cadenat.
Capes - Aplanar
Quan una imatge amb diverses capes ja està acabada amb tots els seus retocs
s’aconsella “aplanar” la imatge, és a dir, convertir totes les capes en una sola
imatge.
S’ha d’anar en compte perquè una vegada “aplanada” la imatge ja no se’ns
permetrà fer cap retoc a les capes originals de la foto.
Tasca 4. Capes
Obrir la imatge “Gat.jpg” adjunta a la tasca. Haureu de retocar la mida de la imatge. Ha de ser 500 * 309.
Crea una nova capa a la imatge i anomena-la “Color”.
Crea el següent color: R:50, G:200 i B:150. Fixa’t en quin codi hexadecimal t’ha sortit.
Pinta la capa “Color” amb aquest color i l’eina pot de pintura.
Canvia l’opacitat de la capa “Color” al 75%.
Crea una nova capa i anomena-la “Degradat”.
Aplica un degradat de tipus “Ángulo” i aplica de color principal el “Rosa” i de segón pla “Blanc”. Aplica un degradat a la part
esquerra de la imatge.
Aplica una opacitat a la capa “Degradat” del 30%.
Intercanvia les capes per veure com queda la imatge final. Deixa-ho com estava abans: la capa de degradat primer, color i
fons.
Guarda el fitxer amb el nom “Capes 1” i exporta’l com a .jpg
Eina Text
Podem afegir un text a una imatge. Per això es selecclona l’eina Text i es fa un
clic on es vol afegir el text.
Es crearà una nova capa on sortirà aquest text. Això ens permetrà que el text
sigui independent de la imatge.
En acabar fer clic aquí
Opcions de l’eina text (menú superior).
Opcions de l’eina text (menú de la dreta).
Es pot canviar el tipus de lletra, color, alineació, interlineat i altres.
A la capa text es pot aplicar qualsevol propietat de les capes.
Tasca 5. Text
Agafa la imatge de l’exercici anterior “Capes 1” i afegeix un text “El meu gat” amb
les següents característiques:
●
●
●
●
●
Text: Desyrel
Color: groc
Mida: 50
Deformar: Arc - Curvar 20 %
Opacitat de la capa 60%.
Col·loca la capa de text baix de tot. Què passa? Recorda que l’ordre de les capes
és molt important.
Guarda la imatge amb el nom de Text i exporat’l com a .jpg
Tasca 5.1: Text
Fes un text escalonat similar al de l'exemple a Photopea, a una imatge de
1200x600 pixels.
Exporta el fitxer com JPG o PNG i entrega'l aquí
Eina Figures
Aquesta eina ens permet dibuixar figures geomètriques.
Cada figura té uns paràmetres que es poden retocar. Aquests paràmetres es
troben a la part superior de la pantalla. Baix del menú d’opcions.
En principi cada figura es crea en una capa nova però es poden fer “operacions
amb les figures”: unió, interesecció, .. i altres.
Recorda que per moure les figures o altres objectes d’una capa tenim l’eina de
moure:
Exemple de figures:
Tasca 6 - Figures
Crea un fitxer nou amb 5 figures diferents i les següents característiques:
●
●
●
●
●
Dos figures hauran d’estar “rellenades” amb un degradat.
Una figura haurà d’estar “rellanada” amb un color sòlid.
Una figura haurà d’estar “rellanada” amb un patró.
Una figura haurà de tenir forma lliure (que no sigui un triàngle).
Dos capes de figures hauran d’estar enllaçades, és a dir, si es mou una
figura també es mourà l’altra.
● La capa d’una figura haurà de tenir opacitat 50. Aquesta figura haurà de ser
més gran i haurà d’estar “a sobre” d’una figura més petita, la capa haurà
d’estar a un nivell superior.
Guardar l’exercici amb el nom de figures.
Tasca 7 - Lliure
En aquesta tasca hauràs d’agafar una imatge d’internet que tingui el fons blanc i l’hauràs
d’obrir en el Photopea.
Has d’afegir en aquesta imatge els següents elements:
Dos capes de text.
Una capa de degradat.
Una capa amb una forma geomètrica.
Hi ha d’haver dues capes enllaçades, capes amb diferents opacitats, has de tenir una capa
que no sigui visible.
La imatge resultant ha de ser original.
Guarda la imatge amb el nom de “Lliure”.
Eines de seleccions
Hi ha tres eines de seleccions diferents, que s’utilitzaran depenent de la forma i
del què volem seleccionar.
Selecció per àrea: (rectangular o elíptica).
Selecció per àrea no definida: (llaç, llaç poligonal, llaç magnètic).
Selecció per color i altres: (vareta, selecció ràpida i per objecte).
Eina de selecció
Eina de selecció rectangular
Eina de selecció elíptica
Eina de selecció (II)
Eina de selecció per llaç:
Es traça un
àrea amb el ratolí del que es vol seleccionar.
Queda una forma lliure. El llaç s’ha de tancar.
Eina de selecció per llaç poligonal:
Es traça un àrea on s’aniran marcant els punts
que formaran el “polígon”. El llaç s’ha de tancar.
Eina de selecció (III)
Eina de selecció per llaç magnètic:
Es va marcant la figura que es vol
seleccionar i el llaç “s’aferra com un imà” a la
imatge i va delimitant l’àrea a seleccionar. El llaç
s’ha de tancar.
Per cancel·lar una selecció de llaç que s’estigui
realitzant s’ha de fer prèmer la tecla ESC.
Si la secció ja està feta (i tancada).
Al menú Seleccionar tenim totes les
opcions que podem fer amb
aquesta selecció.
Una vegada tenim la selecció feta
també podem canviar els colors,
podem copiar-la, .. etc.
Modes de selecció
Una vegada feta una selecció, a aquesta se li poden sumar, restar, interseccionar
altres seleccions.
Per això s’ha de fer el següent:
Selecció la primera imatge i després seleccionar el mode de la selecció
i seleccionar la segona part.
Suma de seleccions
Diferènca de seleccions
Selecció màgica
Per fer servir aquesta selecció s’ha de tenir en compte el següent:
1- Tenir el color negre seleccionat com a color principal
2- Prémer la tecla Q.
Us sortirà la capa seleccionada on voleu fer la selecció en vermell.
Ara amb el pinzell podeu seleccionar l’àrea que volgueu:
Fixeu-vos que l’àrea seleccionada surt en vermell, s’ha de tornar a prémer la tecla
Q per que l’àrea quedi seleccionada i després ja fer l’operació que es vulgui.
Nota: L’àrea seleccionada queda exclosa
de l’operació. !! És una selecció inversa.
Tasca 8: Seleccions
A partir de la primera imatge heu d’aconseguir la imatge final.
Eina vareta
Aquesta eina serveix per seleccionar per colors.
És ideal per seleccionar objectes amb fons d’un color.
Com totes les eines té uns paràmetres que es poden modificar (calar, la
tolerància (colors semblants) i altres. Aquests paràmetres apareixen a la part
superior.
Per treure un fons s’ha de seleccionar aquest amb la vareta i després anar al
menú “Editar”- “Netejar” o la tecla Suprimir.
Gat amb fons blanc.
Gat amb fons transparent.
Eina vareta (II)
Els objectes amb fons blancs són fàcils de seleccionar per després poder fer
muntatges de superposició de fotos.
Si volem modificar la mida d’un objecte d’una capa per posar-ho a sobre d’una
altra imatge
1
2
Tasca 9: Eina vareta
Obre l’arxiu “selecció fons”, treu el fons blanc de la imatge.
Posa aquesta imatge a la imatge a la imatge de fons “fons platja”
La imatge de selecció de fons s’ha de reduir de mida.
Has de posar un text que digui “Vull vacances!!”.
Guarda la imatge amb el nom de “vareta”.
Guarda la imatge amb les capes aplanades amb el nom de “vareta_aplanada”.
Exporta la imatge amb format jpg.
En aquesta tasca has d’enviar 3 fitxers.
Transformar imatge
Una imatge es pot transformar. Per això s’ha d’anar al menú Imatge Transformar:
Voltejat horitzontalment
Girat 180º
Transformar imatge (II)
Si es volen fer composicions d’imatges, les imatges s’han de guardar prèviament,
cada transformació és una imatge per si sola i després adjuntar-les a un fitxer nou
i cada imatge transformada serà una capa. (Per obrir les secundàries Abrir y
colocar)
Tasca 10: Transformacions
Eina retallar
Podem retallar una imatge amb l’eina “Retallar”.
Ens surt una guía que ens permet moure fins seleccionar tota l’àrea que volem
que es quedi la imatge. També es pot “voltejar”. Quan tinguem la imatge que
volem, es fa Intro i ja està.
Eina clonar
Triar l’eina.
Triar el pinzell.
Per triar l’àrea que es vol començar a clonar, pitjar la tecla K (assegurar-vos que
teniu l’àrea de la imatge i la capa ben seleccionada).
Començar a pintar l’objecte clonat al nou lloc.
Tasca 11: Clonar
Tasca 12: Composició final.
Sessions
1- Començar amb el photopea: entrar, guardar
drive, projecte nou, eina pinzell, com carregar
pinzells extres i eina degradat, explicació bàsica
del color. Tasca 1,2,3. (1 sessió)
2- Obrir una imatge desada. Color. Mida de la
imatge. Diferència entre imatge i llenç.
Transformació de la imatge?. (1 sessió)
3- Capes. Crear una capa nova. Afegir una
imatge a una capa nova. Opacitat de la capa.
Duplicar capes. Enllaçar capes. Eina Text. Eina
Figures. Tasca 4,5,6,7. (3 sessions)
5- Eina seleccions. Tasca 8,9. (2 sessions)
6- Eina vareta. Transformació de la imatge?
Tasca 10 i 11. (2 sessions)
7- Eina retallar i eina clonació. Tasca 12. (1
sessió)
8- Activitat final: Meme de notícia falsa. (2
sessions)
Mës avançat:
Filtres
Saturació color
Superposición de motivo
Editar - transformacio - capes