Archivo de la etiqueta: smartphones

Todo sobre los códigos QR y lo que necesitas saber para diseñar uno

Los códigos QR, su abreviación en inglés Quick Response code traducido sería código de respuesta rápida. Los QR son unos códigos de dos direcciones que contienen datos. La diferencia del código de barras que este solo consta de una dimensión. Gracias a ser bidimensional podemos incluir mayor cantidad de información en un menor espacio. A grandes rasgos se podría decir que es un cuadrado de dos tonalidades diferenciadas con cuadraditos pequeños que tienen formas aleatorias (que representan unos datos).

Su función mayoritaria actualmente es el marketing, los ponen en las campañas para que la gente los use y vaya a la página deseada sin tener que escribir la dirección. Aunque pueden contener solamente texto. Me atrevería a decir que el 99% de los lectores de estos códigos se trata de smartphones.

Ahora que todos ya usan los códigos QR aprovéchate de que la mayoría sólo pone la versión en blanco y negro, ponle tu logotipo dentro del código o hazlo original de otro modo. Esto se debe a que si el código es de alta calidad puedes ocupar hasta un 30% de su superficie. Este 30% es debido a que tiene un método de recuperación de datos que nos permite errores de tal magnitud. El porcentaje de error permitido depende de la calidad del código QR, así que os dejo una tabla con la calidad y el porcentaje de error tolerado.

Calidad Tolerancia (%)
Baja calidad ( L ) 7%
Calidad media ( M ) 15%
Calidad “Quality” ( Q ) 25%
Alta calidad ( H ) 30%

Sabiendo todo esto empecemos a “tunear” el código QR.

1-Usa distintos colores, texturas y opacidades

Los colores blanco y negro típicos son muy aburridos. Puedes añadir distintos colores siempre y cundo entre el fondo y el relieve tengan un 55% de contraste. Incluso puedes llegar invertir los colores del código. Usa tu imaginación, no tiene porque ser bi-cromático, puedes usar muchos colores, el límite es tu creatividad. O como ya he mencionado puedes usar opacidades distintas para marcar zonas, puedes llegar hasta una oscuridad del 30%. La decisión está en tus manos.

2- Redondea las formas

Los cuadrados son formas muy duras. Ahora está de moda las curvas, redondea los cuadraditos y los cantos. Los cantos redondos harán que parezca menos frío acercándote al usuario. Y tranquilos eso no afectará a la decodificación de los datos. Incluso puedes hacer que cada cuadradito sea una redondea, como una ficha de parchís (siempre adecuada al tamaño relativo del código).

3- Puedes poner un logo

Como ya he mencionado anteriormente puedes usar hasta un 30% del espacio para poner tu logo permitiendo aún que tu código QR siga siendo perfectamente procesable. Recomiendo mirar la tabla anterior para saber que porcentaje podemos ocupar.

Aprovechando la posibilidad de meter tu logo dentro el código QR puedes intentar crear un efecto de profundidad para impresionar al usuario.

Esta imagen podemos ver todo lo tratado anteriormente.

 

QR code example
QR-code

Hay un logo en el medio. Los cuadraditos tienen forma a murciélago usa distintos colores oscuros, y de fondo distintos colores claros. Realmente podemos observar que está muy trabajado haciendo que su efecto sea impresionante. Cada cual hace lo que puede dentro de sus posibilidades. No te sientas ahora intimidado por este código.

Para terminar, ten en cuenta que no todas las cámaras de todos los smartphones tienen la misma calidad, ni todos los SO y aplicaciones procesan los datos del mismo modo. Así que te recomiendo encarecidamente que ya que te vas a gastar dinero en una campaña de la popularización de estos códigos asegúrate que se ven bien en la mayoría de los dispositivos.

Bonus:

Puedes poner una imagen de fondo de logo ejemplo.

Algunos links para generar vuestro código QR online.