Solicitud y uso de la API de código QR artístico

El código QR artístico es un producto tecnológico innovador que combina códigos QR con imágenes de fondo estéticamente agradables, creando obras que son tanto prácticas como atractivas. No solo poseen la funcionalidad de los códigos QR tradicionales, que pueden ser escaneados y reconocidos rápidamente por dispositivos inteligentes, sino que también incorporan elementos artísticos, mejorando la atracción visual y el reconocimiento de marca. Algunos de estos códigos QR artísticos son incluso generados por inteligencia artificial, aprovechando al máximo la tecnología moderna y mostrando una innovación y singularidad incomparables. Esto hace que el código QR artístico tenga una amplia aplicación en áreas como el marketing de marca y la promoción publicitaria. En términos simples, el código QR artístico es la combinación perfecta entre el escaneo de códigos QR y la estética artística; no solo proporciona la función de transmisión de información, sino que también mejora la experiencia visual del usuario, haciendo que cada escaneo esté lleno de disfrute artístico.

Resumen de obras

Veamos algunas obras de códigos QR:

¿Qué tal? Estos códigos QR son códigos QR artísticos, logran una combinación perfecta entre imagen y código QR, siendo más artísticos que los códigos QR comunes. Y lo más importante, ¡cada código QR se puede escanear!

¿Cómo se hace?

¿Quieres hacer un código QR así? ¿Cómo se puede crear un código QR artístico de este tipo? En realidad, desde el punto de vista técnico, es relativamente complejo. En esta era de la IA, la solución actual para los códigos QR artísticos se basa en Stable Diffusion; al ingresar un prompt, podemos generar la imagen correspondiente, combinando algunos contenidos del código QR para lograr este efecto. Así que el principal desafío aquí es: cómo hacer que el código QR sea atractivo y artístico, y que además pueda ser escaneado correctamente. Para ser sincero, esta tecnología es bastante difícil y requiere un ajuste de parámetros considerable para lograr un efecto aceptable. El 99% de las personas probablemente se rinden en el primer paso. Supongamos que, tras ajustes constantes, realmente logramos este efecto; ponerlo en funcionamiento también implica un gasto considerable. Si se desea rapidez, puede que se necesite una GPU de alto rendimiento, lo que podría costar fácilmente más de diez mil yuanes. Algunos amigos podrían decir: no quiero gastar tanto esfuerzo, tampoco quiero gastar tanto dinero, solo quiero hacer un código QR artístico, o quiero integrar esta capacidad en mi producto; sería genial si hubiera una API lista para usar. ¿La hay? En realidad, sí. Esta plataforma ofrece una API relacionada con la generación de códigos QR artísticos. Podemos llamar a la API e ingresar varios parámetros, como contenido de imagen, enlace del código QR, estilo, etc., y así generar fácilmente el código QR artístico deseado. Además, la primera solicitud incluye 20 veces de generación de forma gratuita.

Solicitar API

Para usar la API de código QR artístico, primero puedes ir a la página de API de código QR artístico y hacer clic en el botón “Obtener”:

Si aún no has iniciado sesión, serás redirigido automáticamente a la página de inicio de sesión; escanea el código para seguir la cuenta oficial y podrás iniciar sesión automáticamente, sin necesidad de pasos de registro adicionales. Una vez que hayas iniciado sesión, volverás a la página original, donde se te indicará “No has solicitado este servicio, necesitas solicitarlo”. Al solicitar, se verificará la situación de la autenticación real; sigue las instrucciones del sitio para completar la autenticación real. La autenticación real verificará el nombre, número de teléfono y número de identificación; una vez completada, puedes volver a la página, actualizarla para asegurarte de que la información se haya actualizado y luego volver a solicitar.

Uso básico

Para utilizar la función más básica del código QR artístico, necesitas ingresar los siguientes parámetros obligatorios:

type: tipo de código QR, como texto plano, enlace, etc.
content: contenido del código QR, por ejemplo, si es un enlace, podemos ingresar el enlace correspondiente.
prompt: instrucciones de estilo para el código QR, se recomienda encarecidamente usar inglés. Por ejemplo, pizza generará un código QR que se asemeja a una pizza.
callback_url: opcional, dirección de callback asíncrona, si se proporciona, devolverá inmediatamente el ID de la tarea.
content_image_url: opcional, enlace de la imagen que contiene el contenido real del código QR.
aspect_ratio: opcional, relación de aspecto del lienzo, por defecto 1:1.
ecl: nivel de corrección de errores, por defecto H.
qrw: peso del código QR, 1.5-3, cuanto mayor, más se asemeja al código QR real.
seed: semilla aleatoria fija, para generar un código QR reproducible.
steps: número de iteraciones de dibujo, 10-20, por defecto 16.
preset: estilo de fondo preestablecido.
pattern: estilo principal, por defecto custom.
position: posición del código QR, por defecto center.
marker_shape: forma del punto de localización, por defecto square.
sub_marker: forma del punto de localización auxiliar, por defecto square.
pixel_style: estilo de píxeles, por ejemplo, square, rounded, dot.
padding_level/padding_noise: intensidad de espacio en blanco y ruido.
rotate: ángulo de rotación, por defecto 0.
rawurl: si se debe conservar el enlace original, por defecto false, si se activa, no se hace un enlace corto.

A continuación, generaremos un código QR para el sitio web de Zhishuyun, el tipo es enlace, el contenido es https://data.zhishuyun.com, el prompt se llenará con el siguiente contenido:

(best quality, masterpiece:1.2), underwater, ((pirate ship)), close up, zoom in, absurdes, big waves, twister, water falling, tentacles, ((glowing lights)), ((lighting storm)), fog, smoke, 4k res, 8k, higly detailed textures, cinematic shot, intricate details, side view

En la página de prueba, ingresa el siguiente contenido:

Luego haz clic en probar:

Después de un momento, verás que se ha generado el código QR artístico, el resultado es similar al siguiente:

{
  "task_id": "a7e8831c-203d-447e-83fc-71783c766446",
  "image_url": "https://qrart.cdn.zhishuyun.com/attachments/1132182283529494652/1136344944630563006/Germey_2023-08-02__64ca8da51e5834b500e077bf.png",
  "image_width": 768,
  "image_height": 768
}

El código QR es el siguiente:

Así hemos generado un código QR, cuyo tema es un barco que ondea varias banderas, y estas banderas constituyen precisamente los puntos de localización del código QR. Al escanearlo con el móvil, se puede redirigir al sitio web de Zhishuyun. Al mismo tiempo, el contenido mencionado anteriormente se puede convertir fácilmente en una llamada a la API.

Guía de prompt

A través de la operación anterior, se puede ver que la clave del código QR artístico radica en la redacción del prompt, ¿qué consideraciones hay en la redacción del prompt? En realidad, estas son instrucciones de prompt generales de Stable Diffusion, el código QR artístico se genera basado en la tecnología de Stable Diffusion con algunos ajustes especiales, por lo que su prompt de entrada es exactamente el mismo que el de Stable Diffusion. Si aún no sabes qué es Stable Diffusion, puedes visitar su sitio web para informarte: https://stablediffusionweb.com/, también hay tutoriales y guías de prompt: https://stable-diffusion-art.com/prompt-guide/, además Stable Diffusion ha creado un generador de prompts que puede ayudarnos a generarlos: https://stablediffusionweb.com/prompt-generator, además hay algunos sitios de colecciones de ejemplos de prompts: https://publicprompts.art/ El contenido anterior es solo de referencia, si deseas más, puedes buscar información relacionada con Stable Diffusion para aprender.

Parámetros avanzados

Esta API también ofrece más parámetros avanzados para facilitar la personalización de más funciones, la descripción es la siguiente:

preset: estilo de fondo preestablecido. Estilo del fondo del código QR, como estilo surrealista, efecto de neón, estilo dibujado a mano, etc.
steps: número de iteraciones de dibujo. Cuanto mayor sea el número, más fuerte será el estilo artístico del código QR, el rango es de 10 a 20, el valor predeterminado es 16.
qrw: peso del código QR. Cuanto mayor sea el peso, más se acercará la imagen al código QR real, pero el estilo artístico se debilitará, el rango es de 1.5 a 3, el valor predeterminado es 1.5.
seed: semilla aleatoria. Se utiliza para generar códigos QR aleatorios, cuando la semilla es la misma, el estilo del código QR generado es el mismo, el rango es de 1 a 9007199254740991.
rawurl: si se debe mantener el enlace original. Por defecto, el enlace de entrada se acortará a un enlace corto, lo que puede aumentar la tasa de escaneo, este valor es false por defecto.
padding_level: margen interno del código QR. Tamaño del margen interno del código QR,
aspect_ratio: relación de aspecto del código QR.
position: posición del código QR.
pixel_style: estilo de píxeles del código QR.
marker_shape: forma del marco de localización del código QR.
sub_marker: estilo de la subetiqueta del código QR.
rotate: ángulo de rotación del código QR.
ecl: nivel de corrección de errores del código QR.
padding_noise: ruido en el margen interno del código QR.
pattern: combinación de códigos QR preestablecida. Combinaciones de estilos de códigos QR preestablecidos, como el estilo del marco de localización (cuadrado, redondo, etc.), estilo de los puntos (cuadrado, redondo, etc.).

A continuación, vamos a conocer en detalle algunos parámetros avanzados de la API del código QR artístico, seleccionando algunos para su presentación.

Preset preset

La API del código QR artístico ha establecido muchas plantillas preestablecidas, este parámetro se llama preset, los valores son los siguientes:

sunset（日落）: Fusiona los cálidos tonos y el suave efecto de luz del atardecer.
floral（花卉）: Estilo artístico que incorpora elementos de flores y plantas, enfatizando la belleza de la naturaleza.
snowflakes（雪花）: Un mundo de hielo y nieve, con una atmósfera fría de cristales de hielo y copos de nieve.
feathers（羽毛）: Presenta características de plumas y aves, creando una sensación de ligereza y suavidad.
raindrops（雨滴）: Inspirado en gotas de lluvia y perlas de agua, creando un efecto fresco y húmedo.
ultra-realism（超现实）: Detalles y texturas extremadamente realistas, creando un efecto que trasciende la realidad.
epic-realms（史诗领域）: Escenas majestuosas y un sentido épico, que brindan una experiencia visual grandiosa.
intricate-studio（错综复杂）: Estilo rico en detalles y complejidad, que requiere una observación cuidadosa para ser completamente entendido.
symmetric-masterpiece（对称杰作）: Crea un equilibrio y armonía exquisita a través de elementos simétricos.
luminous-highway（发光高速公路）: Enfatiza el efecto luminoso nocturno, como las luces de los coches y los neones.
celestial-journey（星际之旅）: Explora un viaje fantástico a través del universo y las estrellas.
neon-mech（霓虹机械）: Combina elementos de neón y mecánicos, creando una sensación futurista.
ethereal-low-poly（飘渺低多边形）: Estilo de bajo poligonaje, creando un efecto etéreo y abstracto.
golden-vista（金色景观）: Dominado por tonos dorados, presenta una espectacular escena visual.
cinematic-expanse（电影式广袤）: Escenas amplias con un sentido cinematográfico, cautivadoras.
cinematic-warm（电影式温暖）: Tonos cálidos y efectos de luz con una textura cinematográfica.
desolate-wilderness（荒凉荒野）: Representa la desolación y la naturaleza salvaje, creando una sensación de soledad.
vibrant-palette（鲜明调色板）: Colores ricos y variados, con un fuerte contraste de colores.
enigmatic-journey（神秘之旅）: Explora un viaje lleno de misterio y enigma.
timeless-cinematic（永恒电影）: Estilo con textura cinematográfica que no está limitado por el tiempo.
regal-galaxy（皇家星系）: Galaxias y elementos cósmicos con un aire real.
illustrious-canvas（杰出画布）: Crea un efecto de lienzo sobresaliente y llamativo.
expressive-mural（富有表现力的壁画）: Estilo de mural grande lleno de expresividad y emoción.
serene-haze（宁静薄雾）: Con un efecto de tranquilidad y neblina, creando una atmósfera serena.

Vamos a intentar diferentes efectos de parámetros, por ejemplo, tomemos sunset（日落） y raindrops（雨滴） como ejemplos para ver el efecto.

curl -X POST "https://api.zhishuyun.com/qrart/generate?token={token}" \
  -H "accept: application/json" \
  -H "content-type: application/json" \
  -d '{
    "type": "link",
    "content": "https://data.zhishuyun.com",
    "prompt": "sakura",
    "preset": "sunset"
  }'

Aquí hemos configurado el preset a sunset（日落效果），el efecto es el siguiente:

Si cambiamos el estilo, por ejemplo, cambiando el parámetro preset a raindrops（雨滴效果）， el efecto es el siguiente:

Sobre otras configuraciones, pueden experimentar por su cuenta.

二维码宽高比 aspect_ratio

A través del parámetro aspect_ratio podemos establecer la relación de aspecto del código QR, como cuadrado 1:1, rectangular 16:9, etc. Este parámetro:

768x768: Relación de aspecto 1:1, lo que significa que el ancho y la altura del lienzo son iguales. El tamaño de píxel correspondiente es 768x768, el lienzo del código QR generado es cuadrado.
1008x576: Relación de aspecto 16:9, lo que significa que el ancho del lienzo es 16/9 veces la altura. El tamaño de píxel correspondiente es 1008x576, el lienzo del código QR generado tiene un ancho mayor, adecuado para pantallas anchas.
576x1008: Relación de aspecto 9:16, lo que significa que el ancho del lienzo es 9/16 veces la altura. El tamaño de píxel correspondiente es 576x1008, el lienzo del código QR generado tiene una altura mayor, adecuado para pantallas verticales.
864x672: Relación de aspecto 4:3, lo que significa que el ancho del lienzo es 4/3 veces la altura. El tamaño de píxel correspondiente es 864x672, el lienzo del código QR generado tiene una ligera sensación cuadrada, adecuado para visualización general.
672x864: Relación de aspecto 3:4, lo que significa que el ancho del lienzo es 3/4 veces la altura. El tamaño de píxel correspondiente es 672x864, el lienzo del código QR generado tiene una ligera sensación rectangular vertical, adecuado para visualización general.

curl -X POST "https://api.zhishuyun.com/qrart/generate?token={token}" \
  -H "accept: application/json" \
  -H "content-type: application/json" \
  -d '{
    "type": "link",
    "content": "https://data.zhishuyun.com",
    "prompt": "Fish",
    "aspect_ratio": "576x1008"
  }'

Aquí intentamos generar un código QR rectangular, el efecto es el siguiente:

二维码位置 position

También podemos controlar la posición del código QR a través del parámetro position, por ejemplo, si hay una imagen con una chica usando una falda y queremos colocar el código QR en la posición de la falda y fusionarlo, podemos intentar cambiar la posición del código QR, el ejemplo de llamada es el siguiente:

curl -X POST "https://api.zhishuyun.com/qrart/generate?token={token}" \
  -H "accept: application/json" \
  -H "content-type: application/json" \
  -d '{
    "type": "link",
    "content": "https://data.zhishuyun.com",
    "prompt": "una de las hermosas chicas a la luz de la luna en el fondo, en el estilo de caos pixelado, arte inspirado en rococó, blanco oscuro y azul cielo, hecho de plástico, flores delicadas, gongbi, wimmelbilder",
    "position": "bottom",
    "aspect_ratio": "576x1008"
  }'

El efecto es el siguiente:

Estilo de píxeles del código QR pixel_style

También podemos personalizar el estilo de píxeles del código QR, simplemente pasando pixel_style, los valores de los parámetros son los siguientes:

square (cuadrado): utiliza unidades de píxeles cuadradas, cada unidad de píxel tiene forma de cuadrado.
rounded (esquinas redondeadas): las unidades de píxel tienen esquinas redondeadas, lo que hace que el código QR generado se vea más suave y moderno.
dot (punto): utiliza pequeños puntos como unidades de píxel, el código QR generado presenta un efecto de trama, similar al efecto de impresión.
squircle (cuadrado redondeado): similar a un rectángulo con esquinas redondeadas, pero más cercano a la forma circular, otorgando un estilo único al código QR generado.
row (disposición en fila): organiza las unidades de píxel en filas, presentando un patrón en dirección horizontal.
column (disposición en columna): organiza las unidades de píxel en columnas, presentando un patrón en dirección vertical.

La vista previa del estilo es la siguiente:

Estilo del marco del código QR marker_shape

A través de marker_shape se puede personalizar el estilo del marco de localización, los valores de los parámetros son los siguientes:

square (cuadrado): la forma de la marca es cuadrada, utilizada para resaltar una ubicación o elemento específico.
circle (círculo): la forma de la marca es circular, puede ser utilizada para marcar áreas o elementos clave.
plus (más): la forma de la marca es un signo más, similar a una cruz, utilizada para resaltar atención o información específica.
box (cuadro): la forma de la marca es un cuadro, similar a un rectángulo con borde, puede ser utilizada para rodear áreas o elementos.
octagon (octágono): la forma de la marca es un octágono, con esquinas únicas, utilizada para atraer visualmente.
random (aleatorio): la forma de la marca se distribuye aleatoriamente, añadiendo un sentido artístico y visual al código QR.
tiny-plus (más pequeño): una pequeña marca de más, puede ser utilizada para marcar elementos o detalles sutiles.

La vista previa del estilo es la siguiente:

Estilo de sub-marcador del código QR sub_marker

A través de sub_marker se puede utilizar la forma de los sub-marcadores (marcas más pequeñas), los valores de los parámetros son los siguientes:

square (cuadrado): la forma del sub-marcador es cuadrada, puede ser utilizada para resaltar detalles en una ubicación específica.
circle (círculo): la forma del sub-marcador es circular, puede ser utilizada para enfatizar detalles o elementos clave.
box (cuadro): la forma del sub-marcador es un cuadro, similar a un rectángulo con borde, adecuado para marcar áreas pequeñas.
random (aleatorio): la forma del sub-marcador se distribuye aleatoriamente, añadiendo un sentido artístico y visual al código QR.
plus (más): la forma del sub-marcador es un signo más, similar a una cruz, puede ser utilizada para marcar información o elementos sutiles.

Ángulo de rotación del código QR rotate

A través de rotate se puede controlar el ángulo de rotación del código QR, los valores de los parámetros son los siguientes:

0: no se realiza rotación, el código QR generado mantiene la dirección original, sin efecto de rotación.
90: el código QR generado se rota 90 grados en el sentido de las agujas del reloj, mostrándose en dirección vertical.
180: el código QR se rota 180 grados, mostrándose invertido, es decir, de arriba hacia abajo.
270: el código QR se rota 270 grados en el sentido de las agujas del reloj, mostrándose en dirección inversa vertical.

Patrón preestablecido del código QR pattern

A través de pattern se pueden habilitar fácilmente algunos estilos de código QR, como marcos de localización cuadrados, puntos de píxel circulares, etc., aquí se han predefinido algunos patrones:

patrón	significado
s1	estilo_pixel: cuadrado forma_marcador: cuadrado
s2	estilo_pixel: cuadrado forma_marcador: cuadrado rotar: 180
s3	estilo_pixel: cuadrado forma_marcador: cuadrado rotar: 180padding_personalizado_ruido: 0.25
rd1	estilo_pixel: redondeado forma_marcador: aleatorio
rd2	estilo_pixel: redondeado forma_marcador: aleatorio rotar: 180
rd3	estilo_pixel: redondeado forma_marcador: aleatorio rotar: 180padding_personalizado_ruido: 0.25
d1	estilo_pixel: punto forma_marcador: círculo
d2	estilo_pixel: punto forma_marcador: círculo rotar: 180
d3	estilo_pixel: punto forma_marcador: círculo rotar: 180padding_personalizado_ruido: 0.25
r1	estilo_pixel: fila forma_marcador: más
r2	estilo_pixel: fila forma_marcador: más rotar: 180
r3	estilo_pixel: fila forma_marcador: más rotar: 180padding_personalizado_ruido: 0.25
c1	estilo_pixel: columna forma_marcador: caja
c2	estilo_pixel: columna forma_marcador: caja rotar: 180
c3	estilo_pixel: columna forma_marcador: caja rotar: 180padding_personalizado_ruido: 0.25
sq1	estilo_pixel: squircle forma_marcador: aleatorio
sq2	estilo_pixel: squircle forma_marcador: aleatorio rotar: 180
sq3	estilo_pixel: squircle forma_marcador: aleatorio rotar: 180padding_personalizado_ruido: 0.25