TecnoInFe: Tecnología, Informática y Educación

martes, 31 de octubre de 2017

Sesión 4 del Curso de programación de aplicaciones móviles

Hoy vamos a realizar esta aplicación:




Recordad que una cosa es el nombre del objeto que hemos creado (etiqueta, botón, etc.) y otra cosa es el texto que aparece dentro de dicho botón, etiqueta, etc. y que es lo que luego se verá en nuestra aplicación y que se modifica desde el menú Propiedades (parte derecha) y en el apartado Texto.
El nombre en sí se modificaría en Cambiar nombre.

Los materiales necesarios para realizar la aplicación podéis descargároslos de aquí:



Para los más adelantados, os propongo la inclusión de una pantalla de inicio propia con vuestro logo o una imagen que os guste. En posts anteriores teníais explicado como se hace.

Si aún con eso os sobra tiempo, os propongo la siguiente tarea:



Sabríais hacerlo si explicación alguna???? se trata de un Xilófono, donde cada botón equivale a una nota musical. Las notas en cuestión las podéis descargar del siguiente enlace:

viernes, 27 de octubre de 2017

Muy buena acogida en el Taller de Búsqueda de Empleo

Mucha suerte a todos los asistentes.... y que haya suerte con la bolsa de correos o en general con cualquier trabajo que hayáis solicitado...


Taller: Encuentra empleo a través de Internet

La búsqueda de empleo es un trabajo en sí.... y hoy en día, internet es fundamental para encontrarlo, puesto que la mayoría de las ofertas que se publican ya sólo se hacen a través de internet.

Para ello, debemos de estar dados de alta en todos los portales, webs y redes sociales de búsqueda de empleo (porque nunca se sabe donde estará la oferta de la que te llamen).


Los puntos que vamos a ver en este taller son:

  • Redacción y edición de nuestro CV en Word/LibreOffice y posterior conversión a PDF.
Es importante que sepas redactar tu CV y modificarlo posteriormente para incluir nuevos trabajos o nuevos cursos. Como ya sabrás, el CV no es un documento único, sino que deberás adaptarlo según el puesto de trabajo que solicites.



  • Alta en los principales portales de empleo. Para evitar que nos falte tiempo y debido a la corta duración del taller, nos daremos de alta o aprenderemos a configurar correctamente, la web del Servicio Andaluz de Empleo y la web de la Comunidad LinkedIn.

  • Veremos el uso de las redes sociales como búsqueda de empleo, sobre todo Facebook. Como siempre digo, facebook no solo sirve para cotillear a tus amigos, sino que te puedes crear un perfil y en vez de dedicarte a subir fotos o escribir cosas personales, dedicarlo para entrar en páginas de búsqueda de empleo o en grupos de búsqueda de empleo de tu área geográfica (en nuestro caso Granada).

  • Para terminar, vamos a crearnos un blog (con Blogger porque entiendo que es más fácil de configurar si nunca has tenido uno) y vamos a poner en él nuestro CV y vamos a ponerlo en nuestro den nuestros datos personales cuando rellenemos un CV. Evidentemente por el tiempo de que disponemos, será un blog mínimamente configurado, pero profesional, para que las empresas que lo consulten puedan ver nuestras destrezas informáticas.


Para ver el blog del ejemplo en cuestión, pincha sobre la siguiente dirección:


Por último ya del todo, y casi que fijo que no haría falta mencionarlo, pero sabed que las mismas webs donde nos damos de alta por internet (y de las que se os ha facilitado una lista de ellas), tienen su aplicación móvil, por lo tanto si no dispones de ordenador, será tan fácil como instalarte dicha aplicación en tu móvil. Aquí tienes algunas de las que te puede encontrar:


Por último también, comentaros que otra forma de acceder a un puesto de trabajo es entrar a formar parte de bolsas de trabajo de grandes compañías como por ejemplo Correos. Actualmente se encuentra abierta una bolsa de trabajo que podéis solicitar sin tener que hacer ningún tipo de examen en el siguiente enlace: IR

martes, 24 de octubre de 2017

Tercera Sesión Curso Programación Aplicaciones Móviles

Hoy vamos a crear una aplicación consistente en adivinar un número del 1 al 10:


La aplicación original es la que ves a tu izquierda, pero para loas alumnos más avanzados, os propongo que la compliquemos un poquito:

  • Vamos a crear una pantalla de inicio, donde se verá el logo de nuestra compañia, y en esa pantalla, deberá aparecer una barra de progreso y que ponga "Cargando..." justo debajo

(debajo de la imagen tendrás algunas explicaciones de como hacerlo)

En la ventana ya de la aplicación en sí:

  • Vamos a crear una etiqueta en donde se nos explique en qué consiste el juego.


  • Vamos a crear una etiqueta que nos muestre el número de intentos consumidos.
  • Vamos a crear otra etiqueta que nos muestre el tiempo que nos queda para adivinar el número.
  • Vamos a añadir dos botones más: Empezar y Pausar. Esto será así para tener un mayor control sobre el tiempo y sobre la cantidad de intentos consumidos.



Por defecto, si ya hemos creado el juego con una sola pantalla, y luego decidimos crear una pantalla introductoria, esta no se mostrará la primera..... y AppInventor no nos deja establecerla como pantalla de inicio, pero (siempre existe un pero en informática), podemos hacerlo de forma manual.
Para ello, tenemos que descargarnos la aplicación a nuestro ordenador, mediante Proyectos / Exportar a mi ordenador el proyecto (.aia) seleccionado
Una vez descargado, necesitaremos un programa que pueda leer ese archivo. Se trata de un programa compresor, os recomiendo 7Zip. El problema es que como sabéis en el aula no se puede instalar nada, y ahora mismo desconozco si hay algún programa similar instalado por defecto.
Tras instalar el programa (en casa) o comprobar que podemos hacerlo en clase, seleccionamos el archivo de nuestra App descargado, botón derecho y seleccionamos: Abrir comprimido. Nos saldrá algo parecido a esto


Nos vamos dentro de la carpeta src\appinventor\nombredeUsuario\nombreAplicacion y ahí, lo que hacemos es arrastar esos archivos a una carpeta en nuestro escritorio y cambiarles el nombre: es decir Screen1 la renombramos por ejemplo a ScreenX, Screen2 la renombramos a Screen1 y ScreenX la renombramos a Screen2. Una vez hecho esto, volvemos a arrastra los archivos al programa de compresión y los sobreescribimos. Con esto conseguimos que nuestra ventana de inicio creada con posterioridad pase de llamarse Screen2 a Screen1 y por tanto se inicie la primera.

Os pongo el código de la ventana de introducción, por tratarse de algo complicado utilizando el elemento Deslizador (que aunque hemos trabajado con él, eramos nosotros quienes lo movíamos). 


Para la ventana principal del juego, los cambios sugeridos deberíais medio saber hacerlo... Para el temporizador cuenta atrás, investigar por internet. Si no dais con la solución, preguntarme como sería.


Aquí tenéis un vídeo donde explica el tema del temporizador hacia atrás:










jueves, 19 de octubre de 2017

Continuamos con la segunda sesión del curso de programación

Un par de puntualizaciones.... Ya sabéis que en los ordenadores del aula no se puede instalar programas, y por lo tanto no podemos activar el emulador, pero os pongo un vídeo donde explica como instalar el programa necesario para que nos funcion:


Por otra parte, vamos a completar un poco la app que creamos el día anterior:


Ahora Mismo con lo que sabemos, para insertar una pantalla de inicio, deberíamos crearla la primera y luego donde aparece Kitty, crearla la segunda.... Como se supone que ya sabes crear la pantalla de Kitty, y eso no debería llevarte más de un par de minutos.... vamos a crear Screen1 (por defecto) para nuestra pantalla de acceso y Screen2 para nuestra Kitty.

Pistas para la primera pantalla:

Bueno, más bien te he dado todo el código, pero como estamos empezando, me interesa más que sepas identificar cada uno de los elementos que intervienen.

Y el botón de Parar Música???? Sabrás hacerlo sin problemas, ¿verdad?

miércoles, 11 de octubre de 2017

Último día del curso de Creación de blogs

Hoy finalizamos nuestro curso de creación de blogs. Espero que os hayáis animado a trabajar en ellos y que con todo lo aprendido en el curso, le déis una aplicación útil y lea vuestras entradas asiduamente....



Como es normal al finalizar el curso se os pide que realicéis un cuestionario de satisfacción para medir vuestra satisfacción:





Nos vemos en el próximos cursos...

Insertar botones de redes sociales en Blogger

Como os comentaba en clase, Blogger tiene sus cosas buenas y malas con respecto a WordPress... en este caso, algo malo es que no tiene un gadget o widget para las redes sociales, pero con unas pocas nociones de html podemos insertarlo sin problemas:

facebook Siguenos en Google + Siguenos en Blogger Siguenos en Blogger Siguenos en WordPress Youtube Siguenos en Pinterest

Evidentemente tendrás que cambiar donde pone https://www.blogger.com/DIRECCION_PAGINA_FACEBOOK por ejemplo por tu correspondiente dirección de tu página de facebook y así con el resto. La red social que no te interese, tan solo borras el código dentro de y listo.

sábado, 7 de octubre de 2017

Como crear una cabecera para Facebook

Si previamente has trabajado para tu cabecera de blogger/wordpress, podrás usar el mismo diseño para el resto de redes sociales, como por ejemplo facebook, pero con ciertos matices.

Si quieres que tu cabecera se vea exactamente como la creaste en facebook, deberás cumplir estas restricciones en cuanto al tamaño:



Ten cuidado y no confundas el Perfil de Facebook con la página de Facebook, porque son distintos (me he dado cuenta que más de un alumno en clase lo ha confundido y ha puesto la foto de portada en su perfil personal y se ha olvidado de hacerlo en la página, que es lo que verdaderamente queríamos hacer). Para ello una vez que has entrado dentro de facebook, has de pinchar en la flecha mirando hacia abajo de la parte superior derecha y seleccionar la página:






Una vez dentro de la página, es ahí donde podrás subir tu imagen de portada.

Si te fijas en la imagen de la izquierda, está claro cual es el aspecto del Perfil personal y de la Página de facebook. 

martes, 3 de octubre de 2017

Cómo crear una cabecera para nuestro Blog

El proceso de creación de una cabecera puede ser algo complejo, existiendo empresas especializadas que cobran por ello. Nosotros, como principiantes en el mundo Blogger, evidentemente no vamos a pagar un duro, y vamos a crear nuestra propia portada.

Vamos a distinguir dos formas de hacerla, directamente desde nuestro ordenador con un programa de diseño, como puede ser Gimp, que es gratuito y podemos descargarnos desde su web: 


Simplemente vamos a la sección "Descargar Gimp y seleccionamos la versión para nuestro sistema operativo, que me imagino que en la mayoría será Windows. En el caso de que estéis trabajado con Linux o en Centros Guadalinfo (como es nuestro caso), tenéis el programa previamente instalado, con lo que solo tenéis que abrirlo y empezar a trabajar.

Lo primero de todo y que personalmente resulta algo molesto, es el tema de la distribución de las ventanas sueltas por el escritorio, que puede liar un poco. 


Para solucionar este aspecto, nos vamos a Ventanas --> Modo de ventana única y así obtendremos un aspectos más normalizado, y al que estamos más acostumbrados.

Después de esto, como os comentaba en clase, para una primera aproximación, es buscar una imagen que nos guste como cabecera del blog que que tenga unas proporciones más anchas que altas, es decir: si hemos configurado nuestro blog para que tenga una anchura total de 1200 px, lo suyo sería configurar una imágen de 1200x250. Para ello, lo primero de todo es buscar una imagen que se adecue a nuestro blog y la descargamos a nuestro ordenador.

Como ejemplo vamos a suponer un blog de consejos para el hogar, en google buscamos imágenes con esa terminología y nos hemos descargado una imagen que inicialmente tiene unas proporciones de 800x533. Ahora vamos a adecuarla al tamaño que hemos comentado anteriormente:
  • Arrastramos la imagen dentro de Gimp para editarla
  • Nos vamos al menú Imagen --> Escalar Imagen, pulsamos sobre un simbolito de la cadena que hay entre las dos imágenes y que significa que el tamaño está proporcionado (lo desmarcamos para poder poner nuestro tamaño sin problemas)

  • Una vez hecho lo anterior, le damos a Escala, y ya nuestra imagen tendrá el tamaño deseado.
  • Ahora nos vamos a Archivo --> Exportar como... y ahí guardamos o exportamos nuestra imagen con la extensión .jpg que se supone que es la que te sugiere por defecto.


Hecho lo anterior se supone que es el proceso más básico para crear una cabecera, pero lo suyo es que nuestra cabecera, aparte de la imagen, contenga el nombre de nuestro blog. Para ello en el menú de la izquierda, buscamos un icono con una letra A, que es para insertar un cuadro de texto. Lo primero de todo es seleccionar el área donde vas a colocar tu texto, lo escribes y luego en el menú que te aparece a la izquierda, configuras el tipo de letra, tamaño, color y posición:

Como resumen:
Partimos de una imagen inicial a la que cambiamos el tamaño:


Obteniendo como resultado:

Para mejorarla un poco más, añadimos el nombre de nuestro blog y lo que se nos ocurra:


Como puedes ver, el resultado final la imagen elegida de fondo está un poco opaca, para que el texto se pueda leer mejor (que es lo que nos interesa). Para ello, y sin entrar en grandes explicaciones, verás que en la parte derecha existen como 3 items con un ojo (capas) los cuales corresponden a los tres elementos añadidos en nuestra cabecera (2 textos y una imagen de fondo), seleccionamos el correspondiente a la imagen, y un poco más arriba, vemos que hay una especie de menú que pone Opacidad. Simplemente, reducimos el valor a uno que consideres adecuado.



Si lo anterior te ha resultado muy complicado, siempre puedes utilizar programas más sencillos vía web como es el caso de Canva:







lunes, 2 de octubre de 2017

Recomendación de libro

Los que estáis empezando en el mundo de la creación de blogs, os recomiendo que si tenéis tiempo y ganas, que almenos visitéis la web donde se habla del libro: "Los nativos digitales no existen".

Se trata de una obra escrita por 16 autores expertos en el uso de las redes sociales y las nuevas tecnologías, que nos habla sobre el falso mito del uso de la terminología "nativos digitales".

El contenido es muy pedadógico y entretenido, pero a lo que iba es a ver un poco como estos expertos en creación digital, estructuran sus propios blogs.


Os animo a que entréis en la web: http://nativosdigitales.com/ y en la parte inferior de esta, veremos un poco el recorrido laboral o tecnológico de dichos autores, y podemos acceder a las direcciones de sus blogs para ver como los tienen estructurados ellos y así hacernos una idéa de como poder estructurar el nuestro.

Si os dais cuenta, aunque la gran parte de ellas se trata de blogs o webs personales, utilizan el .com en la mayoría, algunas el .es o el .eu aunque como ya os comenté en clase, el .com hace referencia a que se trata de una web de tipo comercial, pero digamos que es el estándar que hoy en día predomina, sin tener en cuenta el uso que se le de.