M8 - Aplicacions web / Activitats UF1: Pràctiques
Contingut
Eines web
Pràctica 1: Aplicacions web: funcionament i conseqüències
Fes un document en el que tractis els següents aspectes:
- 1- Com funciona una web?
L’objectiu d’aquesta activitat és conèixer, des del punt de vista tècnic, quin és el funcionament de les web 1.0 i 2.0.
Cerqueu i documenteu de forma senzilla quin és el funcionament de les pàgines web estàtiques (web 1.0) i les dinàmiques (web 2.0) des del punt de vista dels servidors web.
- 2- Les aplicacions web en el nostre dia a dia
L’objectiu d’aquesta activitat és entrar a conèixer les principals mostres de la web 2.0 que podem trobar actualment a Internet.
Trieu una aplicació web de 2 seccions diferents del “prisma de les converses” i accediu-hi. Esbrineu en què consisteix, accediu a la seva pàgina, comproveu-ne la seva usabilitat (és fàcil moure-s’hi per dins, per exemple) i quin és el seu comportament si hi naveguem mitjançant un dispositiu mòbil.
Per últim, busqueu si existeix una aplicació per dispositius mòbils (apps) de la pàgina web que esteu investigant. Descarregueu-la i feu un quadre comparatiu (punts forts i febles) entre accedir als continguts mitjançant la pàgina web i fer-ho mitjançant l’app.
Exemple
Per exemple, podem triar Etsy, que està inclosa dins de l’apartat Social Marketplace (mercat al carrer de caire social) del “prisma de les converses”.
Etsy és un gran mercat en línia on un grapat de botigues de tot tipus i d’arreu del món donen a conèixer els seus productes (i els posen a la venda).
Val a dir que a Etsy no es ven (ni es compra) qualsevol cosa, tot allò que s’hi vengui han de ser articles fets a mà o manufacturats (fets per una indústria o un taller) però seguint un disseny i un encàrrec d’un artesà creador.
Des del punt de vista del “prisma de les converses”, Etsy està inclosa dins de l’apartat Social Marketplace. Si accedim a la pàgina web, ens demana que ens registrem i ens ofereix fer-ho mitjançant el nostre compte de Gmail. En el cas de la pàgina web, tenim accés a la barra superior que inclou diverses opcions per facilitar la navegació i la localització dels articles que desitgem. A més, se’ns mostren diferents propostes d’articles d’usuaris registrats per si poden ser del nostre interès.
En el cas de l’aplicació per a dispositius mòbils, no s’ofereixen les mateixes vies per facilitar la navegació com, per exemple, un ventall de propostes d’usuaris registrats que puguin resultar del nostre interès. En aquest cas, s’ofereix, en primer lloc, la possibilitat de realitzar una cerca per categories i, a continuació, propostes d’altres usuaris.
- 3- Internet: una nova professió
L’objectiu d’aquesta activitat és aprendre a reconèixer i saber triar quines eines podem utilitzar per donar a conèixer un producte o servei a Internet i fer que esdevingui reconegut arreu.
Els llocs de la gana és una empresa de nova creació que es dedica a la fabricació de bols per a menjar de gats i gossos que s’omplen automàticament quan el bol està quasi buit. Pel tipus d’empresa i del producte que ofereixen, han pensant en vosaltres per donar-los a conèixer a Internet davant del vostre reconeixement internacional com a creadors de blogs d’èxit.
Exposeu quina és la millor eina d’edició de blogs web per aquest cas concret, quina periodicitat de publicació setmanal de posts recomaneu, quin perfil d’autors incloure-hi (i amb quins permisos), quins temes tractar, etc.
Pràctica 2:Treball col·laboratiu
Part 1: Gestió col·laborativa d'un projecte
Constituïu un grup de 3 persones. Obriu-vos un compte en Trello.
Dissenyeu les fases i tasques d'un projecte mitjançant l'eina de gestió col·laborativa de projectes Trello, una aplicació de productivitat que es basa en la metodologia GTD (getting things done).
El projecte consistirà en crear una pàgina, cada membre del grup, sobre personatges de còmic i interrelacionar alguns continguts de les pàgines entre ells. Podeu consultar el vídeotutorial aquí.
Part 2: Wikis: treball col·laboratiu
1. Instal·lar una wiki en Linux (màquines virtuals) utilitzant LAMP.
- Mostreu la instal·lació al professor
2. En la wiki d'un dels membres del grup, creeu una wiki atenent a la planificació feta en la part 1 de la pràctica.
3. Consulteu manual Administració Wiki per poder pujar imatges a la wiki. Cal donar drets d'escriptura a altres en la carpeta image.
Enllaços d'interès
Pràctica 3: Eines de comunicació web
Correu electrònic
- Obre't una compte a Gmail. Posa el teu nom i cognoms al crear-la. Si ja tens l'adreça creada i no hi ha el teu nom i cognoms no passa res; però en ambdòs casos posa la teva adreça en la documentació (en aquest apartat).
- Canvia el tema.
- Introdueix una foto en el teu perfil (Configuració - General).
- Comprova que tens activa la visualització de conversa.
- Arxiveu un correu i recupereu-lo.
- Envieu un missatge a la paperera i mostreu-lo.
- Mostreu la icona per marcar un correu com a brossa.
- Utilitzeu el cercador de correus per a localitzar un determinat correu.
- Moveu algun missatge per les pestanyes.
- Destaqueu alguns correus electrònics per poder trobar-los més endavant.
- Formateu el text al vostre estil i afegiu també una foto (canvieu-li la mida a petita). Afegiu algun emoticon relacionat amb el contingut del missatge. Envieu aquest correu independent a cada membre del teu grup i als professors Núria Pi: (npi@lamerce.com) i Robert Garcia: (rgarcia@lamerce.com).
- Comprova que l'adreça dels correus enviats s'afegit als teus contactes de Gmail.
- Crea una llista de distribució anomenada companys amb dos dels membres del teu grup.
- Envia un correu a la llista de distribució companys amb una còpia oculta per a l'altre membre del grup.
- Mostreu el lloc on s'activen les notificacions d'escriptori.
- Comproveu l'ortografia d'algun missatge.
- Crea tres etiquetes: companys, família i professors; i assigna'ls-hi un color diferent.
- Activa i comprova el funcionament de la resposta automàtica amb un company.
- Activeu la funció Desfés l'enviament i establiu el temps que voleu que Gmail s'esperi a enviar el correu electrònic. Comprova el seu funcionament.
- Configura la teva signatura. Per exemple, amb el teu nom complert i a sota una frase que t'agradi.
- Modifica el mida de la finestra de redacció de missatges.
- Crea els filtres respectius per a que tots els correus dels companys, família i professors se'ls assigni l'etiqueta respectiva (Utilitza "or" per filtrar per més d'un missatge).
- Envia un correu als teus companys de grup i al professor. Comprova el funcionament del filtre.
- Proveu la selecció de diversos missatges alhora.
- Proveu els operadors de cerca avançada.
- Per a què serveix filtrar els missatges amb àlies de correu electrònic?
- Per a què serveix silenciar les converses?
- Mostra el botó "Envia i arxiva".
- Fes les captures de pantalla adients que demostrin la realització dels diferents apartats.
- Fes les aportacions que consideris oportunes.
Calendari web
A. Configuració de Google Calendar
- 1. Canvia el format de la data a dia/mes/any.
- 2. Canvia el format d'hora a 24 h.
- 3. Canvia el dia de començament de setmana a dilluns.
B. Events
Nota: Tots els events s'han de crear en el calendari de l'usuari.
- 1. Crea un event associat a un dia complert, per exemple un aniversari.
- 2. Fes que l'event de l'aniversari es repeteixi tots els anys.
- 3. Comprova com es visualitza l'event en les diferents vistes (dia, setmana, ..., agenda).
- 4. Comprova que l'event es mostra en el calendari de l'any vinent.
- 5. Comprova que posts desplaçar l'event, però que les repeticions no es desplacen simultàniament. Per fer-ho, cal tornar l'event a la seva data original, desactivar la repetició, moure de nou l'event a la data correcta i activar les repeticions.
- 6. Crea un event associat a un període de temps en un dia determinat, per exemple, l'assistència a una obra de teatre de 20:00 h. a 22:00 h.
- 7. Edita l'event per rebre una notificació de l'event per correu (fes-ho de manera que la notificació es rebi en els propers 5 minuts).
- 8. Comprova com es visualitza l'event en les diferents vistes (dia, setmana, ..., agenda).
- 9. Crea un event associat a varis dies, per exemple un viatge de negocis tres dies.
- 10. Edita l'event per associar-li el lloc en que es realitza (un hotel d'una ciutat, per exemple). Comprovi que pot consultar la localització del lloc escollit.
- 11. Canvia el color de l'event.
- 12. Comprova com es visualitza l'event en les diferents vistes (dia, setmana, ..., agenda).
- 13. Comprova que has rebut la notificació per correu de l'assistència al teatre.
C. Tasques
- 1. En la vista mensual. crea una tasca associada a un dia, per exemple comprar un regal per a una persona.
- 2. Comprova que la tasca s'ha afegit en la llista de tasques disponible en Gmail (visible fent clic en el text "Gmail" situat en la part superior esquerra, opció Tasques).
D. Calendaris
- 1. Comprova que pots desactivar i activar la visibilitat dels calendaris fent clic en el quadre situat a l'esquerra del nom dels calendaris.
- 2. Oculta el calendari Festius d'Espanya fent clic en el desplegable situat a la dreta del nom del calendari.
- 3. Restaura el calendari Festius d'Espanya fen clic en el desplegable situat a la dreta d'Altres calendaris, opció Configuració.
- 4. Afegeix un calendari fent clic en el desplegable situat a la dreta d'Altres calendaris, opció Explorar calendaris interessants. Per exemple, afegeix el calendari de partits d'un equip de l'esport que més t'agradi.
- 5. El calendari Aniversaris que mostra Google Calendar es genera a partir de les dades dels contactes. Crea un segon calendari Aniversaris per poder afegir més aniversaris, fent clic en el desplegable situat a la dreta de Els meus calendaris, opció Crea nou calendari.
- 6. Afegeix a aquest calendari els aniversaris de la teva família més propera, creant events repetits i associant-los al calendari Aniversaris. Comprova que al desactivar i activar la visibilitat del calendari, s'oculten i es mostren els events.
E. Compartir calendaris
- 1. Crea un calendari Tutoria XX (en la que XX es el nom del teu grup del institut).
- 2. Comparteix aquest calendari amb 2 companys de la teva classe.
- 3. Comprova que els calendaris que han compartit amb tu altres companys es mostren en l'apartat Altres calendaris.
- 4. Crea events en els calendaris del teus companys. Per exemple, exàmens, recuperacions o entrega de treballs.
- 5. Modifica el color dels calendaris d'acord amb algun criteri. Per exemple, que els calendaris d'un mateix curs siguin del mateix color.
- 6. Comprova que els events creats en els calendaris es mostren en el calendari general.
F. Incrustar un calendari en una página web
OPCIONAL!
Nota: S'ofereixen dues formes de publicar un calendari com a pàgina web. La primera es més senzilla, donat que és Google qui ens publica el calendari i crea l'adreça, però no es pot afegir informació addicional. La segona és més complexe, perquè creem nosaltres la pàgina web, incrustem el calendari i publiquem la pàgina, però podrem afegir qualsevol contingut.
- 1. En les opcions de configuració del calendari Tutoria XX > Compartir aquest calendari, marca la casella Fer públic aquest calendari.
- 2. En les opcions de configuració del del calendari Tutoria XX > Detalls del calendari > Adreça del calendari, fes clic en el botó blau HTML para veure l'adreça pública del calendari.
- 3. Fes clic en l'adreça i comprova que es veu el calendari. Guarda com a marcador l'adreça. Tanca la sessió de Google i comprova que el marcador funciona i pots consultar el calendari.
- 1. En un editor de text sense format, crea un document de text anomenat calendari.html.
- 2. En les opcions de configuració del calendari Tutoria XX > Detalls del calendari > Incrustar aquest calendari, copia el codi html (<iframe src=...></iframe>
- 3. Enganxa aquest codi en el document.
- 4. Completa el codi html:
<html>
<h1>Institut "La Mercè". Calendari d'exàmens i tasques del grup XXX</h1>
<iframe src ... ></src>
</html>
- 5. Puja el document a Google Drive.
- 6. Comparteix el document (al compartir fes clic en Avançada (situat a sota a la dreta), s'obrirà la finestra de configuració d'accés compartit, escull l'opció Canviar situada a la dreta de privat, s'obrira la finestra ús compartit d'enllaços, escull Sí: públic en la web)
- 7. L'enllaç serà del tipus:
https://drive.google.com/open?id=XXXXXX&authuser=0
- 8. L'enllaç que es pot enviar és el següent:
https://www.googledrive.com/host/XXXXXX
en el que XXXXX es l'ID del document.
H. Neteja final
- 1. Si ho desitges, Elimina tots els events i calendaris creats en aquesta pràctica.
MOSTRAR AL PROFESSOR EL QUE HAS REALITZAT
Fes les captures de pantalla adients que demostrin la realització dels diferents apartats.
Fes les aportacions que consideris oportunes.
Aplicacions web ofimàtiques
Pràctica 4: Gestió de documents amb Google Drive
Constituïu un grup de 3 persones.
Escolliu un tema d'actualitat tecnològica: robòtica, realitat virtual, biotecnologia, intel·ligència artificial, big data, ciberseguretat...
Utilitzant les aplicacions de Google Drive (editor de text, full de càlcul, editor de presentacions i enquestes) desenvolupeu el tema escollit.
Escolliu una compte d'un membre del grup, per desenvolupar el treball. En aquest compte tots els membres del grup tindran drets d'edició.
Cal que empreu el major nombre de recursos de cada aplicació possibles. Els continguts de cada aplicació de Google Drive han d'estar relacionats.
Tots els membres del grup han de participar en l'elaboració del documents i ha de quedar clar quina part de cada document ha implementat cada membre.
Editor de text:
- Afegiu un comentari en les parts fetes pels vostres companys i resolt els que te'n fet a tu.
- Afegiu una taula, una imatge i un enllaç relacionat amb el tema.
- Insereix algun salt de pàgina, nombre, capçalera i peu de pàgina
- Afegix un índex, que com a mínim contingui els apartats elaborats per cada membre del grup.
- Afegeix alguna adreça d'interès (marcador).
- Proveu la cerca d'informació des del propi document.
- Observa les preferències del document. Comprova el seu funcionament.
- Prova la utilitat del porta-retails web. Crea un document nou i copia la imatge i un text mitjançant el porta-retails web.
Full de càlcul:
- Cada membre del grup ha de fer un full dins del mateix llibre.
- Utilitza les diferents opcions de formateig:
- €, %, formats dates, etc.
- color de farciment, vores,combinar diferents cel·les, alineacions.
- Inseriu alguna imatge relacionada amb el contingut del full.
- Utilitzeu algunes de les funcions bàsiques: sum(), average(), max(), min() i count().
- Afegiu algun comentari en alguna cel·la.
- Confeccioneu almenys una gràfica que reflecteixi les dades que heu trobat (estadístiques sobre evolució, comparació de productes,...)
Presentacions:
- Cada membre del grup ha de fer un mínim de dues diapositives (deixeu constància de quina diapositiva feu).
- Canvieu el fons, disseny i tema de la presentació.
- Inseriu diferents elements: caixes de text, imatges, taules, vídeos, formes, línies i enllaços.
- Feu animacions de diapositives i dins de la diapositiva.
Enquestes:
- Canvieu el tema per defecte.
- Feu diferents seccions dins de la enquesta.
- Utilitzeu diferents elements per confeccionar el formulari: text, selecció múltiple, caselles de verificació, graella ...
- Feu que algun camp sigui obligatori.
- Inseriu alguna imatge.
- Feu una pàgina per cada membre del grup.
- Envieu el formulari a diferents companys.
- Creu el full amb les respostes dels companys.
- Observeu les estadístiques de les respostes.
Aplicacions addicionals::
Connecta una o dos aplicacions a Google Drive i fes un document amb l'editor de text de Google Drive documentat el seu funcionament. Utilitza imatges de les aplicacions.
Guarda el document la mateixa carpeta de Google Drive que heu fet tots els exercicis previs.
Compartiu la carpeta amb els professors Nútia Pi: (npi@xtec.cat) i Robert Garcia: (rgarcia@lamerce.com).
Vídeo Tutorials
Pràctica 5: Presentacions en línia
Prezi: una alternativa a les presentacions de diapositives en línia
Des del punt de vista de l’elaboració de presentacions en línia és interessant destacar Prezi com a proposta alternativa a les presentacions de diapositives de Google ja que permet fer presentacions més actives i dinàmiques.
Prezi és una eina online que permet crear presentacions mostrant el contingut sobre un mapa conceptual i que, mitjançant zoom, va presentant els diferents conceptes. En ser una eina 2.0, ens permet també promocionar-nos a la xarxa i treballar col·laborativament.
Exemple d'una presentació de Prezi
Com en el cas de les presentacions de diapositives de Google també podem compartir la presentació en les principals xarxes socials o descarregar-la al nostre ordinador (ja sigui en PDF o comprimida sota el format portable prezi, per poder-la reproduir).
Vídeos funcionament Prezzi
Feu una presentació sobre un tema que et resulti atractiu.
Envieu l'enllaç al professor.
Easel.ly: creant i compartint idees en línia
L’objectiu d’aquesta activitat és aprendre a crear infografies i compartir-les.
En aquest cas, l’aplicació web Easel.ly és una eina que permet generar infografies de forma senzilla i compartir-les amb els nostres contactes i amics. Easel.ly proporciona, a més, un ventall d’eines amb funcionalitats de drag-and-drop (arrossegar i deixar anar), d’edició de text i d’inserció àgil d’icones. A més, ofereix 4 temes o plantilles que podem modificar totalment al nostre gust.
Vídeos funcionament Easel.ly
Exemple infografia con easel.ly
Realitza infografia amb l’aplicació web Easel.ly amb informació del tema escollit en la pràctica Prezzi o sobre la promoció d'un event.
Comparteix-la amb el professor.
