lunes, 21 de enero de 2019

Código Qr

Hola a todos.
Esta semana hemos realizado una práctica dónde teníamos que realizar algunos códigos Qr.
Os dejo con la explicación y los pasos.
Espero que os guste.

¿Qué es un código Qr? Es una imagen con unas formas distintivas(o evolución del código de barras) que cambian en función del link o la página que hayamos enlazado al código. Estos se pueden escanear a partir de la cámara del móvil con un lector de Qr.
Código Qr del Blog:
He realizado un código Qr del blog a partir de una aplicación llamada "Qr encode" que nos permite realizar estos códigos y personalizarlos a nuestro gusto.

  1. Primero he buscado la página y he insertado el URL del blog
  2. Después he personalizado el código Qr a mi gusto

  3. Finalmente lo he exportado
Código Qr de mi blog:

Código Qr de la empresa de la que hice el crossmedia "Dc Comics":

  1. He buscado la página unitag.com para realizar estos códigos Qr
  2. Luego he insertado el URL de Dc comics
  3. De seguido he diseñado el código Qr a mi gusto
  4. Finalmente lo he descargado:

Código Qr "Instagram":
  1. He insertado el URL de mi página de instagram
  2. He personalizado el código Qr a mi gusto añadiéndole un módulo elegante y un ojo de escudo
  3. Finalmente lo he exportado:

miércoles, 16 de enero de 2019

Thinglink (Imágenes interactivas)

Hola a todos.
Esta semana hemos realizado una práctica que consiste en hacer una imagen interactiva a partir de una aplicación llamada Thinglink.
Aquí os dejo la imagen y los pasos.
¿Qué es Thinglink? Es una página/app que nos permite realizar imágenes interactivas, 360 y vídeos a partir de imágenes independientes que hayamos elegido
Fotos de la página:

  1. Primero he buscado imágenes de Taipéi que fueran Creative Commons
  2. He añadido algunos "Tags". El primero a sido sobre la dirección de mi blog. He insertado el link de este y cambiado el icono 
  3. A continuación he añadido otro Tag describiendo un poco Taipéi y he añadido un link que va directo a Wikipedia.
  4. De seguido, he añadido un tag de su localización añadiendo un link a Google Maps
  5. Dicho esto, he buscado un vídeo de Youtube sobre posibles actividades que se pueden realizar en esta ciudad, y una pequeña introducción a esta. He añadido el link al tag y he cambiado el icono al logo de Youtube

  6. Por último he copiado el link y he puesto la imagen en el código HTML de Blogger.

lunes, 14 de enero de 2019

Photomerge(Foto panorámica)

Hola a todos.
Esta semana hemos realizado una práctica con la herramienta de Photoshop "Photomerge".
Os dejo los pasos y la imagen.
Espero que os guste.


¿Qué es Photomerge? Es una herramienta de Photoshop que nos permite hacer fotos panorámicas a partir de las fotos independientes que hayamos hecho. Esta herramienta fusiona estas fotos y cómo resultado nos da una foto panorámica. 
¿Qué es una imagen panorámica? Una imagen panorámica es la que muestra un panorama, usualmente paisajístico o arquitectónico, y que se distingue por el amplio horizonte visual que cubre.

1.Hemos realizado entre 5 y 10 fotos en el mismo encuadre y ángulo
2.A continuación hemos abierto las imágenes en Photoshop  y las hemos ordenado de forma vertical u horizontal. Abrimos la herramienta de Photomerge en "Archivo-Automatizar-Photomerge"

3. Dicho esto, se abre una ventana de Photomerge que nos permite hacer la panorámica a nuestro gusto con las opciones de realizar una panorámica automática, perspectiva, cilíndrica, esférica, collage y cambiar posición. En nuestro caso la hemos realizado automática
4. Finalmente nos realiza la imagen panorámica. Debido a que no lo hemos hecho con trípode hay partes de la imagen que debemos cortar.  Ya recortada la imagen tendremos nuestra foto panorámica.




Imagen definitiva:

jueves, 10 de enero de 2019

Dermander 360

Hola a todos.
Hoy hemos realizado una práctica en la que consiste en hacer una imagen 360.

  1. Hemos realizado entre 5/10 fotos teniendo en cuenta en la posición y el encuadre que estábamos.
  2. A continuación hemos juntado todas las imágenes en una aplicación que se llama "Dermander" 


  • ¿Qué es dermander? Es una aplicación que nos permite realizar fotos panorámicas y 360 a partir de varias fotos realizadas.
      3. Para acabar hemos copiado un código que nos ha dado dermander y lo hemos copiado en                   "HTML" en Blogger para que se nos permita visualizar la imagen.


Os dejo la imagen.
Espero que la disfruteis.





miércoles, 9 de enero de 2019

Tipos de estructuras en una página web

Hola a todos.
Esta semana hemos aprendido los tipos de estructuras que hay en una página web y qué es in mapa de web.
Espero que os guste.

¿Qué es un mapa web? es una lista de las páginas de un sitio web accesibles por parte de los buscadores y los usuarios. En el se muestra el contenido de la página de forma organizada.
Tipos de estructura de navegación: 

Lineal: Es la estructura más simple. El usuario sólo puede seguir un mismo recorrido. Ejemplos:
1. http://www.deciencias.net/disenoweb/disenyo/paginas/orienta_pagina.htm
Mapa web:

2. https://www.mundoprimaria.com/cuentos-infantiles-cortos/zorro-inteligente-interactivo (Sólo el cuento)

Reticular: Permite que el usuario tenga total libertad para seguir diferentes caminos cuando navega por el programa o web. Ejemplos:
1. https://daniseuba.wordpress.com/2008/06/30/el-diseno-reticular/

2.https://www.elmundo.es/internacional.html


Jerarquizado: Combina las dos modalidades anteriores. Este sistema es muy utilizado pues combina las ventajas de los dos sistemas (libertad de selección y organización de información)
Ejemplos: https://www.bbc.com/news/world

Mapa web:




Mapa web:



Telaraña: Para usuarios más avanzados, se vincula cualquier página sin seguir ningún orden aparente, lo que puede desorientar al usuario.
Ejemplos:
1.http://arngren.net/

jueves, 20 de diciembre de 2018

miércoles, 12 de diciembre de 2018

Análisis de páginas web legibles y no legibles.

¿Qué es la legibilidad? Es la capacidad de definir y distinguir los elementos que deseamos en una página web, y dentro del texto los caracteres.
Procedo a mostrar un ejemplo de página legible y no legible y comenzaré su análisis.

Página legible: https://www.museodelprado.es/

1. Las fuentes contrastan con el fondo


2. La página está ordenada

3. Su navegación es muy rápida

4. La página web es llamativa

5.
Tiene fácil compresión lectora
6. Varía el tamaño de las fuentes




Página no legible:http://arngren.net/

1. Los enlaces están muy pegados y dificultan la comprensión lectora
2. La navegación es lenta debido a la gran cantidad de contenido multimedia incrustado en la página

3. La página no está ordenada

4. No tiene fácil comprensión lectora

5. El color de las letras complica la legibilidad de la página.



Algunos consejos de legibilidad son:

  • Contraste: El texto debe contrastar con el fondo de nuestra página web.
  • Jerarquía: Variar los elementos de nuestra página web siguiendo unos patrones jerárquicos.
  • Columnas: No deben superar más del 50% de ancho de nuestra pantalla
  • No incluir Flash en el caso de que nuestra página web esté dirigida a usuarios que utilicen iPad o iPhone.
  • No colocar los enlaces unos pegados con con otros
  • No incluir imágenes o vídeos con un peso muy elevado para que nuestra página tenga fácil navegación.

lunes, 10 de diciembre de 2018

Final Cut-Chroma

Hola a todos.
Esta semana hemos aprendido mediante Final Cut cómo poner un fondo a un vídeo o imagen que tenga un chroma.

¿Qué es un chroma?Es una técnica audiovisual utilizada tanto en cine, televisión y fotografía, que consiste en extraer un color de una imagen o vídeo (usualmente el verde o el azul) y reemplazar el área que ocupaba ese color por otra imagen o vídeo

Proceso de cómo lo he hecho:

Hemos utilizado un vídeo que contenía el fondo verde para poder poner una imagen o un vídeo de fondo mediante un efecto llamado 'incrustración'.
Finalmente hemos puesto los créditos y hemos exportado.
Os dejo el resultado,espero que os guste.



Final Cut-Almazara

Hola a todos.
Esta semana hemos realizado una edición de vídeo mediante la herramienta de Final Cut donde aparece el proceso de cómo se hace el aceite de oliva en una almazara.
Primero he realizado un logo para la almazara donde aparecen las hojas del olivo y dos aceitunas
Después he añadido unas fuentes al vídeo señalando que es una almazara y qué se hace en esta.
He puesto unos efectos de transición y he exportado el vídeo.
Os dejo el resultado,espero que os guste.


miércoles, 5 de diciembre de 2018

Final Cut-Travel Trip

Hola a todos.
Esta semana hemos editado algunos vídeos mediante el Final Cut.
Hemos editado un vídeo donde promocionamos dos o tres países de un continente mediante la herramienta de Final Cut.
Proceso:
1.Hemos seleccionado un continente y tres países, así teniendo un vídeo de cada uno de ellos.
2.He recortado los vídeos ya que eran bastante largos por las partes que más me gustaban y he añadido fuentes al principio señalando el lugar de origen de donde se ha grabado el vídeo.
3.Puse un efecto de transición en cada uno de ellos y una canción sin copyright.
4.He exportado el vídeo en calidad de web
Espero que os guste


jueves, 22 de noviembre de 2018

Contenidos Protegidos por la Propiedad Intelectual

Hola a todos.
Esta semana hemos aprendido qué son las licencias Creative Commons y para qué sirven.
Hemos realizado una práctica donde ponemos algunos ejemplos sobre obras creative commons y sus autores.
Espero que os guste.