FlipSnack

Hola a todos.
Esta semana hemos realizado una práctica en la app llamada "FlipSnack" que nos permite editar pdf con el efecto flip page.
Espero que os guste
Pasos que he seguido:

1. He añadido mi pdf de crossmedia en la app de FlipSnack
   
2. He personalizado mi pdf poniendo marcas de agua en el
   
3. Finalmente he copiado el código embebido

Efecto Flip Page

Hola a todos.
Esta semana hemos realizado una actividad sobre el efecto Flip Page.
Espero que os guste.

¿Qué es el efecto flip page? Es un efecto que permite simular en un documento digital el cambio de una página a otra correlativa como si se ojease una revista o libros físicos.

Para esta actividad hemos utilizado la aplicación "Issuu" que se trata de una aplicación que nos permite realizar este efecto sin necesidad de descargar nada, es decir, oline.
Pasos que he seguido:

1. He descargado mi crossmedia del servidor.
2. Después lo he añadido a la página de issu
   
3. Finalmente he copiado el código embebido en el blog:

Realidad aumentada

Hola a todos.
Esta semana hemos aprendido y hemos realizado algunas actividades sobre la realidad aumentada.
Os dejo las actividades, espero que os guste.

¿Qué es la realidad aumentada? La realidad aumentada es un conjunto de tecnologías que permite a los usuarios que visualice parte del mundo real a través de un dispositivo con información gráfica añadida por este
Las ventajas de utilizar la realidad aumentada es que es impactante, llama la atención, por lo que los usuarios estarán atentos de tu explicación, mejora la experiencia de este, para aplicaciones domésticas es fácil de utilizar, etc.
Ejemplo:https://www.nubemia.com/realidad-aumentada-en-la-educacion/

Artículos relacionados con la realidad aumentada: 

1. Realidad aumentada para la decoración de interiores: https://blogthinkbig.com/decoracion-aplicaciones-realidad-aumentada
2. Realidad aumentada, la última revolución digital: https://www.muyinteresante.es/tecnologia/articulo/realidad-aumentada-la-ultima-revolucion-digital

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:
   
   
   

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.

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:

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.

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:

2.http://www.exteriores.gob.es/Portal/es/Paginas/mapasitio.aspx

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/

2. https://es.wikipedia.org/wiki/Wikipedia:Portada

¡Feliz navidad!

Hola a todos.
Hemos realizado una animación para desearos felices fiestas.
Espero que os guste.

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.