miércoles, 17 de mayo de 2017

¿Quieres crear tu propio videojuego?

Este sueño típico que todos hemos tenido, lo podremos hacer realidad. Os enseñare un programa sencillo con el que podréis hacer vuestros primeros movimientos.

Os dejo una dirección de blog donde podréis encontrar distintos programas a elegir.

https://blog.uptodown.com/programas-crear-videojuegos/

Ahora vamos a hablar de Unity. Nuestro objetivo será crear un mini juego utilizando plataforma de desarrollo de motores gráficos.

Os dejo la explicación de mis compañeros:




Para terminar os dejo mi resultado:



lunes, 15 de mayo de 2017

En esta sesión conoceremos en primer lugar Aurasma y en segundo lugar Blippar.

  • Crearemos un vídeo con imágenes de mi blog
  • Usaremos Aurasma y Blippar para colocar el vídeo en nuestro favicon.
  • El objetivo será que este vídeo aparezca al enfocar nuestra cámara con la aplicación.
Partimos de nuestro Favicon:


Aurasma: es una App bastante complicada de describir sin ver cómo funciona directamente; Se trata de un sistema de realidad aumentada, que utiliza la cámara para identificar los objetos que tiene delante.


Una vez insertada Favicon, insertamos vídeo.


Blippar es la primera aplicación que reconoce imágenes y las vuelve interactivas en tu teléfono móvil. 


Una vez tengamos la imagen editada y vídeo, Blippar nos aportara un código con el que podremos escanear. Os dejo mi código.


jueves, 11 de mayo de 2017

¿Quieres tu propia App?

Os voy a mostrar un ejemplo de Mobincube, herramienta para crear apps móviles nativas para Android, iOS (Apple) y WindowsPhone sin saber programar.

Mobincube es sencillo de utilizar, al mismo tiempo que ofrece una gran nivel de personalización para que puedas crear la app que más se adapte a tus necesidades. Solo tienes que añadir pantallas a tu app, añadir elementos a las pantallas algunos elementos mas a nuestro gusto y tendremos nuestra app. 

Os voy a mostrar mi app sobre mi bar favorito:






Es un app muy sencilla de utilizar. Os dará al terminar el código QR para nuestra aplicación y una dirección. Os dejo la mía:



¿Qué es un Mock Up?

Un Mock Up son fotomontajes que permiten a los diseñadores gráficos y web mostrar al cliente cómo quedaran sus diseños.

Vamos a usar para crear nuestro propio  Mock Up, una herramienta con la cual crearemos la interfaz, Pidoco.

En nuestro caso vamos a crearlo para la Semana Cultural de nuestra universidad.

Una vez creado nos darán nuestro HTML con sus respectivos archivos:


Aquí tenéis mi Mock Up



viernes, 31 de marzo de 2017



Voy a explicaros como crear un vídeo con audio gracias a programas que usamos día a día.

¿Te suena Youtube?

Página muy conocida en la cual la gente crea y suben sus vídeos para compartir sus pensamientos, vivencias, etc, con nosotros. Empecemos:


  • Creamos nuestra cuenta Youtube, registrandonos con nuestra cuenta de Google.
  • Una vez creada, pulsamos en nuestro perfil y damos a Creator Studio > Crear un Canal.
  • Crear>Editor de Vídeo
  • Una vez creéis vuestro video con las herramientas facilitadas, simplemente dais a crear vídeo. 

Si queréis añadirlo a vuestro blog, podréis extraer el código html dándole a compartir y pinchando en Blogger:






Podéis echar un vistazo en el blog a mi vídeo y compartir y si os gusta darle like



Para acabar os invito a que creéis vuestra propia canción y la compartáis conmigo. Ahora usareis un nuevo programa, ¡suerte! 

Bootstrap


Hoy hablaremos del bootstrap, ¿que es?

Bootstrap es un framework que nos permite crear interfaces web con CSS y JavaScript, cuya peculiaridad es la de adaptar la interfaz del sitio web al tamaño del dispositivo en el que se visualice.

Nuestra tarea será la siguiente:
  • De bootstrap al descargarnoslo, extraeremos una carpeta con nuestros códigos CSS, JV y las fuentes FONTS.
  • Una vez esto, solo necesitaremos nuestro código html, para ello nos vamos a examples y daremos a guardar a la plantilla que mas nos guste.

Una vez tenemos ya todo, nuestra tarea será editar ese html añadiendo fotos y así modificar nuestra plantilla. 

Por último os reto a que intentéis enlazarlo con nuestro hostinger ya creado en practicas anteriores. Para los que no tengáis hostinger podéis mirar en mi blog y poneros manos a la obra, saludos.


Blog de Javivi: Sesión Práctica II: Hostinger El hosting o al...: Sesión Práctica II: H ostinger El hosting o alojamiento web es el servicio que puede contratar todo usuario que quiera una web par...

viernes, 17 de marzo de 2017

Sesión Práctica IV:


Creamos fichero .js (Java Script)

Para nuestro Hostinguer, creábamos un fichero .html y unos estilos .css al que hacíamos referencia en el archivo HTML y cada estilo ejercía su función.


Bien, ahora crearemos un archivo .js donde definiremos todas las funciones que tendrá nuestra pagina web y haremos referencias de estas en nuestro HTML.

Ejemplo:


En el archivo HTML, al nombrar el documento javascript ,hará las funciones descritas en el .js, al igual pasa con los estilos que ya explique en entradas anteriores.



Nombramos el archivo .js, este se va al documento, lee las funciones y las devuelve al HTML, creando así las funciones de mi web.

http://javiviweb.esy.es/Prueba%20P%e1gina.html

miércoles, 8 de marzo de 2017

Día V:


Desconexión

Hoy trataremos un tema alternativo para desconectar. Hablaremos de los escáneres de mano 3D.



Estos productos están para satisfacer las necesidades de ingenieros y profesionales dedicados al desarrollo de productos y que se encuentran constantemente a la búsqueda de formas más eficaces y fiables de realizar mediciones en 3D de objetos físicos.

Son capaces de generar modelos tridimensionales de objetos reales para imprimir posteriormente en 3D a través de Softwares que tratan la información recibida.

Observaciones: 

- Posee una gran eficiencia
-Fácil manejo
-Producto bastante caro
-Amplio campo de posibilidades
-Útil, facilita el trabajo

Os dejo un breve vídeo en el que muestra su uso.


lunes, 6 de marzo de 2017

Sesión Práctica III:

Seguimos trabajando en nuestra Web Hostinguer.




Partimos de nuestra ultima edición en la cual creamos nuestra Web con nuestro estilo.





Procedemos a crear distintos estilos .html para que podamos ver la página de distintas formas y colores. Añadiremos "botones" para elegir el que se prefiera.


Para ello hemos hecho unos simples retoques en colores y posiciones. Para añadir dichos botones os facilito el código html:


<button type="button" onclick="cambio1()">Cambio a estilo2!</button>
<button type="button" onclick="cambio3('final3.css')">Cambio a estilo3!</button>
<button type="button" onclick="cambio4('final.css')">Cambio a estilo original!</button>

Por último añadiremos una alerta, dicha alerta la colocaré en uno de mis botones creados, en mi caso en el de vuelta al estilo original.

...
</script>
<script type="text/javascript" language="JavaScript">
function cambio4(archivo){
document.getElementById("estilo").href= archivo;
alert("Alerta, estás cambiando al original!");
.
.
.
.

<button type="button" onclick="cambio4('final.css')">Cambio a estilo original!</button>
...

Obtendremos como resultado:


Os dejo el enlace para que lo podáis ver físicamente: http://javiviweb.esy.es/PruebaP%e1gina.html

jueves, 2 de marzo de 2017

Día IV:



JavaScript

 Es un lenguaje de programación. JavaScript se ejecuta en nuestro ordenador, no en el servidor. Nos permite crear efectos atractivos y dinámicos en las páginas web.

El código HTML se encarga de que en la pantalla se muestre algo, por ejemplo una imagen, un menú, etc. El código JavaScript se puede encargar de crear efectos dinámicos en respuesta a acciones del usuario.

Para poder usar los dos a la vez basta con introducir el código JavaScript en el código HTML.



Ejemplos: 



  • Vamos a poner un contador de visitas falso, cada vez que reinicies esta página te dará un número de visitas diferente.
Como hemos dicho anteriormente basta con introducir el código JavaScript en el  HTML.

Código:

<script>
document.write(Usuarios Online: " + Math.floor((Math.random() * 99999) + 9000));
<script>

lunes, 27 de febrero de 2017


Sesión Práctica II:


Hostinger


El hosting o alojamiento web es el servicio que puede contratar todo usuario que quiera una web para alojarla en algún servidor.

Usaremos estos servicios hosting para promover y dar facilidad al acceso de nuestro blog. ( http://javiviweb.esy.es/ )


No pierdas el tiempo y crea tu Hostinguer aquí .

viernes, 24 de febrero de 2017

Día III:

Hojas de estilo--CSS


Hojas de Estilo en Cascada (Cascading Style Sheets), es un mecanismo simple que describe cómo se va a mostrar un documento en la pantalla, o cómo se va a imprimir, o incluso cómo va a ser pronunciada la información presente en ese documento a través de un dispositivo de lectura. Esta forma de descripción de estilos ofrece a los desarrolladores el control total sobre estilo y formato de sus documentos.


 ¿Para qué sirve?

CSS se utiliza para dar estilo a documentos HTML y XML, separando el contenido de la presentación. Los Estilos definen la forma de mostrar los elementos HTML y XML. CSS permite a los desarrolladores Web controlar el estilo y el formato de múltiples páginas Web al mismo tiempo. Cualquier cambio en el estilo marcado para un elemento en la CSS afectará a todas las páginas vinculadas a esa CSS en las que aparezca ese elemento.

¿Cómo funciona?
Os dejo un resumen a modo de vídeo por parte de Ricardo Andrés Becerra para acabar de entender las hojas de estilo- CSS.

Día II:


Lenguaje HTML

   El HTML es el lenguaje utilizado para representar documentos World Wide Web. Ademas de texto normal, incluye elementos  multimedia  (gráficos, vídeo, audio) y existen enlaces que permiten saltar a otras partes del documento o a otro sitio cualquier de Internet. 

    Este lenguaje a su vez es portable, es decir, se pueden visualizar las páginas con cualquier sistema operativo y, por supuesto también crearlas.

* No es necesario saber el uso del lenguaje HTML para elaborar paginas Web sencillas.


Además del navegador necesario para ver los resultados de nuestro trabajo, necesitamos otra herramienta capaz de crear la página en si, Un archivo HTML (una página) no es más que un texto plano al que le colocamos extensión "html". Es por ello que para programar en HTML necesitamos un editor de texto. (Editor de texto plano)


PROGRAMA: Notepad++

lunes, 20 de febrero de 2017


Sesión Práctica I:

Seguiremos unos puntos expuestos por la profesora.


  1. Personalizar fondo de blog ↴

Buscamos una imagen nueva que no nos la preste el mismo programa, y la subimos.



-----> Fondo-Subir imagen-Ajustar Imagen
Resultado


    
    2. Añadir favicon ↴




Editamos favicon- subimos imagen cuadrada menor a 100KB




    3. Blog que seguiremos ↴


         Seguimos principalmente a los compañeros, los cuales formaran parte de tu grupo. 


         En nuestro blog aparecerán los enlaces para que tus seguidores puedan visitarlos.



      4. Uso del html (modificar) ↴

  En  mi caso voy a modificar una entrada, en la cual una imagen añadida se salia de mi blog. Para ello voy a cambiar el ancho y ajustar así la imagen.



<a href="https://2.bp.blogspot.com/-4d0qkxuOLpo/WKdFj6-1VnI/AAAAAAAABh8/-BEcZ5cklcwQJ6Vabts1yL3Cb3QQ7bUTwCLcB/s1600/2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="314" src="https://2.bp.blogspot.com/-4d0qkxuOLpo/WKdFj6-1VnI/AAAAAAAABh8/-BEcZ5cklcwQJ6Vabts1yL3Cb3QQ7bUTwCLcB/s640/2.png" width="500" /></a>


Cambiamos width de 640 a 500 y conseguimos asi encuadrar nuestra imagen.


     6. Probar Html5maker

Subiré próximamente la explicación de este programa.


viernes, 17 de febrero de 2017


Inciso (Modificación de mi blog)

Objetivo: dotar de buena presentación a nuestro blog.




-Añadimos imagen de encabezado
-Dotamos de nombre a nuestro blog
-Ponemos imagen personal
-Añadimos gadgets

Por ultimo corregimos errores de alineación , color, tamaño...

Resultado final:




miércoles, 15 de febrero de 2017


Sistemas de Comunicación Multimedia


Día I:
Multimedia

      Término que procede de la lengua Inglesa, que se refiere a aquello que usa varios medios y de manera simultánea en la transmisión de una información. (Imágenes, sonidos, textos, etc.)

La comunicación multimedia facilita la compresión y el aprendizaje, ya que resulta muy parecido a la comunicación humana, cara a cara.