viernes, 19 de mayo de 2017

Motor Gráfico

En la práctica de esta semana hemos creado un juego con el motor gráfico Unity.
En primer lugar hemos descargado el programa y nos lo hemos instalado, posteriormente nos hemos registrado y hemos comenzado a crear nuestro juego.
Únicamente hemos tenido que ir siguiendo los paso de una web. Pincha aquí para ir a la web.
Al ir siguiendo los pasos hemos ido creando un juego de una pelota que se va comiendo unos cuadrados que giran sobre si mismos, cada cuadrado comido da un punto.



El resultado final es el siguiente:


sábado, 13 de mayo de 2017

Realidad aumentada III

Damos un paso más con la realidad aumentada, ahora con Blippar.
Tras hacer la práctica de Aurasma tenemos que hacer algo similar pero con Blippar. El favicon será la imagen en la que se verá el vídeo de todas las entradas que tenemos (vídeo que hemos hecho desde youtube y posteriormente descargado).

En mi caso tengo un problema ya que blippar no es capaz de detectar mi favicon, después de muchos intentos y cambios me doy por vencida, pero sigo con una alternativa. En lugar de usar el favicon usaré una imagen que tenga más trazos y por tanto sea más fácil de detectar.

El código es: 511089

Este es el resultado:

lunes, 8 de mayo de 2017

Realidad aumentada II

Profundizamos con la realidad aumentada gracias a Aurasma, como la semana anterior necesitamos la app y la página web.
En primer lugar tenemos que seleccionar una imagen, en nuestro caso elegiremos el favicon de nuestro blog. Con Aurasma escanearemos una imagen y saldrá por encima un vídeo, nosotros pondremos un resumen de todas las entradas del blog hasta hoy. 
Para hacer el vídeo usamos el editor de youtube.



Después de hacer el vídeo tenemos que descargarlo y subirlo en la página web Aurasma. 
El resultado es que al escanear la imagen del favicon  en al app de Aurasma el vídeo se reproducirá automáticamente en nuestro móvil. 




domingo, 7 de mayo de 2017

Realidad aumentada

Para esta semana hemos trabajado con la página web Layar y con su app, teniendo el primer contacto con la realidad aumentada.

En primer lugar nos registramos en la página web, después elegimos una foto y la editamos, añadiendo objetos que posteriormente saldrán al leer la imagen de partida con la cámara del móvil.
Para que esto suceda nos tenemos que meter en la app y escanear la imagen desde esta.



Los objetos añadidos saldrán encima de la imagen de la que partimos como se ve a continuación.


miércoles, 12 de abril de 2017

Mobincube

Buenas, esta semana hemos creado una app sobre nuestro bar favorito, gracias a la página web Mobincube. En primer lugar y como ya viene siendo habitual nos hemos creado una cuenta, luego hemos empezado a crear nuestra app, añadiendo imágenes, textos y demás cosas. Todo esto partiendo de una plantilla que hemos editado, al terminar lo único que tenemos que hacer es solicitar una URL y un código QR.


Tras la espera tenemos el código QR y la URL.
Aquí os dejo una imagen de mi app y si queréis descargarla solo tenéis que darle a la izquierda en sitios de interés o leer el código QR puesto a continuación.






martes, 4 de abril de 2017

MockUp

Esta semana hemos hecho el calendario de la semana cultural con Pidoco una aplicación para hacer MockUp



Aquí tenéis el resultado de nuestro MockUp.


Pincha aquí para ir a la web del calendario.

lunes, 27 de marzo de 2017

Bootstrap

Hemos modificado la página Bootstrap, añadiendo una foto propia.

En primer lugar hemos entrado en la página web Bootstrap y hemos descargado todas las plantillas y letras en la página de inicio, posteriormente y tras elegir un diseño hemos descargado el html de ese diseño en particular (botón derecho y guardar)

Después de esto hemos buscado en el código de la página web el nombre de una de las imágenes que aparecen en gris, pulsando el botón derecho y seleccionando "inspeccionar archivo" llegamos al código, copiamos el código de la imagen ya mencionada y en el archivo html descargado buscamos el esta imagen para sustituirla por una imagen de nuestro ordenar.



De esta manera se ve solo desde tu ordenador y tiene que ser visible para todos. Por eso hay que subir el archivo html junto a las carpetas descargadas a hostinger.

El resultado lo puedes ver pulsando aquí

Y también en la parte derecha de la pantalla en sitios de interés.




jueves, 23 de marzo de 2017

Canción y vídeo

Hoy vamos a añadir un vídeo editado por nosotros desde el editor de vídeo de youtube. En primer lugar abrimos un canal de youtube con la cuenta de gmail. Nos metemos en crear vídeo y añadimos imágenes, vídeos y música aceptadas por la política de derechos de autor de youtube.
Para ver los resultados solo tienes que bajar hasta el final del blog.



La segunda parte de la práctica de esta semana es crear tu propia banda sonora con el programa online soundation. Hay que registrarse pero de manera muy sencilla, con google o facebook.
Simplemente hemos creado un hilo musical con los sonidos que tiene la web.


Para comprobar los resultados solo tenéis buscar en la parte derecha del blog la sección de nuestra melodía.


jueves, 16 de marzo de 2017

Javascript II

Esta semana lo hemos tenido un poco complicado para hacer la práctica.

En primer lugar hemos escrito un archivo javascript.js, el código hay que pasarlo a mano y cada línea cumple una función diferente en la página.


Además dentro del código index.html hay que hacer ciertas modificaciones. 

De la línea 7 a la 20 el código hace que en la parte de arriba de la página aparezca una palabra, en nuestro caso "Pincha" que parpadea, en rojo y si es pulsada te manda a nuestro querido blog.
La línea 22 muestra la función 2, que está definida en el javascrip.js, esta función lo que hace es mostrar un texto en un cuadro que si se selecciona abre una ventana que permite que pongas tu nombre y abajo pondrá a partir de ahora lo que tu hayas escrito. 






Hemos añadido botones nuevos a la página, dos de los ellos (funciones demo) que hemos añadido cambian el título a otro tamaño o color. El tercer botón hace saltar una ventana que saluda a todos los camaradas. 
Lo último que hemos añadido es un mensaje que salta a los 5s. después de abrir la página, tiene de nombre función Bienvenidos. 

Para ver todos los cambios realizados solo tienes que pulsar aquí.

Hemos tenido problemas con Hostinger, normalmente van todos las funciones nuevas pero de vez en cuando hemos visto que fallan. 

miércoles, 8 de marzo de 2017

Window.alert

Hemos creado una ventana de alerta en nuestra página web, de manera muy sencilla.
En primer lugar nos metemos en nuestro dominio de Hostinger, en el archivo index.html y en la parte del <body> metemos en siguiente código:



El resultado es una ventana emergente que sale al pulsar la última tecla (una verdad innegable)


lunes, 6 de marzo de 2017

Javascript

Comenzamos esta semana haciendo un pequeño cambio de imagen a nuestra página web.
En primer lugar haremos otro archivo css con diferentes colores y tipografía. En nuestro caso este archivo se llamará Final2.css y lo subiremos a la parte pública de nuestro subdominio de Hostinger.

Seguidamente añadiremos al archivo index.html la siguiente línea de código, dentro de <head>:




Y también hay que añadir un scrip, también en el <head>:


Con esto podemos hacer que nuestra página cambie su aspecto, pero para ello tendremos que añadir también un botón dentro de la web para que se produzca el cambio y esté a gusto del usuario. El código para dicho botón es el siguiente y se coloca en el <body>:


Observa el resultado final en Información del Sputnik

lunes, 27 de febrero de 2017

Colores en HTML

Al hacer los cambios en la apariencia de nuestro sitio web debíamos poner los colores con lenguaje hexadecimal por ellos aquí van una serie de páginas que facilitan la selección de un color y su codificación.
 
Particularmente he usado HTML Color Codes  que tiene tanto una tabla de colores:

Como un selector del color:
Pero también encontramos otros sitios como Colores HTML que te ofrece tablas con diversos colores y tonalidades: 


Por poner un último ejemplo tenemos a Virtualnautas que también te ofrece una tabla, pero con menos colores:



Hojas de estilos CSS

Esta semana hemos creado un subdominio gratuito en la página Hostinger y en él una página web que en mi caso da un poquito de información acerca del Sputnik.
Después de registrarnos en Hostinger subimos dos archivos uno html en el que está la información que va a haber en la página web y otro archivo css que sirve para editar la apariencia. Sacamos del campus ambos códigos y procederemos a cambiar tanto el contenido como el aspecto.

HTML:
Este es el código original que copiamos en un bloc de notas.

Tras hacerle varios cambios lo guardamos como pruebapagina.html con codificación UTF-8 y el tipo de archivo "todos los archivos". Cambiamos el contenido escrito, además tenemos que poner un enlace que lleve de nuestro sitio web a nuestro blog: 


Cuando esté subido al subdominio tenemos que cambiar el nombre a index.html

CSS:
También tenemos que editar otro código pero este hay que guardarlo con .css y con las mismas características que el anterior.

En este caso cambiamos la apariencia de nuestra web, cambiando los colores y la tipografía. 

Para aprender un poco más sobre el Sputnik solo tenéis que pulsar a la derecha en la sección de sitios de interés "información del Sputnik" o pinchar en la palabra Sputnik del principio. 

miércoles, 22 de febrero de 2017

HTML

Hemos hecho unos cuantos cambios en nuestro blog con el HTML.

El objetivo es cambiar la tipografía del título y centrarlo. La nueva tipografía no está en blogger, esta pertenece a Google Fonts y es la tipografía Russo One.

El primer paso es coger el código fuente de la tipografía y ponerla en el código HTML del blog.





Para centrar el título utilizamos el siguiente código:



Todo puesto en el código HTML quedaría de la siguiente manera:


Después de guardar hay que ir a la Plantilla-Personalizar-Avanzado-Añadir CSS y se pega el código:


Fuentes:
Euroresidentes 

lunes, 13 de febrero de 2017

Video llamadas.

Hemos roto la barrera de la distancia, la comunicación entre dos personas que se encuentran a miles de kilómetros puede ser fluida con un solo click. No solo hablamos de las relaciones personales, en el ámbito laboral el uso de estas tecnologías es muy frecuente siendo indispensable para algunas empresas hacer una entrevista por vídeo llamada antes de una entrevista en persona. Cada vez es más habitual ver conferencias en directo con este tipo de tecnología, en las que puedes preguntarle al ponente las dudas que tienes en directo y desde tu casa.

Las aplicaciones más usadas son: 
El ya famoso Skype que permite hacer tanto llamadas individuales como grupales, para las grupales a partir de 10 personas uno de los usuarios debe tener cuenta premium. Skype es el líder actual en vídeo llamadas por internet.


Un gran competidor es Hangouts que pertenece a la familia de Google y permite hacer videoconferencias con muchos usuarios de manera gratuita.
Incluso el ex presidente Obama usaba este programa para hacer conferencias.



Fuze Meeting es otro programa de "telepresencia" que permite transmitir vídeos y contenidos con alta resolución, además de grabar conferencias. Sin embargo es de pago.


Como estos tres ejemplos tenemos muchos más, incluso han añadido la opción de vídeo llamada WhatsApp, Line o Facebook

Este tipo de programas nos acercan más al resto de personas y nos facilitan la comunicación.

Fuentes: 
http://wwwhatsnew.com/2012/02/27/10-interesantes-aplicaciones-para-videoconferencias-y-reuniones-online/
http://cincodias.com/cincodias/2015/02/27/emprendedores/1425041927_558193.html