Publikáltuk a MiraQlum Image Optimizert: egy ingyenes WordPress-bővítményt, amely automatikusan elvégzi és ellenőrzi a weboldalra érkező képek technikai előkészítésének jelentős részét.
Az ötlet egy nagyon hétköznapi problémából indult. Weboldalakkal dolgozva rengetegszer ugyanazt csináltuk a beérkező képekkel: átméretezés, megfelelő képformátum, a fájlban maradt fölösleges háttérinformációk eltávolítása, színkezelés, fájlnév, a kép szöveges leírásának előkészítése, végül ellenőrzés.
Ezek külön-külön néhány perces feladatok. Nagy mennyiségnél viszont meglepően sok munkaóra gyűlik össze belőlük.
Ezt a folyamatot raktuk össze egyetlen automatizált rendszerbe.
A fejlesztés közben pedig kiderült valami, amitől számunkra is sokkal érdekesebb lett az egész:
a MiraQlum Image Optimizer akkor is képes dolgozni, amikor már nem ember tölti fel a képet.
AI által, MCP-kapcsolaton keresztül indított feltöltéssel is kipróbáltuk. A bemenet egy JPG kép volt. A WordPress médiatárába már WebP került, és a WordPress által automatikusan elkészített kisebb képméretek is WebP-ben jöttek létre.
A plugin felépítése miatt a WordPress szabványos automatizált képbeérkezési folyamataiba is be tud kapcsolódni. Ilyen útvonalat használ a WooCommerce saját API-ja is, amikor külső címről érkezik egy termék képe.
Egy tízezer termékes webshopnál ennek már egészen más a súlya.
Kinek segíthet?
Céges weboldalaknak, ahol rendszeresen kerülnek fel új képek. A kollégának elég feltöltenie a fotót, a technikai előkészítés jelentős részét átveszi a rendszer.
Webshopoknak, ahol több száz, több ezer vagy akár tízezer termékkép érkezhet. Ha az import a WordPress szabványos képkezelési útvonalát használja, a képfeldolgozás az automatizált import része lehet.
Ügynökségeknek és weboldal-készítőknek, ahol sok ügyfélnél ismétlődik ugyanaz a néhány perces képelőkészítés.
Magazinoknak, híroldalaknak és több szerzővel működő weboldalaknak, ahol sok ember tölt fel képeket, különböző eszközökről és különböző formátumokban.
Automatizált vagy AI-val összekapcsolt WordPress-rendszereknek is. Itt a képet már egy másik rendszer küldheti a WordPressbe. Az MCP-n keresztül indított JPG-feltöltést valódi WordPress-oldalon is sikeresen végigteszteltük.
Mindegyik esetben ugyanaz történik: egy sokszor ismétlődő technikai munkafolyamat átkerül az embertől a rendszerhez.
2 perc egy képnél. 333 munkaóra tízezer képnél.
Talán a számok mutatják meg a legjobban, miért kezdtünk ezzel foglalkozni.
Számoljunk egy képre mindössze 2 perc kézi előkészítést.
Megnézzük a méretét, szükség esetén átméretezzük, megfelelő formátumba mentjük, rendbe tesszük a fájlnevet, feltöltjük.
100 kép = 3 óra 20 perc
1 000 kép = 33 óra 20 perc
10 000 kép = 333 munkaóra
Ez több mint 41 teljes, nyolcórás munkanap.
Három perc képenként már 500 munkaóra, vagyis több mint 62 munkanap tízezer képnél.
Ez egy egyszerű példaszámítás, hiszen a képek és a munkafolyamatok különböznek. A nagyságrend viszont jól látszik belőle.
Egyetlen képnél két perc fel sem tűnik.
Ezerszer vagy tízezerszer megismételve már emberhetekben mérjük.
Mi történik valójában egy feltöltött képpel?
Egy vállalkozó készít egy jó fotót a telefonjával és feltölti a weboldalára. Számára ennyi történt, és ennyinek is kellene történnie.
A háttérben viszont van vele munka.
Egy mai telefon képe könnyen lehet 5000 pixel széles és több megabájtos. Weboldalon ekkora képre általában nincs szükség, a fölösleges méret pedig tárhelyet és adatforgalmat fogyaszt.
A fájl belsejében olyan információk is maradhatnak, amelyeket a telefon vagy a fényképezőgép automatikusan mentett el. Ilyen lehet az eszköz típusa, a készítés időpontja, technikai adatok, bizonyos esetekben akár GPS-információ.
Ezeket hívjuk EXIF- és más metaadatoknak. A képen nem látszanak, magában a fájlban viszont ott lehetnek.
A képhez tartozó ALT szöveg tulajdonképpen a kép rövid szöveges leírása. Fontos többek között a képernyőolvasót használó látogatóknak, és a keresőknek is információt ad arról, mi található a képen.
A színkezelés ennél technikaibb terület. Az sRGB egy széles körben használt szabványos színtér a weben. A MiraQlum Image Optimizer a támogatott szerverkörnyezetben ismert sRGB profilra tudja normalizálni a képet, majd az eredményt ellenőrzi is. Ennek az a gyakorlati célja, hogy a színek webes megjelenítése kiszámíthatóbb legyen.
A felhasználó ebből jó esetben semmit nem vesz észre.
Feltölti a képet, a technikai háttérmunkát pedig elvégzi a rendszer.
A saját időnkkel kezdtünk számolni
A MiraQlum Image Optimizer ötlete a saját munkánkból jött.
Sok ügyfél, sok weboldal, rengeteg kép. Ugyanazok a lépések újra és újra.
Ha egy ügynökség évente 5 000 képpel találkozik, és képenként csak két perc munkát tud levenni a folyamatról, az már 166 munkaóra évente.
Több mint 20 teljes munkanap.
Ráadásul ez minden évben újratermelődik.
Nálunk itt vált egyértelművé, hogy ezt a folyamatot érdemes rendszerbe tenni. Ugyanez a gondolkodás jelenik meg más területeken is: a MiraQlum működési szemléletének egyik alapja éppen a visszatérő, időt és figyelmet fogyasztó feladatok felismerése és rendszerbe szervezése.
A lényeg a teljes folyamat
Automatikus képoptimalizálásra természetesen eddig is léteztek WordPress-megoldások. Van, amelyik WebP-t készít, más átméretez, metaadatot töröl, ALT szöveget készít a fájlnévből, vagy helyben dolgozik külső szolgáltatás nélkül.
Mi ezeket a funkciókat egy összefüggő munkafolyamatként kezeltük.
A MiraQlum Image Optimizerben egy új kép útja nagyjából így néz ki:
valódi fájltípus ellenőrzése
→ méret- és pixelvédelem
→ formátumkezelés
→ fölösleges és privacy szempontból problémás metaadatok eltávolítása
→ színprofil normalizálása
→ átméretezés
→ fájlnév rendezése
→ ALT előkészítése
→ az elkészült fájl visszaellenőrzése
Számomra itt van a fejlesztés egyik legérdekesebb része.
A kép feldolgozása és az eredmény ellenőrzése ugyanannak a folyamatnak a része.
Erre használjuk a fejlesztés során a verification-first, vagyis ellenőrzés-központú megközelítés kifejezést.
A gyakorlatban ez azt jelenti, hogy a rendszer elkészíti a képet, majd megnézi, valóban olyan lett-e, amilyennek lennie kell.
Az első MCP-teszt pont ezen akadt fenn
Az AI-val végzett feltöltési tesztünk ezért lett különösen érdekes.
Az első külső JPG-nél a feldolgozás megállt. A rendszer a rendelkezésre álló szerverkörnyezetben nem tudta megfelelően igazolni a szükséges színprofil-kezelést.
Egy másik JPG-vel megismételtük a tesztet.
Az végigment.
A bemenet JPG volt.
A WordPress médiatárban WebP lett belőle.
A WordPress által generált 300×200, 1024×683, 150×150, 768×512 és az adott weboldal által használt további képméretek is WebP-ben készültek el.
AI/MCP → JPG → WordPress → MiraQlum Image Optimizer → ellenőrzött WebP → WebP képméretek.
PASS.
A teszt közben tulajdonképpen két dolgot igazoltunk egyszerre.
Az MCP-n keresztül érkező kép bekerült a MiraQlum Image Optimizer feldolgozási folyamatába.
És azt is láttuk működés közben, hogy az ellenőrzési réteg valóban képes megállítani egy olyan feldolgozást, amelynek az eredményét nem tudja megfelelően igazolni.
Ez már ugyanabba az irányba mutat, amiről korábban a Nyíregyházi Egyetemen is beszéltem: az AI akkor válik igazán érdekessé, amikor munkába áll és a működési folyamat részévé válik.
Innen már egyenes út vezetett a webshopokhoz
A MiraQlum Image Optimizer a WordPress szabványos feltöltési folyamataihoz kapcsolódik.
A WordPress-fejlesztők számára a három fontos hook:
wp_handle_upload_prefilter
wp_handle_sideload_prefilter
wp_handle_uploadHétköznapi nyelven ez azt jelenti, hogy a plugin a WordPress szabványos „bejáratainál” várja az érkező képet.
Az egyik ilyen a normál feltöltés.
A másik az úgynevezett sideload. Ilyenkor egy másik rendszer megadja egy kép internetes címét, a WordPress letölti a fájlt, majd beilleszti a saját médiakezelési folyamatába.
A WooCommerce Core REST API ezt a WordPress-mechanizmust használja a külső URL-ről érkező termékképeknél.
Egy automatizált webshop-import ezért így is felépülhet:
termékfeed / API → külső termékkép → WooCommerce → WordPress sideload → MiraQlum Image Optimizer → webre előkészített kép → médiatár → képméretek → termék
És itt megint érdekesek lesznek a számok.
10 000 termék, termékenként három kép:
30 000 kép.
A korábbi kétperces példaszámítással ez 1 000 munkaórányi kézi előkészítésnek megfelelő mennyiség.
125 nyolcórás munkanap.
Egy ilyen import eleve automatizálásért kiált. Az érdekes számunkra az, hogy a termékadatok mellett maga a kép-előkészítés is bekerülhet ugyanabba az automatizált láncba.
Külső feed- és importplugineknél mindig meg kell nézni, milyen feltöltési útvonalat használnak. Ha a WordPress szabványos upload vagy sideload folyamatán keresztül adják át a képet, a MiraQlum Image Optimizer be tud kapcsolódni.
A WooCommerce Core esetében ez az útvonal adott. Az MCP/API jellegű JPG-feltöltést pedig már valódi WordPress-oldalon is végigteszteltük.
Helyben dolgozik, képenként fogyó külső kredit nélkül
A MiraQlum Image Optimizer a weboldal saját szerverkörnyezetében dolgozik.
Ez nagyobb képmennyiségnél különösen érdekes. A feldolgozott képek számának növekedésével nem fogy egy külső optimalizáló szolgáltatás képenkénti kreditje.
A teljes funkcionalitást tesszük elérhetővé az ingyenes pluginban.
Nincs külön Pro verzió. Maga ez a Pro verzió.
Sokat dolgoztunk azon, amit a felhasználó remélhetőleg soha nem fog látni
A fejlesztés jelentős része nem látványos funkciókkal telt.
Fájltípus-ellenőrzés, méret- és pixelvédelem, jogosultságvizsgálat, privacy-metaadatok ellenőrzése, színprofil-kezelés, hibás és szándékosan problémás fájlok tesztelése, forráskód- és biztonsági ellenőrzések, release előtti ellenőrzési folyamat.
Ezekből a felhasználó jó esetben semmit nem lát.
És ez így van rendben.
A cél az volt, hogy amikor ő feltölt egy képet, a háttérben minél több olyan lépés automatikusan megtörténjen, amelyet egy gondos webes szakember egyébként külön-külön végezne el.
Nekem ebben van az innováció
A piacon körülnézve azt látjuk, hogy az egyes részfeladatokra sok jó megoldás létezik.
A mi fejlesztésünk értéke számomra abban van, ahogyan ezeket egyetlen szűk, következetes munkafolyamatba szerveztük, és az ellenőrzést is ennek részévé tettük.
Egy szakember oldaláról nézve a folyamat:
átméretezés → konvertálás → rejtett adatok tisztítása → színkezelés → fájlnév → ALT → ellenőrzés
A felhasználó oldaláról pedig jó esetben:
feltöltöm → kész.
Ez egy kicsi, gyakorlati workflow-innováció.
És nagyon pontosan illik ahhoz, amit a MiraQlumban keresünk.
2 perc egy képnél alig észrevehető.
Tízezer képnél 333 óra.
Harmincezernél 1 000 óra.
Ez pedig csak egyetlen apró munkafolyamat egy vállalkozásban.
Mi pontosan az ilyen munkaórákat keressük.
Ahol a szabályok tiszták, a folyamat automatizálható és az eredmény ellenőrizhető, ott az ember idejének már jobb helye is van. Erre van működő példánk az ügyfélkezelésben is: az IngatlanNyiregyhaza.hu MiraQlum esettanulmányában egy másik üzleti folyamatnál látszik ugyanez a rendszerszintű gondolkodás.
És még egy apró részlet a végére: az ebben a cikkben látható képeket is úgy töltöttük fel erre a WordPress-oldalra, hogy közben a MiraQlum Image Optimizer dolgozott rajtuk. Vagyis miközben a cikk a plugin működéséről mesél, a saját képei már ugyanazon a folyamaton mentek keresztül, amelyről fent végig szó volt.
Márkus Péter
A MiraQlum alapítójaként üzleti folyamatokat, automatizálási lehetőségeket és AI-val támogatott rendszereket építek. Azokat a pontokat keresem egy vállalkozás működésében, ahol az ismétlődő emberi munkát jól meghatározható szabályok alapján rendszerre lehet bízni, az eredményt pedig ellenőrizni lehet. A MiraQlum Image Optimizer is egy ilyen hétköznapi problémából született.
