Crea tus propios Códigos QR

En la anterior entrada: «Códigos QR« veíamos que eran y cómo se usaban los códigos QR.

En ésta vamos a ver distintas formas de generarlos.

Como siempre, existen distintos tipos de aplicaciones de pago y gratuitas para hacerlo. Vamos a ver algunas de las gratuitas.

Existen distintos tipos de aplicaciones Web que nos facilitarán la creación de nuestros códigos QR. Por ejemplo, en http://www.codigos-qr.com/generador-de-codigos-qr/ podremos elegir el tipo de contenido que contendrá nuestro código QR, desde una dirección URL, pasando por un SMS, Texto, Número de teléfono o VCard.

Ésta última opción es una idea excelente por ejemplo para añadir a nuestros curriculums o correos.

Simplemente deberemos añadir la información que queremos que contenga nuestro código QR, seleccionar el tamaño (Muy Pequeño, pequeño, mediano, grande o muy grande) y hacer click en el botón «Generar Código QR» a lo que se generará la imagen en cuestión que ya podremos guardar o importar al sitio que queramos.

Éxisten otras páginas o aplicaciones web para realazar los códigos QR.
Por ejemplo otras de éstas páginas son:
http://qrcode.kaywa.com/
http://zxing.appspot.com/generator/
http://delivr.com/qr-code-generator
http://www.snapmaze.com/

En la que podemos encontrar otras opciones, como la posibilidad de realizar un Código Qr con coordenadas o nuestra geolocalización.

Otra de las opciones para generar Códigos QR es el uso de un complemento para nuestro navegador (Firefox en éste caso), como es Mobile Barcoder complemento que añade un botón a nuestro navegador y que cada vez que nos situamos encima de éste nos realiza un Código QR de la dirección URL donde nos encontremos.

Enlaces y Posts relacionados:
http://cuandoeltiempoteatrapa.blogspot.com/2010/07/codigos-qr.html
http://qrcode.kaywa.com/
http://zxing.appspot.com/generator/
http://delivr.com/qr-code-generator
http://www.snapmaze.com/

 

Agrega un chat a cualquier sitio web fácil y rápidamente

Un amigo me comentó ayer sobre esta aplicación que hoy he tenido el gusto de probar.
Ésta aplicación, llamada «Nurph«, realiza justo lo que adelanta el título de la entrada:

Agrega un chat a cualquier sitio web fácil y rápidamente.

Gracias a Nurph podremos compartir cualquier sitio web que queramos añadiendole un chat en la zona inferior de la pantalla con el cual podremos chatear con todas la personas que hayan seguido nuestro enlace y se encuentren logueadas.

Una de las ventajas de este servicio (que para otros supone una desventaja) es que podremos usarlo gracias a nuestra cuenta de Twitter. Y digo que puede ser una desventaja ya que sólo usuarios de Twitter y logeados de Nurph (en fase beta y con registros cerrados) pueden usar éste servicio.

Aunque existen en la red multitud de programas que ya realizan ésta acción de agregar una sala de chat al sitio web que queramos (tanto herramientas gratuitas como de pago) Nurph me ha gustado porque es capaz de realizarlo de una manera muy sencilla y rápida, haciendo que cualquier usuario sea capaz de realizar ésta acción.

Podemos ver un vídeo de su funcionamiento:

Vamos a ver cómo usarlo:

1 – Deberemos disponer de un sitio web donde queramos añadir la sala de chat. Por ejemplo, un artículo que queramos compartir y hablar sobre él en ese momento con alguien, un vídeo, etc. Yo lo haré precisamente con un vídeo de explicación del funcionamiento de Nurph (en inglés): http://www.youtube.com/watch?v=V4noUIRRtm8

2 – Acudimos a la web de Nurph. Aquí disponemos de una sencilla página de inicio donde ingresaremos la URL del sitio donde queramos incluir la sala de chat; tal y como se ve en la imagen:

3 – Una vez ingresada la URL haremos clic en «Go» y se nos redirigirá al sitio web que le indicamos, pero con la sala de chat agregada.

4 – Una vez que estemos en ésta dirección nos fijaremos en que la URL ha cambiado. Ahora ya NO estamos en la URL que introdujimos (en mi caso era http://www.youtube.com/watch?v=V4noUIRRtm8) sino en una URL del tipo nur.ph. Por ejemplo, en éste caso concreto la URL es:

Ésta dirección es la que pasaremos a aquellos usuarios que queramos que entren en nuestra recien estrenada sala de chat.

5 –  El siguiente paso es loguearnos (Ésto comentabamos que puede ser una desventaja, ya que al estar en fase beta, ésta aplicación sólo permite el logueo desde una cuenta Twitter o con contraseña de la beta de la aplicación, algo que no tenemos claro). Yo lo probaré con mi cuenta de Twitter, haciendo click en:

6 – Después de conceder permisos para que ésta aplicación pueda usar Twitter (sólo la primera vez), ya estoy logueado en la sala de chat con mi cuenta de Twitter, ahora sólo queda esperar a que entren aquellos usuarios a los que he facilitado la URL.

7 – Una vez conectados los usuarios ya podremos chatear entre nosotros, aunque como veiamos en la imagen anterior, yo ya podía escribir aún estando sólo en la sala de chat.

Como veis es una herramienta muy fácil de usar y rápida, que podemos usar en cualquier sitio web y además podremos enlazar con Twitter y compartir («Share This») la creación de la sala mediante Twitter, e-mail o Facebook:

Otro ejemplo de creación de una sala de chat, ésta vez directamente sobre mi blog. Habré tardado cosa de 20 segundos en crear la sala e invitar a alguien:

Evidentemente, éste servicio tiene tambien sus desventajas. Las que yo creo mayores a día de hoy son la no posibilidad de loguearnos con otra cuenta que no sea Twitter, la no posibilidad de salas de chat privadas así como que los usuarios no logueados puedan ver el contenido del chat. Es decir, podemos estar manteniendo una conversación de dos personas pero la cual están viendo otras dos de las que no tenemos constancia.

Esperemos que ésta aplicación avance en su funcionalidad, al menos eso se espera de una aplicación en estado beta, y mejore en éstos y otros aspectos.

Podeis encontrar más información, trucos y cuestiones sobre Nurph junto a Twitter en: http://nur.ph/twitter_tips

Entradas y enlaces relacionados:
http://www.adictosalared.com/nurph-agrega-facil-y-rapidamente-un-chat-a-cualquier-sitio-web/
http://www.genbeta.com/web/nurph-acorta-urls-mientras-chateas-con-los-visitantes-de-la-web
http://xinijos.com/2010/05/02/nurph-comparte-cualquier-sitio-web-anadiendo-un-chat-y-twitteando/

Creación de una UserBar Personalizada

En éste post vamos a ver cómo crear una Userbar de manera sencilla y fácil y sin tener que usar ninguna aplicación que tengamos que instalar o bajar a nuestro ordenador.

¿Qué es una Userbar?
Según el término en wikipedia: Las Userbars son imágenes usadas frecuentemente en las firmas de los foros de discusión con las que los usuarios muestran sus gustos y aficiones.
Por ejemplo, ésta de la propia wikipedia:

Podemos encontrar páginas donde buscar éstas userbars y así no tener que crearlas.Por ejemplo http://www.userbars.be/ en la que podemos encontrar algunas de las que fácilmente yo usaría, como éstas:

Incluso existen userbars en formato gif mostrando movimiento dentro de ellas:

Y en la mayoría de los casos éstas imagenes además poseerán un enlace que nos podrá llevar al sitio que eligamos, por ejemplo:

Google en Español

Hay veces que no encontramos la userBar que necesitamos o simplemente no nos gusta y queremos realizar una por nosotros mismos. Pues bie, vamos a aprender a Crear una UserBar.

Vamos a usar un servicio que he encontrado ésta misma tarde y es la razón para crear éste post.
La página en cuestión se llama: «Designer User Bars» y antes de ver la aplicación en sí nos aconsejan ver éste vídeo sobre su uso:

Observamos la vista de ésta aplicación:

Bien, vamos a comenzar a usarlo, yo para éste ejemplo realizaré una userBar para ésta misma página:

1 -Vamos a «Selected Logo Layer Editor» y hacemos click en el botón «Import Image from Url«, éste:

Aparecerá una ventana como ésta:

2 – En el campo «Logo Image URL» introduciremos la URL de la imagen sobre la que nos basaremos para hacer nuestra UserBar. Yo usaré ésta (la imagen de fondo de mi blog)

3 – Hacemos click en el botón «Import/Refresh» y la imagen pasará al apartado «Selection«.

4 – Podemos distinguir en éste apartado lo que será nuestra UserBar, y podremos modificar el tamaño y proporciones de la imagen desplazando la esquina inferior derecha de la imagen (un punto azul). Una vez que lo tengamos donde queremos (yo lo he dejado como en la imagen anterior) haremos click en el botón de abajo del todo llamado «Commit Selection To Current Userbar Logo layer»

5 – Podemos ver entonces, que la imagen que preseleccionamos como Userbar ya se encuentra en el apartado «Selected Logo Layer Editor«.

6 – Si queremos añadir un texto a ésta Userbar iremos al apartado «Userbar Text» y en el campo Text introduciremos el texto en cuestión. Disponemos aquí de otras opciones, como la alineación del texto, color y sombra.

7 – En el apartado «Userbar Shine» podremos modificar o quitar el brillo que se le aplicará a la barra.

8 – En el apartado «Logo Layers» podremos ver las distintas capas aplicadas a la barra, modficar, crear y borra éstas. Tambien disponemos de un par de flechas con las que podremos mover la capa hacia izquierda y derecha, muy útil cuando el texto no se ve o cabe adecuadamente debido a la imagen.

9 – La sección «Scroller Layer» no la veremos en ésta parte. Os adelanto que es para realizar barras con movimiento, tal y como veiamos al principio de ésta entrada.

10 – El apartado «Gradient» sirve para colorear la barra en función de los colores que le indiquemos, sabiendo y manejando además los botones que podemos encontrar en «Selected Logo Layer Editor» y con los que podremos borrar el fondo y hacerlo transparente, dibujar y pintar de determinados colores.

11 – En el apartado «Userbar Preview» y tras dar al botón «Generate Preview» podemos ir viendo nuestra barra en función de los cambios aplicados.

12 – Existe tambien una opción «Premium Options» donde si somos Premium tendremos alguna que otra opción más.

Tras éstos pasos mi barra se ve así:

13 – Una vez tengamos la barra tal y como queramos, haremos click en «Done, Upload to Image Host«, se abrirá una ventana indicando que se va a subir nuestra imagen y a generar código para poder insertar ésta barra allá donde queramos. Tras subirse ésta imagen nos mostrará una ventana parecida a ésta:

Aquí nos indica tres tipos de código, la URL de la imagen, en mi caso ésta:

Y dos tipos de código: BBCode y HTML Code.Son dos tipos de lenguaje que aceptarán unos sitios u otros, dependiendo de dónde queramos subir dicha barra. Para Blogger por ejemplo, nos basta con el HTML. No cerramos ésta ventana todavía ya que aunque ésto pensaba añadirlo en otra entrada, vamos a ver cómo poder agregar ésta barra a nuestro blog de Blogger por ejemplo:
Acudimos a Personalizar Diseño y agregamos un widget/gadget haciendo click en «Añadir gadget«.

Buscamos y agregamos el que se llama «HTML/JavaScript» y en la ventana que surge, en el campo «Contenido» pegaremos el código HTML que se nos proporcionó para nuestra barra, tal y como vemos en la imagen:

Como veis en la imagen, he seleccionado un texto concreto. Este texto (que se trata de una dirección URL) la deberemos sustituir por la URL a la que queremos que nos lleve dicha barra. Además si os fijais en la otra URL que hay en éste código, se trata de la URL de la imagen de nuestra barra, que está alojada en ImageShack. Seleccionamos «Guardar» y listo.