Wniosek i użycie API kodów QR artystycznych

Kody QR artystyczne to innowacyjny produkt technologiczny, który łączy kody QR z estetycznymi obrazami tła, tworząc dzieła zarówno praktyczne, jak i piękne. Posiadają one nie tylko funkcjonalność tradycyjnych kodów QR, które mogą być szybko skanowane i rozpoznawane przez inteligentne urządzenia, ale także wprowadzają elementy artystyczne, zwiększając atrakcyjność wizualną i rozpoznawalność marki. Niektóre z tych kodów QR są nawet generowane przez sztuczną inteligencję, w pełni wykorzystując nowoczesną technologię, prezentując niezrównaną innowacyjność i unikalność. To sprawia, że kody QR artystyczne mają szerokie zastosowanie w marketingu marki, promocji reklamowej i innych dziedzinach. Mówiąc prosto, kody QR artystyczne to doskonałe połączenie skanowania kodów QR z estetyką artystyczną, które nie tylko zapewniają funkcję przekazywania informacji, ale także poprawiają wizualne doświadczenie użytkownika, sprawiając, że każde skanowanie jest pełne artystycznej przyjemności.

Przegląd dzieł

Zobaczmy kilka dzieł kodów QR:

Jak widać? Te kody QR to kody QR artystyczne, które osiągnęły doskonałe połączenie obrazu i kodu QR, są bardziej artystyczne niż zwykłe kody QR. A co najważniejsze, każdy kod QR można zeskanować!

Jak to zrobić?

Chcesz stworzyć taki kod QR? Jak stworzyć taki artystyczny kod QR? W rzeczywistości jest to technicznie dość skomplikowane. W obecnej erze AI, obecne rozwiązanie dla kodów QR artystycznych opiera się na Stable Diffusion, dzięki czemu możemy generować odpowiednie obrazy, wprowadzając prompt, a następnie łącząc go z treścią kodu QR, aby ostatecznie osiągnąć taki efekt. Największym wyzwaniem jest więc: jak stworzyć kod QR, który jest zarówno estetyczny, jak i artystyczny, a jednocześnie może być poprawnie skanowany. Szczerze mówiąc, ta technologia jest dość trudna i wymaga wielu regulacji parametrów, aby uzyskać zadowalający efekt. Powinno 99% ludzi zrezygnować na pierwszym kroku. Zakładając, że po wielu regulacjach udało nam się osiągnąć taki efekt, uruchomienie go wiąże się z niemałymi kosztami, jeśli chcemy, aby działało szybko, może być potrzebna wydajna karta graficzna, co może kosztować kilka tysięcy złotych. Niektórzy mogą powiedzieć: nie chcę poświęcać tyle energii, nie chcę wydawać tyle pieniędzy, chcę tylko stworzyć artystyczny kod QR, lub chcę zintegrować tę funkcjonalność z moim produktem, byłoby dobrze, gdyby istniało gotowe API. Czy jest? Rzeczywiście jest. Nasza platforma oferuje API do generowania kodów QR artystycznych, możemy wywołać API, wprowadzając różne parametry, takie jak treść obrazu, link do kodu QR, styl i inne parametry, co pozwala na wygodne generowanie pożądanych kodów QR artystycznych, a pierwsze zgłoszenie daje 20 darmowych rysunków.

Wniosek o API

Aby używać API kodów QR artystycznych, najpierw przejdź do strony API kodów QR artystycznych i kliknij przycisk „Uzyskaj”:

Jeśli nie jesteś zalogowany, automatycznie zostaniesz przekierowany na stronę logowania, zeskanuj kod QR, aby automatycznie się zalogować, bez dodatkowych kroków rejestracji. Po zalogowaniu wrócisz na pierwotną stronę, gdzie pojawi się komunikat „Nie złożyłeś jeszcze wniosku o tę usługę, musisz złożyć wniosek”. Podczas składania wniosku zostanie zweryfikowana sytuacja związana z weryfikacją tożsamości, proszę postępować zgodnie z instrukcjami na stronie, aby zakończyć weryfikację tożsamości. Weryfikacja tożsamości sprawdzi imię, numer telefonu, numer dowodu osobistego, po zakończeniu weryfikacji możesz wrócić na stronę, odświeżyć ją, aby upewnić się, że informacje zostały zaktualizowane, a następnie ponownie złożyć wniosek.

Podstawowe użycie

Aby skorzystać z podstawowej funkcji kodów QR artystycznych, należy wypełnić następujące wymagane parametry:

type: typ kodu QR, np. czysty tekst, link itp.
content: treść kodu QR, na przykład jeśli jest to link, możemy wprowadzić odpowiedni link.
prompt: instrukcja stylu dla kodu QR, zdecydowanie zaleca się użycie angielskiego. Na przykład pizza wygeneruje kod QR w kształcie pizzy.
callback_url: opcjonalne, adres zwrotny asynchroniczny, po podaniu natychmiast zwróci identyfikator zadania.
content_image_url: opcjonalne, link do obrazu zawierającego rzeczywistą treść kodu QR.
aspect_ratio: opcjonalne, proporcje obrazu, domyślnie 1:1.
ecl: poziom korekcji błędów, domyślnie H.
qrw: waga kodu QR, 1.5-3, im większa, tym bliżej rzeczywistego kodu QR.
seed: stałe ziarno losowe, generujące powtarzalny kod QR.
steps: liczba iteracji rysowania, 10-20, domyślnie 16.
preset: wstępnie ustawiony styl tła.
pattern: styl główny, domyślnie custom.
position: pozycja kodu QR, domyślnie center.
marker_shape: kształt punktu lokalizacyjnego, domyślnie square.
sub_marker: kształt pomocniczego punktu lokalizacyjnego, domyślnie square.
pixel_style: styl pikseli, na przykład square, rounded, dot.
padding_level/padding_noise: intensywność marginesu i szumów.
rotate: kąt obrotu, domyślnie 0.
rawurl: czy zachować oryginalny link, domyślnie false, po włączeniu nie tworzy skróconego linku.

Następnie wygenerujemy kod QR dla oficjalnej strony internetowej Zhishuyun, typ to link, treść to https://data.zhishuyun.com, a prompt wypełniamy następującą treścią:

(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

Na stronie testowej wypełniamy następujące dane:

Następnie klikamy test:

Po chwili zobaczymy, że kod QR artystyczny został wygenerowany, a wynik wygląda podobnie jak poniżej:

{
  "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
}

Kod QR jest następujący:

W ten sposób wygenerowaliśmy kod QR, którego głównym motywem jest statek, powiewający kilkoma flagami, a te flagi stanowią punkty lokalizacyjne kodu QR. Skanując telefonem, można przejść do strony głównej Zhishuyun. Jednocześnie powyższa zawartość może być bardzo łatwo przekształcona w wywołanie API.

Przewodnik po promptach

Dzięki powyższym operacjom można zauważyć, że kluczowym elementem artystycznego kodu QR jest pisanie promptów, jakie są zasady pisania promptów? Właściwie są to ogólne instrukcje promptów Stable Diffusion, artystyczny kod QR jest oparty na technologii Stable Diffusion z dodatkowymi specjalnymi dostosowaniami, więc jego wejściowy prompt jest całkowicie taki sam jak w Stable Diffusion. Jeśli jeszcze nie wiesz, czym jest Stable Diffusion, możesz zapoznać się z jego stroną internetową: https://stablediffusionweb.com/, a także z poradnikami i przewodnikami po promptach: https://stable-diffusion-art.com/prompt-guide/. Dodatkowo Stable Diffusion stworzyło generator promptów, który może pomóc w generowaniu promptów: https://stablediffusionweb.com/prompt-generator, a także istnieją strony z przykładami promptów: https://publicprompts.art/ Powyższa zawartość ma charakter informacyjny, jeśli chcesz więcej, możesz samodzielnie poszukać materiałów związanych z Stable Diffusion, aby się uczyć.

Zaawansowane parametry

To API oferuje również więcej zaawansowanych parametrów, które ułatwiają dostosowanie funkcji, opisano je poniżej:

preset: wstępnie ustawiony styl tła. Styl tła kodu QR, taki jak styl surrealistyczny, efekt neonowy, styl ręcznie rysowany itp.
steps: liczba iteracji rysowania. Im większa liczba, tym silniejszy styl artystyczny kodu QR, zakres to 10-20, domyślnie 16.
qrw: waga kodu QR. Im większa waga, tym obraz jest bliższy prawdziwemu kodowi QR, ale styl artystyczny będzie osłabiony, zakres to 1.5-3, domyślnie 1.5.
seed: losowe ziarno. Używane do generowania losowego kodu QR, gdy ziarno jest takie samo, generowany styl kodu QR jest taki sam, zakres to 1-9007199254740991.
rawurl: czy zachować oryginalny link. Domyślnie wprowadzone linki są skracane do krótkich linków, co może zwiększyć wskaźnik skanowania, domyślna wartość to false.
padding_level: wewnętrzny margines kodu QR. Rozmiar wewnętrznego marginesu kodu QR,
aspect_ratio: proporcje szerokości i wysokości kodu QR.
position: pozycja kodu QR.
pixel_style: styl pikseli kodu QR.
marker_shape: kształt ramki lokalizacyjnej kodu QR.
sub_marker: styl podznaku kodu QR.
rotate: kąt obrotu kodu QR.
ecl: poziom korekcji błędów kodu QR.
padding_noise: szum wewnętrznego marginesu kodu QR.
pattern: wstępnie ustawione kombinacje kodów QR. Wstępnie ustawione kombinacje stylów kodów QR, takie jak styl ramki lokalizacyjnej (kwadratowy, okrągły itp.), styl punktów (kwadratowy, okrągły itp.).

W dalszej części szczegółowo omówimy niektóre zaawansowane parametry API artystycznego kodu QR, wybierając niektóre z nich do przedstawienia.

Wstępnie ustawione preset

API artystycznego kodu QR ustawiło wiele wstępnych szablonów, ten parametr nazywa się preset, a możliwe wartości są następujące:

zachód słońca（日落）: Łączy ciepłe odcienie i miękkie efekty światła zachodzącego słońca.
kwiatowy（花卉）: Styl artystyczny z elementami kwiatów i roślin, podkreślający piękno natury.
płatki śniegu（雪花）: Lodowy świat, z zimnym klimatem kryształów lodu i płatków śniegu.
pióra（羽毛）: Prezentuje cechy piór i ptaków, tworząc uczucie lekkości i miękkości.
krople deszczu（雨滴）: Inspirowane kroplami deszczu i kroplami wody, tworzy świeży, wilgotny efekt.
ultra-realistyczny（超现实）: Ekstremalnie realistyczne detale i tekstury, tworzące efekt przekraczający rzeczywistość.
epickie krainy（史诗领域）: Wspaniałe sceny i epicki klimat, oferujące ogromne wrażenia wizualne.
złożone studio（错综复杂）: Styl bogaty w detale i złożoność, wymagający uważnego obserwowania, aby w pełni zrozumieć.
symetryczne arcydzieło（对称杰作）: Tworzy piękną równowagę i harmonię za pomocą symetrycznych elementów.
świecąca autostrada（发光高速公路）: Podkreśla efekty świetlne w nocy, takie jak światła samochodów i neony.
niebiańska podróż（星际之旅）: Eksploracja kosmosu i międzygwiezdnej, fantastycznej podróży.
neonowy mech（霓虹机械）: Łączy elementy neonowe i mechaniczne, tworząc futurystyczny klimat.
eteryczny niski wielokąt（飘渺低多边形）: Styl niskiego wielokąta, tworzący iluzoryczny i abstrakcyjny efekt.
złoty widok（金色景观）: Dominujący złoty odcień, prezentujący spektakularny widok wizualny.
filmowy rozmach（电影式广袤）: Szerokie sceny z filmowym klimatem, przyciągające uwagę.
filmowa ciepłość（电影式温暖）: Ciepłe odcienie i efekty świetlne o filmowej jakości.
opustoszała dzicz（荒凉荒野）: Przedstawia pustkowie i dziką przyrodę, tworząc uczucie osamotnienia.
żywa paleta（鲜明调色板）: Bogate i różnorodne kolory, silne kontrasty kolorystyczne.
tajemnicza podróż（神秘之旅）: Eksploracja pełnej zagadek i tajemnic podróży.
ponadczasowy film（永恒电影）: Styl o filmowej jakości, nieograniczony przez czas.
królewska galaktyka（皇家星系）: Galaktyka i elementy kosmiczne z królewskim klimatem.
znakomite płótno（杰出画布）: Tworzy doskonały i przyciągający wzrok efekt płótna.
ekspresyjny mural（富有表现力的壁画）: Styl dużego muralu, pełen ekspresji i emocji.
spokojna mgła（宁静薄雾）: Z efektem spokoju i mgły, tworzącym spokojną atmosferę.

Spróbujmy teraz różnych efektów z różnymi parametrami, na przykład biorąc pod uwagę zachód słońca（日落） i krople deszczu（雨滴）.

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": "zachód słońca"
  }'

Tutaj ustawiliśmy preset na zachód słońca（夕阳效果），efekt wygląda następująco:

Jeśli zmienimy styl, na przykład zmieniając parametr preset na krople deszczu（雨滴效果），efekt wygląda następująco:

Inne ustawienia można przetestować samodzielnie.

Współczynnik proporcji kodu QR aspect_ratio

Za pomocą parametru aspect_ratio możemy ustawić współczynnik proporcji kodu QR, na przykład kwadrat 1:1, prostokąt 16:9 itd., ten parametr:

768x768: Współczynnik proporcji 1:1, co oznacza, że szerokość i wysokość płótna są równe. Odpowiedni rozmiar pikseli to 768x768, generowane płótno kodu QR jest kwadratowe.
1008x576: Współczynnik proporcji 16:9, co oznacza, że szerokość płótna jest 16/9 razy większa od wysokości. Odpowiedni rozmiar pikseli to 1008x576, generowane płótno kodu QR ma większą szerokość, odpowiednie do wyświetlania w formacie panoramicznym.
576x1008: Współczynnik proporcji 9:16, co oznacza, że szerokość płótna jest 9/16 razy mniejsza od wysokości. Odpowiedni rozmiar pikseli to 576x1008, generowane płótno kodu QR ma większą wysokość, odpowiednie do wyświetlania w formacie pionowym.
864x672: Współczynnik proporcji 4:3, co oznacza, że szerokość płótna jest 4/3 razy większa od wysokości. Odpowiedni rozmiar pikseli to 864x672, generowane płótno kodu QR ma lekko kwadratowy charakter, odpowiednie do ogólnego wyświetlania.
672x864: Współczynnik proporcji 3:4, co oznacza, że szerokość płótna jest 3/4 razy mniejsza od wysokości. Odpowiedni rozmiar pikseli to 672x864, generowane płótno kodu QR ma lekko pionowy prostokątny charakter, odpowiednie do ogólnego wyświetlania.

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"
  }'

Tutaj spróbowaliśmy wygenerować prostokątny kod QR, efekt wygląda następująco:

Pozycja kodu QR position

Możemy również kontrolować pozycję kodu QR za pomocą parametru position, na przykład, jeśli na zdjęciu jest dziewczyna w sukience, a chcemy umieścić kod QR w miejscu sukienki i zintegrować go z nią, możemy spróbować zmienić pozycję kodu QR, przykładowe wywołanie wygląda następująco:

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": "jedna z pięknych dziewczyn w blasku księżyca w tle, w stylu pikselowego chaosu, sztuka inspirowana rokokiem, ciemna biel i niebieskie niebo, wykonana z plastiku, delikatne kwiaty, gongbi, wimmelbilder",
    "position": "bottom",
    "aspect_ratio": "576x1008"
  }'

Efekt jest następujący:

Styl pikselowy kodu QR pixel_style

Możemy również dostosować styl pikselowy kodu QR, przekazując pixel_style, dostępne opcje to:

square (kwadrat): używa kwadratowych jednostek pikselowych, każda jednostka pikselowa ma kształt kwadratu.
rounded (zaokrąglony): jednostki pikselowe mają zaokrąglone rogi, co sprawia, że wygenerowany kod QR wygląda bardziej łagodnie i nowocześnie.
dot (punktowy): używa małych okrągłych punktów jako jednostek pikselowych, wygenerowany kod QR ma efekt punktowy, podobny do efektu druku.
squircle (kwadrat z zaokrąglonymi rogami): podobny do prostokąta z zaokrąglonymi rogami, ale bliższy kształtowi okręgu, nadając wygenerowanemu kodowi QR unikalny styl.
row (układ wierszowy): jednostki pikselowe są ułożone w wiersze, tworząc wzór w poziomie.
column (układ kolumnowy): jednostki pikselowe są ułożone w kolumny, tworząc wzór w pionie.

Podgląd stylu jest następujący:

Styl ramki kodu QR marker_shape

Dzięki marker_shape można dostosować styl ramki lokalizacyjnej, dostępne opcje to:

square (kwadrat): kształt znacznika jest kwadratowy, używany do wyróżnienia określonej lokalizacji lub elementu.
circle (okrągły): kształt znacznika jest okrągły, może być używany do oznaczania kluczowych obszarów lub elementów.
plus (plus): kształt znacznika to plus, podobny do krzyża, używany do wyróżnienia uwagi lub określonych informacji.
box (prostokąt): kształt znacznika to prostokąt, podobny do obramowanego prostokąta, może być używany do otaczania obszaru lub elementu.
octagon (ośmiokąt): kształt znacznika to ośmiokąt, z unikalnymi kątami, używany do przyciągania wzroku.
random (losowy): kształt znacznika rozkłada się losowo, dodając kodowi QR artystyczny i wizualny urok.
tiny-plus (mały plus): mały znacznik w kształcie plusa, może być używany do oznaczania drobnych elementów lub szczegółów.

Podgląd stylu jest następujący:

Styl podznacznika sub_marker

Dzięki sub_marker można dostosować kształt podznaczników (mniejszych znaczników), dostępne opcje to:

square (kwadrat): kształt podznacznika jest kwadratowy, może być używany do wyróżnienia szczegółów w określonej lokalizacji.
circle (okrągły): kształt podznacznika jest okrągły, może być używany do podkreślenia kluczowych szczegółów lub elementów.
box (prostokąt): kształt podznacznika to prostokąt, podobny do obramowanego prostokąta, odpowiedni do oznaczania małych obszarów.
random (losowy): kształt podznacznika rozkłada się losowo, dodając kodowi QR artystyczny i wizualny urok.
plus (plus): kształt podznacznika to plus, podobny do krzyża, może być używany do oznaczania drobnych informacji lub elementów.

Kąt obrotu kodu QR rotate

Dzięki rotate można kontrolować kąt obrotu kodu QR, dostępne opcje to:

0: brak obrotu, wygenerowany kod QR zachowuje oryginalny kierunek, bez efektu obrotu.
90: wygenerowany kod QR obraca się o 90 stopni w prawo, wyświetlając go w kierunku pionowym.
180: wygenerowany kod QR obraca się o 180 stopni, co sprawia, że jest odwrócony, czyli wyświetlany do góry nogami.
270: wygenerowany kod QR obraca się o 270 stopni w prawo, wyświetlając go w kierunku odwrotnym do pionowego.

Wstępne ustawienia kodu QR pattern

Dzięki pattern można łatwo włączyć niektóre style kodu QR, takie jak kwadratowa ramka lokalizacyjna, okrągłe punkty pikselowe itd., tutaj zdefiniowano kilka wzorców:

wzór	znaczenie
s1	styl_piksela: kwadratowy kształt_znacznika: kwadratowy
s2	styl_piksela: kwadratowy kształt_znacznika: kwadratowy obrót: 180
s3	styl_piksela: kwadratowy kształt_znacznika: kwadratowy obrót: 180niestandardowe_wypełnienie_szum: 0.25
rd1	styl_piksela: zaokrąglony kształt_znacznika: losowy
rd2	styl_piksela: zaokrąglony kształt_znacznika: losowy obrót: 180
rd3	styl_piksela: zaokrąglony kształt_znacznika: losowy obrót: 180niestandardowe_wypełnienie_szum: 0.25
d1	styl_piksela: kropka kształt_znacznika: okrąg
d2	styl_piksela: kropka kształt_znacznika: okrąg obrót: 180
d3	styl_piksela: kropka kształt_znacznika: okrąg obrót: 180niestandardowe_wypełnienie_szum: 0.25
r1	styl_piksela: rząd kształt_znacznika: plus
r2	styl_piksela: rząd kształt_znacznika: plus obrót: 180
r3	styl_piksela: rząd kształt_znacznika: plus obrót: 180niestandardowe_wypełnienie_szum: 0.25
c1	styl_piksela: kolumna kształt_znacznika: pudełko
c2	styl_piksela: kolumna kształt_znacznika: pudełko obrót: 180
c3	styl_piksela: kolumna kształt_znacznika: pudełko obrót: 180niestandardowe_wypełnienie_szum: 0.25
sq1	styl_piksela: squircle kształt_znacznika: losowy
sq2	styl_piksela: squircle kształt_znacznika: losowy obrót: 180
sq3	styl_piksela: squircle kształt_znacznika: losowy obrót: 180niestandardowe_wypełnienie_szum: 0.25