[{"data":1,"prerenderedAt":350},["ShallowReactive",2],{"navigation-hu":3,"blog-page-hu":56,"blogs-hu":66},[4,31],{"title":5,"path":6,"stem":7,"children":8,"page":30},"En","\u002Fen","en",[9],{"title":10,"path":11,"stem":12,"children":13,"page":30},"Blog","\u002Fen\u002Fblog","en\u002Fblog",[14,18,22,26],{"title":15,"path":16,"stem":17},"From Mockup to Market: My End-to-End Product Design Process","\u002Fen\u002Fblog\u002Ffrom-mockup-to-market","en\u002Fblog\u002Ffrom-mockup-to-market",{"title":19,"path":20,"stem":21},"How I Built My Design System from Scratch","\u002Fen\u002Fblog\u002Fhow-i-built-my-own-design-system-from-scratch","en\u002Fblog\u002Fhow-i-built-my-own-design-system-from-scratch",{"title":23,"path":24,"stem":25},"The Psychology of Color in UI Design","\u002Fen\u002Fblog\u002Fpsychology-of-color-in-ui-design","en\u002Fblog\u002Fpsychology-of-color-in-ui-design",{"title":27,"path":28,"stem":29},"The Case for Slow Design in a Fast-Paced Digital World","\u002Fen\u002Fblog\u002Fslow-design-in-fast-paced-digital-world","en\u002Fblog\u002Fslow-design-in-fast-paced-digital-world",false,{"title":32,"path":33,"stem":34,"children":35,"page":30},"Hu","\u002Fhu","hu",[36],{"title":10,"path":37,"stem":38,"children":39,"page":30},"\u002Fhu\u002Fblog","hu\u002Fblog",[40,44,48,52],{"title":41,"path":42,"stem":43},"A makettől a piacig: Terméktervezési folyamatom lépésről lépésre","\u002Fhu\u002Fblog\u002Ffrom-mockup-to-market","hu\u002Fblog\u002Ffrom-mockup-to-market",{"title":45,"path":46,"stem":47},"Hogyan építettem fel a saját design rendszeremet a nulláról","\u002Fhu\u002Fblog\u002Fhow-i-built-my-own-design-system-from-scratch","hu\u002Fblog\u002Fhow-i-built-my-own-design-system-from-scratch",{"title":49,"path":50,"stem":51},"A színek pszichológiája a felhasználói felületek tervezésében","\u002Fhu\u002Fblog\u002Fpsychology-of-color-in-ui-design","hu\u002Fblog\u002Fpsychology-of-color-in-ui-design",{"title":53,"path":54,"stem":55},"A lassú tervezés (Slow Design) létjogosultsága a felgyorsult digitális világban","\u002Fhu\u002Fblog\u002Fslow-design-in-fast-paced-digital-world","hu\u002Fblog\u002Fslow-design-in-fast-paced-digital-world",{"id":57,"title":58,"body":59,"description":60,"extension":61,"links":59,"meta":62,"navigation":63,"path":37,"seo":64,"stem":38,"__hash__":65},"pages\u002Fhu\u002Fblog.yml","Legfrissebb Cikkek",null,"Néhány gondolatom és észrevételem a dizájn, fejlesztés és a technológiai iparág világából.","yml",{},true,{"title":58,"description":60},"k-KIveZd8Y3jkkhNI-rJjRFSNDwDIjR8NDagRf3cGeg",[67,235,279,323],{"id":68,"title":41,"author":69,"body":73,"date":227,"description":228,"extension":229,"image":230,"meta":231,"minRead":232,"navigation":63,"path":42,"seo":233,"stem":43,"__hash__":234},"blog\u002Fhu\u002Fblog\u002Ffrom-mockup-to-market.md",{"name":70,"avatar":71},"Emma Thompson",{"src":72,"alt":70},"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1701615004837-40d8573b6652?q=80&w=1480&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",{"type":74,"value":75,"toc":209},"minimark",[76,80,83,88,91,96,99,105,109,112,116,119,132,136,139,143,146,150,153,181,185,188,192,195,199,202,206],[77,78,79],"p",{},"A sikeres digitális termékek létrehozása nem egy merev sablon követéséről szól – sokkal inkább egy rugalmas keretrendszer kialakításáról, amely alkalmazkodik minden projekt egyedi kihívásaihoz. Több tucat termék finomhangolása után kialakítottam egy olyan folyamatot, amely következetesen hozza az eredményeket, miközben teret hagy a kreativitásnak és az iterációnak.",[77,81,82],{},"Ebben a cikkben végigveszem a teljes tervezési folyamatomat a kezdeti feltárástól a fejlesztői átadásig, esettanulmányként használva a legutóbbi EcoTrack alkalmazáson végzett munkámat.",[84,85,87],"h2",{"id":86},"_1-fázis-feltárás-és-kutatás","1. Fázis: Feltárás és Kutatás",[77,89,90],{},"Minden nagyszerű termék annak a problémának a megértésével kezdődik, amelyet meg kíván oldani. Az EcoTrack esetében a kihívás az volt, hogy olyan lebilincselő módot találjunk a felhasználók környezeti hatásainak követésére, amely nem vált ki bűntudatot és nem terheli túl őket bonyolult adatokkal.",[92,93,95],"h3",{"id":94},"felhasználói-interjúk","Felhasználói Interjúk",[77,97,98],{},"12 potenciális felhasználóval készítettem interjút különböző demográfiai csoportokból, feltérképezve jelenlegi szokásaikat és a fenntarthatósághoz való hozzáállásukat. Ezek a beszélgetések rávilágítottak egy kulcsfontosságú szempontra: a legtöbb ember szeretne környezettudatosabb döntéseket hozni, de elbizonytalanítja őket a hatások kiszámításának összetettsége.",[100,101,102],"blockquote",{},[77,103,104],{},"\"Érdekel a környezetvédelem, de fogalmam sincs, hogy a papírzacskó tényleg jobb-e, mint a műanyag, vagy hogy az újrafelhasználható kulacsom jelent-e egyáltalán bármit.\" — Interjúalany",[92,106,108],{"id":107},"versenytárs-elemzés","Versenytárs Elemzés",[77,110,111],{},"Ezután elemeztem a létező fenntarthatósági alkalmazásokat, egy funkció-összehasonlítási mátrixot készítve a hiányosságok és lehetőségek azonosítására. A versenytársak többsége kizárólag a szénlábnyom kiszámítására összpontosított, de elmulasztott cselekvésre ösztönző útmutatást vagy pozitív megerősítést nyújtani.",[92,113,115],{"id":114},"a-siker-definiálása","A Siker Definiálása",[77,117,118],{},"Mielőtt megnyitottam volna a Figmát, együttműködtem az érintettekkel az egyértelmű sikermutatók meghatározásában:",[120,121,122,126,129],"ul",{},[123,124,125],"li",{},"A napi aktív használat 40%-os növelése",[123,127,128],{},"A környezeti hatások felhasználók általi megértésének javítása",[123,130,131],{},"Mérhető viselkedésbeli változások elérése legalább két fenntarthatósági kategóriában",[84,133,135],{"id":134},"_2-fázis-ötletelés-és-koncepcióalkotás","2. Fázis: Ötletelés és Koncepcióalkotás",[77,137,138],{},"A problématér szilárd megértésével léptem át a folyamat kreatív szakaszába.",[92,140,142],{"id":141},"vázlatkészítés","Vázlatkészítés",[77,144,145],{},"Mindig tollal és papírral kezdek, gyorsan feltárva a különböző megközelítéseket a digitális eszközök korlátai nélkül. Az EcoTrackhez három vázlatfüzetet töltöttem meg koncepciókkal a játékosított élményektől az adatközpontú vezérlőpultokig.",[92,147,149],{"id":148},"információs-architektúra","Információs Architektúra",[77,151,152],{},"A kutatási eredmények alapján felhasználóközpontú információs architektúrát fejlesztettem ki:",[154,155,156,163,169,175],"ol",{},[123,157,158,162],{},[159,160,161],"strong",{},"Vezérlőpult"," — Személyre szabott áttekintés azonnali hatásmutatókkal",[123,164,165,168],{},[159,166,167],{},"Napi Követő"," — Tevékenységek egyszerű naplózása azonnali visszajelzéssel",[123,170,171,174],{},[159,172,173],{},"Fejlődési Út"," — A folyamat vizualizációja az idő múlásával",[123,176,177,180],{},[159,178,179],{},"Cselekvési Központ"," — Személyre szabott ajánlások a felhasználói szokások alapján",[84,182,184],{"id":183},"_3-fázis-prototípus-készítés-és-tesztelés","3. Fázis: Prototípus-készítés és Tesztelés",[77,186,187],{},"A koncepcionális keret felállítása után a prototípus-készítés és tesztelés iteratív ciklusába léptem. A drótvázak tesztelése után interaktív prototípusokat fejlesztettem ki, egyszerűsített adatvizualizációval és azonnali pozitív megerősítésekkel.",[84,189,191],{"id":190},"_4-fázis-vizuális-tervezés-és-design-rendszer","4. Fázis: Vizuális Tervezés és Design Rendszer",[77,193,194],{},"A validált élményre építve kidolgoztam az arculatot és egy átfogó tervezési rendszert (Design System), beleértve a komponenskönyvtárat, a reszponzív layout irányelveket és az akadálymentességi szabványokat.",[84,196,198],{"id":197},"_5-fázis-implementáció-és-iteráció","5. Fázis: Implementáció és Iteráció",[77,200,201],{},"A tervezési folyamat nem ér véget a fejlesztés megkezdésével. Szorosan együttműködtem a fejlesztőkkel, részt vettem a kódátvizsgálásokban, és a bevezetés után is rendszeresen elemeztük a felhasználói visszajelzéseket.",[84,203,205],{"id":204},"eredmények","Eredmények",[77,207,208],{},"Hat hónappal az indulás után az EcoTrack felülmúlta a várakozásokat: 52%-os növekedés a napi aktív használatban, és a felhasználók 78%-a jobb megértésről számolt be a fenntarthatósági döntéseivel kapcsolatban.",{"title":210,"searchDepth":211,"depth":211,"links":212},"",2,[213,219,223,224,225,226],{"id":86,"depth":211,"text":87,"children":214},[215,217,218],{"id":94,"depth":216,"text":95},3,{"id":107,"depth":216,"text":108},{"id":114,"depth":216,"text":115},{"id":134,"depth":211,"text":135,"children":220},[221,222],{"id":141,"depth":216,"text":142},{"id":148,"depth":216,"text":149},{"id":183,"depth":211,"text":184},{"id":190,"depth":211,"text":191},{"id":197,"depth":211,"text":198},{"id":204,"depth":211,"text":205},"2025-04-23","Részletes betekintés az iteratív tervezési módszertanomba a kezdeti kutatástól a végső fejlesztői átadásig, gyakorlati tippekkel minden szakaszhoz.","md","https:\u002F\u002Fimages.pexels.com\u002Fphotos\u002F1050312\u002Fpexels-photo-1050312.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",{},8,{"title":41,"description":228},"WCZNHTmi_A3e9uGVvLoEbqYbklO8sVA39auASIE9_nI",{"id":236,"title":49,"author":237,"body":239,"date":272,"description":273,"extension":229,"image":274,"meta":275,"minRead":276,"navigation":63,"path":50,"seo":277,"stem":51,"__hash__":278},"blog\u002Fhu\u002Fblog\u002Fpsychology-of-color-in-ui-design.md",{"name":70,"avatar":238},{"src":72,"alt":70},{"type":74,"value":240,"toc":270},[241,244,247,250,253],[77,242,243],{},"A szín az egyik legerősebb eszköz egy tervező eszköztárában, mégis gyakran pusztán esztétikai kérdésként kezelik. A Wavelength zenei alkalmazás újratervezéséhez végzett A\u002FB tesztek során lenyűgöző felismerésekre jutottam arról, hogyan befolyásolja a színpszichológia közvetlenül a felhasználói viselkedést.",[77,245,246],{},"Amikor kezdetben elindítottuk az alkalmazást, élénk lila színt használtunk elsődleges cselekvési színként. A szín remekül mutatott a márkánk palettájával, de a konverziós mutatók elmaradtak a várakozásoktól. Különböző elsődleges színek tesztelését javasoltam, miközben minden más elemet változatlanul hagytunk.",[77,248,249],{},"Az eredmények magukért beszéltek: egy adott kék árnyalatra váltás 34%-kal növelte a felhívásra (CTA) kattintások arányát.",[77,251,252],{},"Színválasztási keretrendszerem:",[154,254,255,258,261,264,267],{},[123,256,257],{},"Gondold át, milyen érzelmi reakciót szeretnél kiváltani",[123,259,260],{},"Teszteld a színválasztásokat a célközönségeddel",[123,262,263],{},"Használd a színeket természetes vizuális hierarchia kialakítására",[123,265,266],{},"Vedd figyelembe a kulturális asszociációkat",[123,268,269],{},"Biztosíts megfelelő kontrasztot az olvashatóság és akadálymentesség érdekében",{"title":210,"searchDepth":211,"depth":211,"links":271},[],"2025-03-15","Hogyan befolyásolhatják a stratégiai színválasztások a felhasználói viselkedést, kelthetnek érzelmeket, és javíthatják a digitális termékek élményét.","https:\u002F\u002Fimages.pexels.com\u002Fphotos\u002F40799\u002Fpaper-colorful-color-loose-40799.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",{},5,{"title":49,"description":273},"nXFoSt9PMgKEMyWpyPP7Sa5Kdj3z55zhkxEpadFYkFs",{"id":280,"title":45,"author":281,"body":283,"date":316,"description":317,"extension":229,"image":318,"meta":319,"minRead":320,"navigation":63,"path":46,"seo":321,"stem":47,"__hash__":322},"blog\u002Fhu\u002Fblog\u002Fhow-i-built-my-own-design-system-from-scratch.md",{"name":70,"avatar":282},{"src":72,"alt":70},{"type":74,"value":284,"toc":314},[285,288,291,294,297,311],[77,286,287],{},"Miután éveken át minden projektet egy üres Figma fájllal kezdtem, végül belevágtam, és létrehoztam a saját átfogó design rendszeremet. A folyamat egyszerre volt kihívásokkal teli és hihetetlenül kifizetődő.",[77,289,290],{},"Öt korábbi projektem auditálásával kezdtem, azonosítva a közös mintákat és komponenseket. Ez olyan inkonzisztenciákra világított rá, amelyeket korábban észre sem vettem: hét kissé eltérő gombstílus, következetlen térközök és egyértelmű cél nélkül változó szövegstílusok.",[77,292,293],{},"Ahelyett, hogy előre megalkottam volna egy merev rendszert, egy valós ügyfélprojekten keresztül építettem fel. Az EcoTrack alkalmazáshoz tervezés közben dokumentáltam az egyes komponenseket, így egy élő rendszer jött létre.",[77,295,296],{},"A rendszerem magja:",[120,298,299,302,305,308],{},[123,300,301],{},"Rugalmas színrendszer szemantikus elnevezésekkel",[123,303,304],{},"Aranymetszésen alapuló tipográfiai skálák",[123,306,307],{},"Komponens-variációk egyértelmű használati irányelvekkel",[123,309,310],{},"Térköz- és elrendezési szabályok a konzisztencia megőrzésére",[77,312,313],{},"A legnagyobb kihívás nem technikai, hanem pszichológiai jellegű volt: megtanulni bízni a rendszerben ahelyett, hogy minden új problémára új megoldást találnék ki. Az eredmény azonban óriási: a tervezési folyamatom 40%-kal gyorsabb lett, és a fejlesztői átadás sokkal zökkenőmentesebb.",{"title":210,"searchDepth":211,"depth":211,"links":315},[],"2025-03-05","Gyakorlati útmutató a saját tervezési rendszer létrehozásához a kezdeti auditálástól a megvalósításig, és a folyamat során szerzett tanulságok.","https:\u002F\u002Fimages.pexels.com\u002Fphotos\u002F196644\u002Fpexels-photo-196644.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",{},6,{"title":45,"description":317},"mtjmjEluTLDWhvYV1Hi35Rof9l-Hz6InDDBRjqbfKEE",{"id":324,"title":53,"author":325,"body":327,"date":343,"description":344,"extension":229,"image":345,"meta":346,"minRead":347,"navigation":63,"path":54,"seo":348,"stem":55,"__hash__":349},"blog\u002Fhu\u002Fblog\u002Fslow-design-in-fast-paced-digital-world.md",{"name":70,"avatar":326},{"src":72,"alt":70},{"type":74,"value":328,"toc":341},[329,332,335,338],[77,330,331],{},"Nemrég egy olyan projektet vállaltam el, amely megkérdőjelezte a szokásos tervezési folyamatom szinte minden elemét. Egy kis irodalmi folyóirat olyan digitális platformot szeretett volna, amely arra ösztönzi az olvasókat, hogy lelassuljanak és mélyen elmerüljenek a tartalomban – a gyors fogyasztásra optimalizált weboldalak pontos ellentétét.",[77,333,334],{},"Ez elgondolkodtatott azon, amit \"lassú tervezésnek\" (slow design) nevezek: egy olyan megközelítésen, amely szándékosan teret enged a reflexióknak ahelyett, hogy azonnali interakciókat hajszolna.",[77,336,337],{},"A felhasználói tesztek lenyűgöző eredményt hoztak: az olvasók háromszor több időt töltöttek a cikkekkel, és sokkal jobb visszaemlékezésről számoltak be a folyóirat korábbi oldalához képest.",[77,339,340],{},"A bevonódási mutatók optimalizálása közben néha elfelejtjük, hogy a legértékesebb digitális élmények olykor nem azok, amelyek azonnali cselekvést követelnek, hanem azok, amelyek teret adnak a gondolatoknak.",{"title":210,"searchDepth":211,"depth":211,"links":342},[],"2025-01-28","Miért vezethet mélyebb interakciókhoz és jobb eredményekhez olyan digitális élmények tervezése, amelyek lelassulásra és elmélyülésre ösztönöznek.","https:\u002F\u002Fimages.pexels.com\u002Fphotos\u002F4050314\u002Fpexels-photo-4050314.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",{},7,{"title":53,"description":344},"spfvd_3oV-t16LCEYWKq40xzmgU_hyObtw0E8qepcdM",1787910657731]