Recursos i experiències digitals a l'Institut Antoni Pous i Argila

A 16:01 per David March Gubieras a    No comments
Ja vam comentar al començament de curs que el Gimp és un programari lliure per retocar imatges. En aquesta pràctica us proposem que feu el següent muntatge:

Per fer-ho cal obrir les dues imatges. Primera obriu la imatge del logo de l'institut i la segona imatge l'obriu amb l'opció "obre com a capes". Les dues capes han de quedar en el següent ordre:

Per eliminar el fons blanc del logo gimp heu de clicar amb el botó dret sobre la capa gim i seleccionar l'opció "afegeix canal alfa". Amb ja podreu esborrar amb la goma.

Proveu de fer-ho amb altres imatges. Sort!!

A 20:22 per David March Gubieras a    1 comment
S'acosta el Nadal i he trobat aquest script nadalenc pel bloc. Sobretot va molt bé si teniu el bloc amb fons foscos. Podeu provar com queda.
Per afegir aquest floquets de neu, heu d'anar a disseny>edició de HTML i enganxar abans de &lt /head &gt el següent codi:

&ltscript src='http://www.tutomax.com/wp-content/uploads/2009/11/nieve.js' type='text/javascript'/&gt
A 21:04 per David March Gubieras a    No comments
La Sindicació de Continguts o RSS: És un format mitjançant el qual determinats llocs d’Internet ofereixen informació. Aquest format permet que amb un programa informàtic o un servei web específic (anomenat agregador) poguem rebre totes les novetats que es vagin produint en el lloc sense necessitat de visitar-lo. A l’exercici de subscriure’s a aquest tipus de fonts RSS d’informació s’anomena sindicació de continguts.

RSS són les inicials de Rich Site Summary (Resum enriquit del lloc web) o, alternativament, Real Simple Syndication (Sindicació realment senzilla).

Aquest és el dibuix que indica que un lloc web és pot sindicar:



Hi ha dos tipus de lectors RSS:

Els que s’instal·len amb els navegadors, com el Firefox o l‘Explorer. Amb les versions noves d’aquests navegadors només caldrà fer clic sobre la icona que trobareu, per exemple a la part superior esquerra de la portada de la XTEC
Els serveis en línia, com Google, Bloglines, NewsGator o MyYahoo!.
En aquest bloc i tinc sindicat les notícies del portal de XTEC. Per afegir el canal XTEC a un d’aquests serveis, heu de clicar a un d’aquests botons, copiar la seva URL i l'enganxar al gadget RSS.
Podeu buscar altres pàgines com diàris, portals etc...
A 20:29 per David March Gubieras a    No comments
Durant el curs farem animacions amb el flash. Navegant per la xarxa però pots trobar altres opcions molt senzilles com aquesta, on pots fer que un ninja t'escrigui el text que tu vulguis.
N'he posat un a l'entrada de benvinguda.



A 19:02 per David March Gubieras a    No comments
Es pot canviar el favicon que es mostra al costat de la URL del blog. Fixeu-vos que en aquest blog hi trobareu el logo de l'institut.

Només cal afegir una línia de còdi HTML, just a sota de :

&lt/ttitle&gt

A sota hi poseu el següent codi:

&ltlink href='URL de la imatge del favicon' rel='shortcut icon'/&gt


La imatge del favicon ha de ser amb extensió ICO.

La imatge haurà de fer 16x16 px i l'heu de convertir amb ICO. Ho podeu fer mitjançant aquesta web:

Convertidor d'imatge en ICO


A 7:30 per David March Gubieras a    No comments
Mitjançant aquest link t'explicarà la manera de traduir el teu blog en diferents idiomes.


Si teniu el bloc en català caldrà modificar-ho al HTML. S'ha de substituir "sl=es i hl=es" per "sl=ca i hl=ca".



A 9:14 per David March Gubieras a    No comments
Sabeu què són els ginys o widgets? Quins afegiríeu al vostre blog?.
Recorda que google els anomena "Gadgets".

A part dels que trobaràs a l'opció "disseny", també en pots trobar a altres pàgines web:

Rellotge català. Rellotge web dissenyat per faciliar la lectura segons el sistema basat en quarts.

Google maps: Localitzacions.

Rellotge de la terra: Es tracta d'un rellotge amb informació de la població mundial i dades del medi ambient.

RevolverMaps: Globus terraqui amb localització del visitant.

En pots buscar d'altres.....


A 20:04 per David March Gubieras a    No comments

Us haureu fixat que els ordinadors del centre tenen la possibilitat d'utilitzat 2 sistemes operatius (Widows i Linkat).
Com que segurament ja coneixeu el Windows, és centrarem més amb el Linkat.
En el següent document veureu el que es pot fer.

A 8:04 per David March Gubieras a    2 comments
Per crear enquestes al teu bloc podeu utilitzar la pàgina de fluidsurverys. Aquest és molt més complert que el que trobareu en els "gadgets" de blogger, i el podeu utilitzar en qualsevol pàgina web.

Us heu de donar d'alta "sign up for free" .

Un cop a dins trieu l'opció "polls"

Cliqueu sobre "add A poll" i ja podreu crear una nova enquesta. Hi poseu el títol, les opcions de les respostes, i ho publiqueu. En aquest exemple hem posat el títol "la millor cançó".

Un cop publicat, cliqueu l'opciçó "share" i copieu el codi html que us sortirà a "embed".
Aquest codi el podeu enganxar a un gadget del tipus "HTML/Javascript" del vostre bloc.
A 8:24 per David March Gubieras a    No comments

A 7:57 per David March Gubieras a    No comments






Ajuda't dels apunts

A 21:22 per David March Gubieras a    No comments


Ajuda't dels següents apunts

A 19:52 per David March Gubieras a    No comments
A partir d'aquests apunts, dibuixa un paisatge.


Aquest dibuix no el podreu fer en una sessió. Per guardar i seguir dibuixant en altres hores de classe l'heu de guardar com a document flash a algun repositori com el google docs
A 19:55 per David March Gubieras a    No comments
Una dels aspectes interessants del programa Flash és que permet treballar per capes. Les capes es poden definir com papers de cel·lofana transparents que anem posant l'un damunt de l'altre.


Crea tres capes: Arbres, sòl i cel, i dibuixa un paisatge com aquest.









Ajuda't d'aquests apunts.
A 20:34 per David March Gubieras a    No comments
Activeu el menú Archivo Nuevo per crear un nou fitxer i, abans de començar a dibuixar, deseu aquest primer fitxer amb el nom de poligons.

» Amb l'eina Rectangulo, dibuixeu a l'escenari un quadrat de 80 pixels de costat amb un traç sòlid de 2 pixels i un degradat radial. (Podeu activar els regles per ajudar-vos en les mesures).

» Ara amb l'eina PolyStar, dibuixeu tres figures geomètriques: un hexàgon amb un degradat radial diferent de l'anterior, un triangle amb un degradat lineal i un pentàgon amb un color sòlid -sense degradat-. Indiqueu un traç sòlid de 2 pixels per a tots ells.

• Procureu que et quedin tots d'una mida semblant, encara que no exactament iguals.
Per crear colors degradats mireu els següents apunts.
A 19:58 per David March Gubieras a    No comments
Utilitzarem el programa Flash per fer animacions. Primer però haurem de practicar fent alguns dibuixos. Després d'explicar a classe les eines bàsiques de dibuix en Flash intenteu dibuixar aquest arbre. Us podeu ajudar d'aquests apunts.



Copieu i enganxeu un mínim de 8 arbres i apliqueu les diferents transformacions, de tal manera que el resultat final sigui el següent.




A 21:21 per David March Gubieras a    1 comment
EXTENSIONS DE FITXERS

Busca el significat de les següents extensions:

.rar
.tmp
.zip
.exe
.doc
.dot
.exe
.xls
.wav
.hlp
.avi
.eml
.png
.txt
.psp
.php
.rpm
.bmp
.mp3
.URL
.sys
.mdb
.fon
.pdf
.ppt
A 21:08 per David March Gubieras a    No comments
SOFTWARE I HARDWARE

  1. Descriu les diferències entre sowtware i hardware.

  2. Quina finalitat tenen els software de sistema? Anomena exemples de software de sistema.

  3. Anomena exemples de software d'aplicació.

Fitxers

  1. De quines parts consta el nom d'un fitxer?

  2. Per què serveixen les icones d'un fitxer?

  3. Què són els directoris, i per a què serveixen?

  4. Què són els fitxers de dades?
A 22:12 per David March Gubieras a    No comments
Algunes vegades et demanen que facis un mapa conceptual. Aquests serveixen per entendre, ordenar i organitzar de manera visual la informació, idees, conceptes...

Per fer-ho pots probar aplicacions en línia, com ara Gliffy (vegeu tutorial a Slideshare), mindomo, mindmeinster, bubbl, mind42 , pearltree, etc.  Totes elles permeten crear  mapes conceptuals que amb un simple registre ens permeten treballar en línia i inserir al vostre bloc, per compartir-los.

Repositori d'eines per fer mapes conceptuals.

Un altre eina que m'ha cridat molt l'atenció és l'spicynodes a cavall entre un mapa conceptual i eina de presentació molt dinàmica. Permet organitzar la informació en forma de nodes connectats, oferint una interessant i atractiva experiència de navegació. Pot ser usada per fer mapes d'idees, organitzar conceptes, presentar jerarquies de dades, demostrar relacions entre entitats ... tot de forma gratuïta per a ús no comercial






Altres exemples: 

SpicyNodes: Prueba1
A 20:43 per David March Gubieras a    No comments
NOCIONS SOBRE BITS, BYTES I BINARI

1. Defineix, de manera pràctica, que és un bit. Ajuda't d'un exemple.

2. Quantes maneres diferents podem conbinar tres bombetes? i quatre?

3. Perquè els ordinadors utilitzen sistema binari i no decimal per exemple?

4. Explica com un circuit digital on només hi han senyals elèctics es pot emmagatzemar un caràcter, per exemple, la lletra "A".

5. Què son els bioestable? Perquè s'utilitzen?

6. Què és un byte?
A 8:04 per David March Gubieras a    No comments
Procés d'arrancada

  1. En quina memòria es troba emmagatzemat el sistema operatiu?

  2. Hi ha dos tipus bàsics de memòria principal: RAM i ROM. Quina d'aquestes memòries i queda informació permanent?

  3. Quan l'ordinador està parat explica com es troben la BIOS, la memòria ROM i la memòria RAM.

  4. Què fa la memòria ROM quan polsem l'interruptor d'encesa?

  5. Quina funció fa la memòria RAM un cop encés l'ordinador?

  6. Si començo a escriure una carta amb Word. En quin tipus de memòria (principal o secundària) es guarden les dades?. Què he de fer per no perdre la informació si s’interromp el corrent elèctric o surto de Word inadequadament ?


Penja algun vídeo i alguna imatge de les memòries RAM i ROM



A 20:55 per David March Gubieras a    No comments
Memòries.


  1. Quines dues operacions realitzen les memòries.

  2. Quines diferències hi han entre la memòria principal i la memòria secundària.

  3. Explica els dos tipus bàsics de memòria. (busca imatges, videos...)

  4. Fes una llista de memòries extraïbles i un altre de no extraïbles. (busca imatges amb exemples i indica les seves capacitats. Busca novetats, enllaç a pàgines interessants etc).

A 22:22 per David March Gubieras a    No comments
El sistema de vídeo


  1. Què és una tarja gràfica? Quins models podem trobar al mercat i a quins preus?
  2. Quin és el component principal de la tarja gràfica?
  3. És important tenir una tarja gràfica equilibrada amb la pantalla? Per què?
  4. Descriu com és una pantallla TFT.
  5. Quines especificacions hem de tenir en compte a l'hora de comprar una pantalla?
  6. Busca preus de pantalles i indica les seves especificacions.

Ajuda't de gràfics, imatges i altres recursos multimèdia.

A 22:08 per David March Gubieras a    No comments


Components d'un PC

  1. Quin són els dos grans fabricants de microporcessadors per PC?

  2. Què vol dir que actualment ens trobem en la generació de microprocessadors de 64 bits?

  3. Què és la placa base? Quins components hi trobem?

  4. Quines són les funcions d'una placa base?

  5. Una placa base pot ser compatible amb qualsevol microprocessador?


Ajuda't de gràfics, imatges i altres recursos multimèdia.

A 21:55 per David March Gubieras a    No comments
A partir dels apunts i de la informació que puguis trobar a Internet, respon les següents preguntes:

Esquema funcional
  1. Esbrina que és la CPU. Enumera elements que la componen i descriu quines funcions fa.
  2. Descobreix quins processadors s'estan instal·lant actualment en els ordinadors que es venen a les botigues d'informàtica.
  3. Explica quina és la funció dels perifèrics i com es classifiquen.
  4. Què són els busos.

Ajuda't de gràfics, imatges i altres recursos multimèdia que puguis trobar per Internet.

A 20:59 per David March Gubieras a ,    No comments


A partir d'aquestes dues imatges crea una composició
A 22:02 per David March Gubieras a ,    No comments
Algunes vegades volem retocar la nostra imatge donant-li un toc de dibuix o còmic. Això ho podem fer mitjançant plugins que es venen o bé manualment.

Per fer-ho amb el photoshop seguirem els següents passos.

1. Obrim la imatge.

2. Dupliquem la capa dues vegades.

3. Les capes les col·locarem en l'ordre següent: Fondo copia 2, fondo copia i fondo.

4. Ocultem la primera capa (fondo copia 2)

5. Seleccionem la capa fondo copia i accedim al menú Imagen >- Ajuste>- Desaturar.

6. Repetim el pas 5 amb la capa Fondo.

7. Seleccionem la capa fondo copia i li posem com a modo de fusió (opció que trobareu al panell de capas i que per defecte es troba a normal), la opció sobreexponer color.

8. Tenint seleccionada la capa fondo copia, accedim al menú Imagen>- Ajuste>- Invertir.

9. Tenint seleccionada la capa fondo copia, accedim al menú Imagen>-Ajuste>- Niveles.

10. Establim com a nivells d'entrada els següents valors: 50/0,50/255. I com a valors de sortida els valors: 0/ 235.

11. Tenint seleccionada la capa fondo copia, accedim al menú Filtro>- Desenfocar>- Desenfoque Gaussiano. Establim com a radio el valor de 38, encara que podem variar entre 20 i 60 depenen de la lluminositat de tingui la imatge.

12. Tenint seleccionada la capa fondo, accedim al menú Filtro>- Artístico>- Bordes añadidos. Establim els següents valors: 7/3/2

13. Seleccionem la capa fondo copia 2, i establim com a mode de fusió la opció Color.

14. Oculta la capa fondo copia.

El resultat final podria ser el següent.

A 21:39 per David March Gubieras a ,    No comments
Aquest efecte consisteix en ressaltar una zona o objecte de la fotografia, deixant-la en color i la resta de la imtage en escala de grisos.

Podeu agafar la següent imatge i ressaltarem el bot que fa en Michel.

Primer obrirem la imatge en photoshop i duplicarem la capa Fondo. Per fer-ho, haurem de clicar amb el botó dret sobre aquesta capa en el panell de capa i seleccionar l'opció duplicar capa.

Després seleccionem en el panell de capas, la capa Fondo i eliminarem el color accedint al menú Imagen >- Ajuste>- Desaturar.

Seleccionem la nova capa que hem creat (la que es manté en color) i li afegim una máscara de capa clicant el botó corresponent en el panell capas.

Seleccionem la miniatura de la máscara de capa, que apareix a la dreta de la miniatura de la imatge i clicarem sobre l'eina pincel.

Heu de saber que la máscara de capa, només es pot pintar en color negre o blanc. Amb el color negre estarem eliminant la zona de la imatge on estarem pintant i , en color blanc, estarem recuperant-la.

Sabent això, seleccionem un pinzell gros i el començarem a passar per sobre de la zona que volem ocultar, que serà tota menys la zona d'en Michel.

Un cop acabat, el resultat hauria de ser el següent.

Podem aplicar alguns ajustaments més per resaltar la silueta.

Seleccionem la capa que està completaemnt en escala de grisos (la que no té la máscara de capa) i accedim al menú Imagen >- Ajuste>- Brillo/contraste.

En la finestra que apareixerà mourem l'indicador de constraste fins el valor de +50.

Seleccionem la capa que conté la máscara i fem el mateix. En aquest cas seleccionem Brillo/contraste els valors de +50 pel brillo i +50 pel contraste.

Aquest valors són orientatius, podeu utilitzar els que que més us agradi.

A 9:56 per David March Gubieras a ,    No comments

Aprofitant aquests dies de nevada simularem que està nevant.

Escolliu un paisatge, en aquest cas el santuari de Lourdes. El lloc més elevat del nostre municipi.

Un cop oberta la imatge amb el photoshop, fem una capa nova i ocultem la del Fondo.

Seleccionem l'eina bote de pintura o pincel i pintem tota la capa que acabem de crear.

Accedim al menú filtro -> añadir ruido

En la nova finestra activem la casella Monocromático, distribución uniforme i cantidad 18,92 %.

Accedim al menú Imagen -> Ajustes -> Niveles i establim els valors 43/3,56 /255.

Cliquem al menú Filtro -> Desenfocar -> Desenfocar mas.

Tornem a accedir al menú Imagen -> Ajustes -> Niveles i establim els valors de 10/ 4,69 / 255.

Canviem el modo de fusión de la capa i ho establim al valor Trama.
Per acabar fem visible la capa Fondo.

Per ajustar la imatge amb els flocs de neu anem a l'opció de imagen -> Ajustes -> Niveles i ajustar els valors fins els desitjats.


A 21:57 per David March Gubieras a ,    No comments
A partir de la següent imatge dels cingles de Tavertet simularem una nevada.


Per fer-ho clicarem l'opció crear nueva capa de relleno o ajuste del panell de capa i triem mesclador de canales.

En la nova finestra, activem la casella Monocromo i posarem els següents valors:

Per acabar canviarem el model normal a trama en el panell de capa.

A 20:07 per David March Gubieras a , ,    No comments
Aquesta vegada també utilitzarem el botó Intercalar cuadros de animación per crear una animació diferent a l'anterior.

Obrim una nova imatge amb les dimensions 400 x 50 píxels.

Seleccionem l'eina bote de pintura i omplim el fons de color verd.

Amb l'eina texto i amb color blanc i centrat escrivim un text sobre la imatge.


Dupliquem la capa que conté el text, i per la nova capa, seleccionem com a color el mateix verd.


Fem la mateixa operació amb la capa fons i l'omplim de color blanc.


Al final hem de tenir una capa de fons de color verd, un altre de color de fons de color blanc, una de text de color verd i un altre més de text de color blanc.



En el panell de capes ocultem la capa que té el fons blanc i la que té el text de color verd. Només seran visibles el fons verd i el text en blanc.


Fem un nou quadre d'animació mitjançant el panell d'animació i seleccionant l'opció nuevo cuadro, i en aquest cas haurem de tenir visibles la capa de fons blanc i el text en verd, es a dir, al revés que abans.


Ara copiarem el primer quadre d'animació, amb l'opció duplicar el cuadro de texto del panell d'animació.

Aquest nou quadre l'hem d'arrossegar al final de les dos anteriors.






Per completar l'animació, seleccionem el primer quadre i cliquem el botó intercala cuadros de animación. I escrivim 20 com a número de quadres a inserir.


Guardem l'animació amb l'opció guardar optimizada.



Photobucket
A 14:18 per David March Gubieras a , ,    No comments
En aquesta entrada utilitzarem l'eina intercalar cuadro de animación que trobarem a la part inferior del panel d'animació.

Obrirem el ImageReady 3.0. i fem una imatge nova de 300 x 50 píxels.

També obrierem la imatge del logo dels 25 anys de l'institut.

Amb aquesta imatge i sobre la capa 1 cliquem el botó dret del ratolí i dupliquem la capa.


Arrosegem la Capa 1 copia dins la imatge nova que haviem creat de 300 x 50 píxels i la deixem a la part esquerra.

Dupliquem el cuadro actual que trobarem en el panel d'animació.




Utilitzant l'eima mover arrossegarem el quadrat que tenim seleccionat fins l'altre extrem.



Ara és quan utilitzarem l'eina intercalar cuadrados de animación, situat en el panell d'animació.

Aquesta eina crea els quadrats intermitjos per simular una animació, que en aquest cas serà d'esquerra a dreta.

Hem de seleccionar els dos quadrats del panell d'animació i cliquem el botó Intercalar cuadrados de animación.

En aquest exemple he utilitzat 15 quadrats per afegir. Com més quadrats més suau serà el moviment..

Ara només ens falta guardar-ho amb l'opció guardar optimizada, i penjar-la photobucket.

Podeu practicar amb altres estils, fer textos etc....

Photobucket
A 23:23 per David March Gubieras a , ,    No comments
Per aquesta pràctica utilitzarem el programa Adobe ImageReady 3.0.

Primer es crea la imatge amb les dimensions que vulguem. Archivo <- nuevo="" strong="">. En aquest exemple, utilitzarem 400x50.

Anem creant les diferents capes amb el text que volem que surti. Per crear les capes cliquem sobre la icona crear capa nova. Amb l'eina Texto anem escrivint els següents missatges. (Es aconsellable que anem traient la visibilitat de les capes "la icona de l'ull al costat de les capes").

En la finestra d'animació, haurem d'afegir quadrats d'animació i anem seleccionant quina capa volem mostrar en cada una activant i desactivant la icona de l'ull. Utilitzarem l'opció duplica el cuadro actual.

En el nostre cas deixarem l'opció infinito.
Si ens fixem en el panell d'animació, a sota de cada quadre podem seleccionar l'interval de temps que es mantindrà en pantalla. Podem triar l'opció de 2 segons.
Per guardar-ho utilitzem l'opció guardar optimizada i s'ha de guardar en format gif.
A partir d'aquí podem afegir estils perquè sigui més vistós.

Photobucket
Nota!! Si vols que el gif es vegi animat, primer l'hauràs de penjar a una pàgina web. En aquest exemple he utilitzat photobucket. També pots utilitzar el flick. (L'àlbum picassa no accepta gifs animats).
A 19:57 per David March Gubieras a ,    No comments




En aquesta entrada canviarem la cara d'un
personatge i la col·locarem en un altre cos.

Primer obrirem les dos imatges amb el photoshop. Les dues imatges han de tenir el mateix angle visual, per exemple que es trobin davant de la càmera.

Hem d'incloure les dues imatges en una, per fer-ho duplicarem la capa de la imatge de l'Iniesta i la inclourem en l'altre. Amb la imatge de l'Iniesta clicarem sobre la capa fondo amb el botó dret i seleccionem duplicar capa. A la capa nova li donem el nom de Iniesta. Llavors, arrossegarem aquesta capa dins la imatge d'Obama.
Tancarem la imatge que ens sobre i ens quedarem amb la imatge que té les dues capes.
Ara hem de duplicar la capa fondo i li posarem el nom de Obama.
Amb aquesta composició posarem la cara del president dels Estats Units amb el cos del jugador del Barça.

Ocultem les capes fondo i Iniesta. Per fer-ho hem de clicar sobre el símbol de l'ull de les capes. Amb l'eina borrador eliminem tota la imatge menys la zona de la cara.
Treballant sobre la capa de l'Iniesta eliminarem amb l'eina borrador tota la imatge menys la cara.
Activarem la visualització de la capa de l'Iniesta que abans havíem desactivat clicant l'ull.


Amb l'eina tampón de clonar i transformar podem acabar d'ajustar la composició.