Hogyan segítsd a fejlesztőt 2.

Egy grafikus gondolatai a leadott grafikákról 2. rész

…ha ilyen nyűg ez Photoshop, akkor mi van helyette?

Semmi. Marad a Photoshop. Ezt csak azért mondom, mert a cím még mindig az, Hogyan segítsd a fejlesztőt. Ahhoz, hogy bevezess egy új célszoftvert, amiből majd a builder felépíti a webes, mobilos felületet, a fejlesztői oldal edukálása is szükséges. Az nagyon örvendetes, hogy te elkezdesz használni egy új eszközt, ami megkönnyíti mindennapjaidat, de ezt a játékot még mindig csapatban játsszuk.

Összevonhatod a kettőt, de még nem nagyon láttunk olyat, aki magas szinten ért a graphic designhoz és a sitebuildhez is. Valójában ez két szakma: graphic designer és frontendes.

Hangzott a válasz a korábbi poszt végén Gully kérdésére, hogy van-e még olyan grafikus, aki nem készít sitebuildet. Ez hát a könnyek oka! Ki és mire használja? Másra a grafikus és másra a fejlesztő. Alapvetően 5 féle felhasználási módot lehet megkülönböztetni az alkalmazott webes grafikában:

UI tervezés (Felhasználói felület tervezése)
Grafikai tervezés
Ikon tervezés
Képszerkesztés
Digitális festészet
+1 a betűtípus tervezés – de az már egy másik szakma

Ami számunkra most érdekes – mert a fejlesztő is érintett benne –, az az első három pont.
Nézzük mik azok az általam ismert programok amik le–, kiválthatják a Photoshopot?

Sketch

Ára: ~40 000 Ft egyszeri alkalommal

Mit is mondhatnék? A felülettervezés meghatározó szereplőjévé nőtte ki magát az elmúlt években, és egy nagyszerű alternatíva, ha Macen dolgozol. PC-re nem is lesz, mert speciálisan OS X alapokra építették, habár akkor jó lenne, ha nem lenne bugos, de mik ezek a problémák egy Photoshop összeomláshoz képest?!

A Sketch mostanában verhetetlen a felülettervezésben. Drótvázból könnyen lesz grafikai felület, mindez egy könnyen kezelhető és átlátható felületen, és ha megtanultad az apró trükköket: igazán gyorsan. Egyszerűen tényleg arra tervezték, hogy megkönnyítse a mobilra– és webre tervezők életét. Vektoros grafikák és ikonok készítésére is kiválóan alkalmas, de ahogy ebben az összefoglalóban is olvasható, nem ez az erőssége ennek az appnak.

Ha pedig a Sketch mellé még a Zeplint is használjátok a fejlesztőkkel, akkor lényegesen könnyebb lesz az életetek.

Illustrator

Ára: 6 500 Ft/hónap licencenként

Illustrator?! Bármilyen furcsa az Illustrator is egy tökéletes program lehetne. Stílusok, színek, szimbólumok gyors módosítása. Felülettervezésben az artboardok már óriási segítséget nyújtanak, és a csoportos .svg exportálás nélkül nem is tudom, hogy tudtam eddig létezni?!

A vektoros grafikák és ikonok készítésének terén 20 év tapasztalattal a háta mögött nem kell túl sokat beszélni róla. A probléma vele, hogy a fejlesztői oldalon kevesen használják olyan magabiztosan, mint a Photoshopot, így bármilyen egyszerű is vele a módosításokat elvégezni, a .psd-ébe kimentett formátumban sajnos elvesznek azok a beállítások, amik a lelkét adták a fájlnak.

Affinity Designer

Ára: ~12–15 000 Ft egyszeri alkalommal

Októberben élesedett a 1.5-ös verziója Windowsra is. Ha eddig aktív felhasználója voltál a Photoshop és Illustrator kombónak, akkor ezt épp neked találták ki. Számos billentyűkombinációt vettek át, hihetetlenül gyors, egyszerre tudsz benne vektoros és raszteres dolgokat szerkeszteni, és az artboardjai intelligensen, reszponzívan kezelik az előre és jól beállított szimbólumokat, elemeket.

Meg kell szokni a használatát, de ez egy gyors folyamat lesz, és ha a fejlesztőkkel együtt elköteleződtök a program használata mellett, akkor nem pluginokkal kell majd asseteket mentegetni. Ezen felül még az átállási szakaszt is megkönnyíti, hogy ha minden kötél szakad .psd-ébe is tudsz exportálni belőle. Hmmm, sokat lehetne róla áradozni, de ha még nem ismerted, az árát tekintve is megér egy próbát.

Avocode

Ára: 3 300Ft/hó felhasználónként

Igazából ez egy kakukktojás, mert nem tudsz benne grafikát készíteni. Ez inkább a korábban említett Zeplin alternatívája, de mivel volt hozzá szerencsénk, beraktam az összefoglalóba. Ahogy a szlogen mondja, ez egy közös felülete a grafikusoknak és a fejlesztőknek.

A program célja, hogy feltöltöd a .psd-ét, majd az átkonvertálja egy olyan formátumba amiből könnyen ki tudja nyerni a builder. Távolságok, eltartások, színek, betűtípus, mindezt akár már CSS-ként is. Plusz előnye, hogy kezeli a smart objecteket, és akár különböző méretben is ki lehet menteni belőle .svg-ként az elemeket.

Sajnos a desktop program kicsit lassú, ha bonyolultabb Photoshop fájlt kell megnyitni vele, és olykor el is hasal a program. Viszont van benne verziókövetés, és külső linket is lehet küldeni a feltöltött fáljról, ahol lehet kommentálni az esetleges változtatásokat, észrevételeket. Összességében egy remek kiegészítő, de a gyermekbetegségei egy profi frontendest inkább csak zavarni fognak.

+1 Subform

Nagyon szép dolgokat lehet írni és még meggyőzőbb videókat készíteni. Ám, ha csak a töredéke is valóra válik azokból a dolgokból, amiket ez az app ígér, akkor van remény, hogy végre lesz egy olyan eszköz a grafikusok kezében is, amivel élmény lesz dolgozni mindkét oldalnak.

Grafikai konvenciók

És hogy miért beszéltem eddig feltételes módban a váltásról? Azért mert hiszek benne, hogy nem a szoftvertől lesz kevesebb a súrlódás közted és a builder között. Minden projekt elején le kell ülni, és lefektetni azokat a direktívákat, amik mentén készülnek majd a tervek. Íme egy kérdéscsokor, amiket ha az elején meghatároztok, akár Photoshopban is dolgozhattok az idők végezetéig, csak tartsátok magatokat a vállaltakhoz. Ne feledd, a grafikával nincs vége a munkának!