Mesterséges intelligencia – miben és hogyan segíti a webdesignerek munkáját?

Lerántjuk a leplet az AI egyik-másik „oldaláról”, azaz rámutatunk arra, hogy az MI-tól nem megijedni kell, hanem meg kell tanulni vele együtt dolgozni, és igazán hasznos kis munkatárs lesz a webdesigner munkánkban.

Mielőtt belevágnánk, szeretnénk felhívni a figyelmedet, kedves Olvasó egy korábbi bejegyzésünkre, melyben áttekintést adtunk a mesterséges intelligenciáról, nagy vonalakban körbejártuk azokat a területeket, ahol már eddig is használták, és ahol még hasznosítható, röviden bemutattuk 2023 „slágerét”, a chatGPT-t, továbbá megnéztük azt, hogy előnyökkel kecsegtet az AI alkalmazása a webdesigner „szakmában”, valamint rámutattunk a „promptolás mesterségére, ugyanis jelenleg az egyik legnagyobb kihívás az, hogy a felhasználók által használt nyelvet/utasítást/parancsot pontosan értsék az AI alapú alkalmazások és arra a legjobb választ/megoldást adják.

A mesterséges intelligencia óriási adatbázisokban, ún. mintázatokon képes tanulni és azokból komplex cselekvést (pl. kérdésre válaszol) létrehozni. Az AI számára minden bevitt információ adat, az adatok, illetve azok csoportjai pedig mintázatok számára. Az AI mintázatokat keres, illetve mintázatokat ismer fel. Tulajdonképpen az adatok közötti összefüggéseket matematikai modellé alakítja, és így képes bárminek a megértésére és a használatára. Az AI viszont nem egy algoritmus, mert egy algoritmusnak a “hogyant” kell elmondani, előre be kell programozni, míg az AI-nak csak a célt kell elmondani, melyre tudja a választ/a cselekvést, mert sok mintát látott rá. (Egy nagyon egyszerű példa: az önvezető autó azért tudja, hogy a zöld lámpánál mehet, mert erre nagyon sok mintát látott, nagyon sok autót és közlekedési helyzetet mutattak neki – az adott helyzetet, azaz az adott mintázatot ismeri fel, és így tudja, hogy milyen döntést (mehet) kell hoznia.)

A MI folyamatosan tanult/tanul – felfoghatatlan mennyiségű adattal “tréningelik”.

Egy kis érdekesség: A nagy nyelvi modellen (AI alapú rendszer, nagy mennyiségű szöveg tanulmányozásával képes megérteni és előállítani emberi nyelvű szövegeket) alapuló chatGPT* 3-as verzióját 570 GB adaton lett feltanítva, tehát ennyi adatot látott, olvasott el. A jelenlegi (bejegyzés írásakor) 4-es verzió már 2-6 TB adattal van tréningelve. Ez a mennyiség megfelel az emberi agy adattárolási kapacitásának, de a különbség az, hogy nekünk ehhez 130 ezer évet kellene olvasnunk, hogy bármikor bármire tudjunk válaszolni. A Gemini-t, azaz a Google AI-t, az OpenAI által fejlesztett chatGPT4 versenytársát már 86 TB adattal tréningelik, 10 millió könyvet olvasott el, és igazából már most nincs olyan ember által létrehozott adat, információ, amit “ő” még nem látott.

*GPT = Generative Pre-Trained Transformers (“Generatív előre-tanított rendszer”)

Meg is kérdeztük a chatGPT-t, hogy mindez mit jelent pontosan. Íme a válasza:

A “Generative Pre-Trained Transformer” (GPT) kifejezés a mesterséges intelligencia (AI) és a természetes nyelvfeldolgozás (NLP) területén használt egyik legfontosabb technológiára utal. Lássuk részletesebben, mit jelentenek az egyes komponensek:

  1. Generative (Generatív): Ez arra utal, hogy a modell képes új, emberi szövegekhez hasonló tartalmakat generálni. Nem csak előre meghatározott válaszokat ad, hanem képes új mondatok, bekezdések, vagy akár teljes cikkek megírására is, kreatívan használva az addig tanult információkat.
  2. Pre-Trained (Előre Tréningezett): A modellt hatalmas mennyiségű szöveges adaton tanítják be előre, mielőtt speciális feladatokra finomhangolnák. Az előre tréningezés során a modell megtanulja a nyelv általános mintáit, struktúráit és szabályait, ami után sokkal hatékonyabban lehet finomhangolni speciális alkalmazásokra, mint például ügyfélszolgálati chatbotokra vagy orvosi szövegek elemzésére.
  3. Transformer: A “Transformer” egy olyan neurális hálózati architektúra, amelyet először a Google AI csapata mutatott be 2017-ben. A Transformer architektúra forradalmasította a természetes nyelvfeldolgozást, mivel képes nagyon hatékonyan és pontosan kezelni hosszú távú függőségeket a szövegben, párhuzamos feldolgozási képességének köszönhetően. A Transformer alapját képezi a GPT modelleknek.

Tehát a Generative Pre-Trained Transformers egy olyan fejlett AI technológia, amely generatív módon képes új szövegeket létrehozni, előre tanított adatok felhasználásával és a Transformer architektúra alkalmazásával. Ez a kombináció lehetővé teszi, hogy a modellek nagyon pontosan és sokrétűen alkalmazhatók legyenek különféle nyelvi feladatokban.

Sokan tartanak attól, hogy a mesterséges intelligencia számos munkafolyamatban leváltja az embert, egyszóval elveszi az emberek munkáját. Tény, hogy az AI felülmúlta az emberi képességeket, hiszen felismeri a beszédet, szinte minden nyelven tud tartalmat gyártani, képeket generál, videókhoz forgatókönyvet ír, zenéket komponál, tud számolni és kódokat írni, tud elemezni, válaszokat adni, de adott funkcióra is specializálódik (pl. befektetési tanácsadó GPT, kríziskommunikáció specialista GPT, zeneszerző GPT, ügyfélszolgálati chatbot). És tudásban folyamatosan távolodni is fog tőlünk. Biztosan lesznek olyan munkák, munkakörök, melyek valóban megszűnnek, mert már teljesen a “gép” dolgozik az ember helyett, illetve sok “szakma” átalakul, és új szakterületek/szakmák is napvilágot látnak.

Azokban a munkákban, melyekben mi, emberek fájlokat (legyen az egy kép, egy e-mail, egy dokumentum) hozunk létre, abban az AI már most jobb. Nekünk azonban nem versenyezni kell a mesterséges intelligenciával, hanem meg kell tanulni együttműködni vele, és akkor a képességeit a saját javunkra tudjuk fordítani. Ember-gép kommunikáció. Egy új terület, amit még meg kell tanulni, de mindezt már most, egy “új korszak” hajnalán kamatoztatni tudjuk.

Milyen hasznokat, előnyöket jelent az AI használata egy webdesigner számára?

Azzal, hogy a webdesigner munkánkba bevonjuk a MI-t, legfőképpen időt spórolunk. Természetesen ne legyenek irreális elvárásaink, nem dőlhetünk nyugodtan hátra, mert nem fog nekünk 90% munkaidőt megspórolni. A kb. 30-50%-is időspórolás a reális, de az is csak akkor, ha már jól összebarátkoztunk az AI-val. Persze akadnak feladatok, melyekben nagyon sok időt tudunk vele spórolni: például képeket generáltathatunk vele, elemzéseket kérhetünk tőle, információk összegyűjtését kérhetjük tőle – ezek mind időigényes feladatok lennének számunkra, dolgozzon csak ő helyettünk! : ) Addig mi mással is tudunk foglalatoskodni, amihez egyelőre tényleg mi kellünk, illetve így teljes mértékben közben a kezünk alá dolgozik, vagyis sokkal gyorsabban, könnyebben és hatékonyabban tudjuk elvégezni az adott munkát/munkafolyamatot.

Az tehát a feladatunk, hogy parancsot adjunk neki, de az általa generált tartalmakat ellenőriznünk is kell. Ugyanis azt is tudni kell a mesterséges intelligenciáról, hogy nem minden esetben ad tökéletes végeredményt, ritka a jó, pontos eredmény (helyesírási/fogalmazási hibák, fotókon torzulások, hallucinációk = téved az AI, valóban rossz, helytelen megoldásokat ad), azaz az AI által generált tartalmakat mindig csekkolnunk kell. Elmondható, hogy ami időt megspórolunk vele azoknál a lépéseknél, melyekbe bevonjuk, azt az időt rá kell fordítanunk az utómunkára, az ellenőrzésre. De ennek ellenére is egy jelentős időspóroló faktor lehet számunkra a mesterséges intelligencia.

Továbbá a MI-val lehet közösen ötletelni, nagyon sok inspirációt és új nézőpontot tud adni egy-egy témában, és így mi is sokkal produktívabbak, eredményesebbek tudunk lenni.

Új és újabb verziókat tud generálni adott tartalmakból, újra és újra nekifuthatunk a még jobb végeredményért, bátrabbak, merészebbek lehetünk, és így valóban testre szabott és egyedi munkákat tudunk kiadni a kezünkből.

Miben tud a mesterséges intelligencia egy webdesignernek segíteni?

Ma már számos AI alapú alkalmazás áll a webdesignerek szolgálatába, melyek a weboldalkészítési projekt különböző fázisaiban lehetnek hasznos segéderők. : )

Ötlettábla, azaz moodboard generálásához is bevethető a MI. Egy-egy hangulattábla színekkel, betűkkel, fotókkal már a kezdő lökést is meg tudja adni a webdesigner számára az inspirálódás szakaszában – ha esetleg ötlet hiányában napokig csak az üres „papír” felett görnyednénk.

Színpaletta generálására is alkalmas a mesterséges intelligencia – adott témának, adott kulcsszavaknak megfelelően állítja össze a palettát, melynek színei aztán felhasználhatók a tervezés során.

A különféle művészi stílusokban is nagyon jó az AI, mert rengeteg képet, stílust látott, konkrét művészektől is, tehát a stílusok mindegyikét jól ismeri. Különbséget tud tenni egy kép tartalma és egy kép stílusa között, így egy adott kép tartalmának a megőrzése mellett arra a képre rá tudja „húzni” egy másik kép stílusát, annak a stílusnak a jellegzetes jegyeit. Átfogó AI alapú stílustárakat, gyűjtőoldalakat is találunk, ahol megismerkedhetünk a különféle stílusokkal, keresgélhetünk közöttük, mintaképeket, inspirációkat tekinthetünk meg, melyek mind segíthetnek akár a brand arculatának, akár a weboldal dizájnjának a kitalálásában.

Megfelelő parancsok, utasítások megadásával drótvázat* is generál számunkra az AI. Nem feltétlenül kapunk mindig tökéletesen kidolgozott tervet (nyilván a végeredmény a tőlünk kapott utasítás, azaz prompt milyenségétől, részletességétől is függ), de ha egyszerűen csak mi magunk skiccelnénk fel egy vázlatot, valljuk be, az sem lenne tökéletes, illetve attól is el lehet térni a kivitelezés során. De az AI generált oldaltervek is akár egy másik programban (pl. Figma, Photoshop) „életre kelthetők”, azaz a fekete-fehér elemek kiszínezhetők, a vázlatos tervek fotókkal/illusztrációkkal/ikonokkal tölthetők meg. De több olyan alkalmazás is van, melyek “színes-szagos” webdesign terveket adnak, és ezek mindegyike testre szabható. Elvehetünk-hozzáadhatunk a tervekhez: szöveges tartalmakat, egyedi alakzatokat, fotókat, ikonokat, gombokat, stb.

*A drótváz vagy drótháló (wireframe) a honlap váza, szerkezeti felépítése felvázolva, a weboldal ábrája, előzetes „kinézete”, mely vonalvezetőként szolgál a tervezés és a kivitelezés folyamatában.

A mesterséges intelligencia valós adatok nélkül is képes azt megjósolni, hogy egy adott weboldalon a látogatók hova fókuszálnak, hova navigálnak, hogyan böngészik az oldalakat, egyszóval hőtérképet* készít. Maga az oldalterv is „beadható” egy ilyen típusú alkalmazásnak, vagyis egy még nem létező oldalról, konkrét adatok nélkül is fel tudja mérni a felhasználók oldallátogatási szokásait, mely alapján mi, webdesignerek jól láthatjuk, hogy a webdesign tervünk működőképes-e, mi az, amin korrigálnunk kell, mi az, amire kiemelten figyelnünk kell.

*A hőtérképekkel (heat maps) feltérképezhetjük a honlaplátogatók viselkedését, azaz egy képet, pontosabban egy térképet, egy útvonalat kapunk arról, hogy a felhasználó figyelme honnan hova vándorol az oldalon, hogyan pásztázza azt végig, hogyan mozgatja az egeret, mire figyel fel először, mit néz sokáig, milyen elemre kattint először. A kapott eredményekből aztán következtetéseket vonhatunk le, melyek alapján javíthatunk honlapunk felépítésén, ergonómiáján, használhatóságán, egyszóval optimalizálhatjuk.

Egy weboldalra számos vizuális tartalomra van szükség. Ha ezeket a megrendelő nem biztosítja, akkor bizony a webdesignernek kell ezeket elkészítenie/beszereznie. Ha nem szeretnénk stock megoldásokat alkalmazni, azaz elcsépelt, minden harmadik weboldalon visszaköszönő stockfotókat használni az általunk tervezett honlapon, nem mellesleg valóban arculatra/témára szabott, teljesen egyedi (értsd: máshol nem jöhet szembe, ugyanis nagyon kicsi rá az esély, hogy az AI még azonos prompt esetén is ugyanazt a végeredményt hozza létre) vizuális tartalmakkal szeretnénk dolgozni, akkor ez ügyben szintén az AI-hoz fordulhatunk.

A mesterséges intelligencia verhetetlen a látványos fotók legenerálásában. A titok ebben az esetben is a „tökéletes” promptban áll, ugyanis minél több és pontosabb információt adunk meg a MI számára, annál inkább az/olyan lesz a végeredmény, amit mi előzetesen elképzeltünk. Ha megadjuk a kép fő témáját/alanyát, továbbá a médiumot, a stílust, „rendező bőrébe bújva” a kompozíció típusát, valamint a színeket, és akár még a megvilágítás módját is, mindezt akár fokozatosan, az aktuális kapott kimenet függvényében, akkor nagy esély van rá, hogy olyan végeredményt kapjunk, mely megfelel az előzetes elgondolásunknak.

A fotók mellett az AI beiktatásával különféle stílusban (pl. vízfesték-hatású, cartoon, flat 2., linómetszet, színátmenetes) generálhatunk le illusztrációkat, grafikákat, ikonokat – ezekből is mindig szükség van a weboldalakra. Igen, mondhatjuk, hogy ma már sok letöltő oldal van, ahonnan ezek beszerezhetők, de ha nem éppen abban a stílusban, abban a színvilágban állnak rendelkezésünkre, amilyenre nekünk szükségünk lenne, akkor a mesterséges intelligenciával ezeket is elkészíttethetjük. 

Sőt, ha egy adott elem pixelgrafikus formában áll a rendelkezésünkre, de nekünk vektorgrafikus formátumban van rá szükségünk, akkor a MI ezt az átalakítást is el tudja végezni.

Fotók szerkesztéséhez is bevethetjük a mesterséges intelligenciát, ugyanis képes a fotók (vagy akár videók) minőségének javítására, hátterek eltüntetésére, kiterjesztésre, azaz a hiányos vagy csak adott részletet ábrázoló fotót valósághűen ki tudja egészíteni.

Animált elemek is generálhatók AI alapú alkalmazásokban, de folyamatosan fejlesztik a videógeneráló modelleket is. Egyre hosszabb és egyre részletgazdagabb jelenetekkel, összetett kameramozgásokkal, érzelmekkel átfűtött karakterekkel készülnek a videók, és már napvilágot látott az első AI által generált zenei videoklip is.

És miben lehet még hasznos az AI egy webdesigner számára?

Ha esetleg a megrendelő célcsoportjáról nincs elég vagy konkrét információ a briefben, mely alapján a webdesigner pontosan tudná, hogy kinek kell terveznie, kiket kell megszólítania az általa tervezett webdizájnnak, akkor maga a chatGPT tud segíteni a célközönség meghatározásában, a célközönség leírásában, jellemzőinek összegyűjtésében. Ún. buyer personák (a célközönség kitalált, meghatározott, konkrét képviselője) kitalálásában is tud segíteni – körbeírjuk neki és ő bemutatja nekünk őket. Egy adott buyer personát részletesen is kidolgoz – onnantól kezdve, hogy milyen az adott buyer persona napja. Utána erre a fiktív vásárlói személyiségre szabott hirdetési szövegeket és egyéb tartalmakat is tud gyártani, ugyanakkor a webdesigner számára is ezek mind hasznos információk, hiszen az adott vásárlói profilra szabható a weboldal felépítése, megjelenése. Egyszóval az AI beiktatásával sokkal személyre szabott weboldalak születhetnek.

Ha a webdesigner vállalja a webszövegírást is, akkor természetesen ebben is segítségére lesz a chatGPT, de akár kulcsszavak gyűjtésében, marketingszövegek, szakértői posztok és blogbejegyzések írásában, valamint metaleírások elkészítésében is. De fordításokban, tartalmak/tudnivalók összefoglalásában, listák összeállításában, kategorizálásban, adat- és információgyűjtésben, különféle elemzésekben is profi a chatGPT.

A mesterséges intelligenciát virtuális asszisztensként is lehet hasznosítani a webdesigner vállalkozásban. Ügyfélszolgálati teendőket is el tud látni, gyakori kérdésekre és az azokra adott válaszokra „fel lehet tanítani”, de akár e-mailek írására, illetve megválaszolására is használhatjuk.

Vizuális tartalomhoz is kérhetjük a chatGPT segítségét. Ha esetleg éppen nincs ötletünk arra vonatkozóan, hogy például egy weboldalra, egy blogbejegyzéshez vagy éppen egy prezentációhoz milyen vizuális tartalmakat társítsunk, akkor tud nekünk javaslatokat adni. Sőt, akár egy videó lépésről lépésre forgatókönyvét is össze tudja állítani. Azonban abban is kérhetjük a segítségét, hogy a bevitt leírásunk alapján (mit is szeretnénk) állítson össze, fogalmazzon meg promptot az AI alapú képgenerátorok számára. 

Webinárok és prezentációk összeállításában is tudjuk alkalmazni, a közös ötleteléstől kezdve a tartalmak és információk struktúrájának kialakításán át a slide-ok összeállításáig.


Nos, igencsak hosszú a lista, és tényleg csak a főbb mozzanatokat emeltük ki. A mesterséges intelligencia fejlődése, illetve mindennapi munkába való bevonása folyamatos, de már e „rövid” lista alapján is jól látható, hogy milyen sok mindenben lehet a webdesignerek segítségére is.

Megijedni nem kell tőle, hiszen ha nem adunk neki parancsot, nem csinál semmit, tehát nem ébred öntudatra és a munkánkat sem tudja elvenni. Ne feledjük, minden lépéshez kell az ember, kell a szakember! És bármit is generál le (emberi utasításra) az AI, a hozzáadott emberi érték benne lesz. És a MI által generált tartalmak ellenőrzéséhez, javításához is kell az ember (értenünk kell az adott területhez, hogy tudjuk, ha nem jó választ/végeredményt adott, ezt fel kell ismernünk, és tudnunk kell, hogy hogyan tudjuk pontosítani az utasításunkat – ha értünk az adott területhez, az AI akkor tud segíteni, míg egyszerű feladatokat jól megold, azokhoz nem kell értenünk). Egy kattintással tehát nem lehet kiváltani a szakembert. Ami javasolt: a szakembernek, azaz egy webdesignernek is (és tulajdonképpen lassan már mindenkinek) nyitottnak kell lennie a technikai újdonságok iránt, és mindig egy lépéssel előttük kell járnia – ha megtanulja ezeket az újdonságokat, rajtuk tartja a szemét, akkor ezekből sokat tud profitálni.

A blogbejegyzésben található fotók a Midjourney alkalmazással készültek.

Hozzászólás írása

Az e-mail-címet nem tesszük közzé.