Digitális tervezés

Strukturált design.
Szervezettség, átláthatóság, megnyerő külső. Egy cég életében ugyan olyan fontos jelzők ezek, mint egy jól működő weboldal vagy applikáció esetében. Tudásunkkal és szakmai partnereink közreműködésével segítünk, hogy a célt érj a digitális versenyben.
Szolgáltatások
Sitemap
Az új terméked funkciói és struktúrája kirakva, hogy egyértelmű legyen, mit tervezünk.
Mi szerepel az oldalon? Mik a funckiók? Milyen tartalmak kellenek az induláshoz? Az új oldalak strukturájának elkészítése közös munka során valósul meg, egy workshopon keresztül. A cél, hogy a készülő digitális termék tartalmainak elrendezésére készüljön javaslat.
Hogy készül a sitemap?
Content & Structure Workshop: Csapatmunka a zwoelf vezetésével (2 óra, a legfontosabb döntéshozók részvételével). A workshopot lead designerünk facilitálja, és minden alkalom egyedi, amelyet a te vállalkozásod igényeire szabjuk. A workshopról opcionálisan felvételt készítünk. A workshop végén kész sitemappel fogunk rendelkezni. Általában a workshop utáni héten 1 módosítási kört tartunk.
Átadás: Figma link, Figma file, vagy excel, megegyezés szerint.
POC, Drótváz vagy prototípus
Az új website-od vagy alkalmazásod első funkcionális vázlata.
A közös projektüntől függ, hogy drótvázról, vagy prototípusról beszélünk. Az első vázlat alkalmas használhatósági tesztelésre, üzleti validációra, vagy arra, hogy könnyebben prezentálhasd az ötleted. A drótvázak előlfeltételei annak, hogy megkezdhessük a User Interface tervezést.
Hogy készül a POC?
Drótváz tervezés, prototípus készítés: Egyszerű, de nagyszerű megoldás, hogy tesztelni tudjuk a terveinket. Mielőtt vizuális megoldásokat nyújtanánk, megvizsgálhatjuk a termék működését, és a legfontosabb döntéseket a felhasználói élménnyel kapcsolatban. A drótvázak arculati elemektől mentes semleges felület tervek, amik segítenek körbejárni a felhasználói útvonalakat. Az elkészült terveket prezentáljuk.
A UI tervezés megkezdésének alapfeltétele, hogy elfogadott drótvázakkal láthassunk neki a munkának. A drótvázakat általában egy az általad választott kijelző méretre készítjük el, amely lehet desktop vagy mobil felbontású. A terveket a Figma szoftverrel állítjuk elő. A tervezési munka időtartama alatt a visszajelzéseidet elsődlegesen a prezentációkon várjuk, de emellett lesz lehetőséged a szoftver segítségével kommenteket is hagyni számunkra. a folyamat során.
Reszponzív UI tervek
Pixelpontos, reszponzív webes felület tervek úgy, ahogy a fejlesztőid kérik.
A legújabb felmérések alapján az internetezők több mint 80%-a válaszolta, hogy elsődlegesen mobil készüléken böngészik. Ma már megkerülhetetlen, hogy a digitális termékek pixel pontosan, fejlesztésre készen, több kijelző töréspontra optimalizálva kerüljenek átadásra. A tervezés alatt kiemelt fókusszal figyelünk arra, hogy terveink ne csak szépek, de funkcionálisak legyenek. A terveinkben szimbólumokat és komponenseket használunk, így később könnyedén iterálhatóak. Igény esetén a forrásfile is átadásra kerül.
Hogy készül a User Interface?
Look & Feel tervezés: Kulcsvizuál, ami segít eldönteni a legfontosabb vizuális kérdéseket még a részletes tervezés előtt. Az általatok kijelölt drótvázak közül 2-3 képernyőre vizuális koncepciót készítünk a meglévő arculati rendszer alapján. Általában egy koncepciót szoktunk készíteni, de Igény esetén több variációt is szállíthatunk. Ezeket a look & feel terveket prezentáljuk, így élőben is van lehetőséged lesz a visszajelzésre. A tervek Figma-ban készülnek, a tervezés alatt a kommenteket is az applikációban várjuk.
WEB UI tervezés: A felületeket elfogadott drótázak és kulcsvizuál alapján készítjük, Figma-ban. A tervezés közben visszajelzést az applikációban van lehetőség adni kommentek formájában. A UI terveket amikor elkészültek prezentáljuk, így élőben is van lehetőség a visszajelzésre. A tervezés a projekt méretétől függően 2-4 hetet igényel. Kijelzőméretek: Desktop (1440px széles); Tablet (768px széles); Okostelefon (360px széles). Átadás: Figma link, igény esetén a forrásfile is átadásra kerül.
Fejlesztés támogatás: Igény esetén a terveinket részletesen bemutatjuk, és átadjuk a frontend fejlesztőidnek. A felmerülő technológiai kérdésekre válaszolunk egy 1 órás meeting keretein belül. Egyedi megegyezés alapján a teljes fejlesztési folyamatot támogatjuk, (konzultálunk veletek és a fejlesztőkkel a sprintjeitek közben.)
A UI tervezése során az alábbi tételeket az ajánlatunk nem foglalja magában, külön tételben megrendelhetőek.
❌ Elfogadott drótvázak módosítása
❌ Webszövegírás
❌ Stock fotók gyűjtése
❌ Képek retusálása
❌ Illusztrációk, egyedi ikonok
❌ Animációs feladatok
Amennyiben igényled, egyedi megállapodás szerint vállaljuk.
Applikáció UI tervek
Pixelpontos, alkalmazás felület tervek úgy, ahogy a fejlesztőid kérik.
Desktop, Mobil készülék, Tablet, TV, okosóra, vagy amire szükség van. Natív alkalmazás tervezése desktopra, mobil készülékekre, tabletre, TV-re, okosórára, vagy amire szükség van. A tervezés közben figylemebe vesszük az adott eszköz szabályait és keretrendszereit (pl. Human interface guidelines, vagy Material Design), így biztosítva, hogy fejleszthető és funkcionális alkalmazás szülessen. A terveinkben szimbólumókat és komponenseket használunk, így később könnyedén iterálhatóak. A felületeket elfogadott drótázak és kulcsvizuál alapján készítjük Figma-ban. A tervezés közben visszajelzést az applikációban van lehetőség adni kommentek formájában. A UI terveket amikor elkészültek prezentáljuk, így élőben is van lehetőség a visszajelzésre. Igény esetén a forrásfile is átadásra kerül.
Hogy készül a User interface?
Look & Feel tervezés: Kulcsvizuál, ami segít eldönteni a legfontosabb vizuális kérdéseket még a részletes tervezés előtt. Az általatokl kijelölt 2-3 kulcsképernyő vizuális tervei. Általában egy koncepciót szoktunk készíteni, de Igény esetén több variációt is szállíthatunk. A look & feel terveket prezentáljuk, így élőben is van lehetőség a visszajelzésre. A tervek Figma-ban készülnek, a tervezés alatt a kommenteket is az applikációban várjuk.
Applikáció UI tervezés: A felületeket elfogadott drótázak és kulcsvizuál alapján készítjük, Figma-ban. A tervezés közben visszajelzést az applikációban van lehetőség adni kommentek formájában. A UI terveket amikor elkészültek prezentáljuk, így élőben is van lehetőség a visszajelzésre. A tervezés a projekt méretétől függően 2-4 hetet igényel.
Kijelzőméretek: Desktop (1440px széles); Tablet (768px széles); Okostelefon (360px széles), TV (1280x720px, skálázható), Okosóra (198px széles)
Átadás: Figma link, igény esetén a forrásfile is átadásra kerül.
Fejlesztés támogatás: Igény esetén a terveinket részletesen bemutatjuk, és átadjuk a frontend fejlesztőidnek. A felmerülő technológiai kérdésekre válaszolunk egy 1 órás meeting keretein belül. Egyedi megegyezés alapján a teljes fejlesztési folyamatot támogatjuk, (konzultálunk veletek és a fejlesztőkkel a sprintjeitek közben.)
A UI tervezése során az alábbi tételeket az ajánlatunk nem foglalja magában, külön tételben megrendelhetőek.
❌ Webszövegírás
❌ Stock fotók gyűjtése
❌ Képek retusálása
❌ Illusztrációk, egyedi ikonok
❌ Animációs feladatok
Amennyiben igényled, egyedi megállapodás szerint vállaljuk.
Design system könyvtár
Új terméked részletgazdag, skálázható komponenstára a UI tervek alapján. A készlet későbbi fejlesztéseidben is a segítségedre lesz!
A design system kifejezéssel már biztos, hogy találkoztál. Egy egységes szabályrendszer, ami gördülékennyé teszi a tervezés és a fejlesztés között utat. Terveink mellé külön komponens és stílus könyvtárat készítünk. Ez a file sokat segíthet a későbbi projektekben is, és akkor is, ha később talán egy globális változtatást kell eszközölni a már elkészült terméken vagy új terméket szeretnétek létrehozni.
Terveink a legújabb technológiai trendek alapján komponensekkel és variánsokkal készülnek Figma-ban, igény esetén a forrásfile is átadásra kerül.
Hogy készül a Design System?
Design System tervezése: Az elkészült UI tervek alapján külön könyvtárban létrehozzuk a terméked stílus és komponenskönyvtárát.
A design system általában magában foglalja:
Stíluslap
Színek
Betűstílusok
Ikonok
Árnyék használat
Szabályok
Gridrendszer
Lekerekítések
Eltartások
Kattintható elemek
Gombok
Linkek
Kitöltőelemek
Kitöltő mezők
Tabok
Navigációs elemek
Sablonok
A tervezés során elkészül komponensek és sablonok gyűjteménye
A UI tervek elfogadása után, a design system létrehozása a projekt méretétől függően 1-2 hét.
Átadás: Figma link, igény esetén a forrásfile is átadásra kerül.
Fejlesztés támogatás: Igény esetén a terveinket részletesen bemutatjuk, és átadjuk a frontend fejlesztőidnek, a felmerülő technológiai kérdésekre válaszolunk egy 1 órás meeting keretein belül. Egyedi megegyezés alapján a teljes fejlesztési folyamatot támogatjuk, (konzultálunk veletek a fejlesztési sprintjeitek közben.)
A Design System tervezése során az alábbi tételeket az ajánlatunk nem foglalja magában, külön tételben megrendelhetőek.
❌ A projekt scopejára nem kiterjedő elemek használatára vonatkozó definíciók
❌ Frontend fejlesztés
❌ Design System 3rd party rendszerekkel való összekötése
Amennyiben igényled, egyedi megállapodás szerint vállaljuk.
Last updated