Ugrás az oldal tartalmára

keeteean webdesigner

Megrajzolni és életre kelteni

Ha érdekelt már a vizuális tervezés, hogyan készülnek az illusztrációk, kíváncsi vagy mi mozgatja a weboldalakat. Ha foglalkoztatott már az, hogy mi izgalmas lehet a pixelek tologatásában vagy a kódsorok böngészésében, akkor jó helyen jársz.

  • #webdesign
  • #frontend

Kreatív eszközeim

Kedvenc grafikus alkalmazásaim, melyek segítségével szoktam különböző grafikai elemeket tervezni, animációkat készíteni és mindezeket fizikai eszközökön prototípusként bemutatni.

  • Affinity Designer

    Jelenlegi kedvenc rajzoló programom. Mindent tud, ami a komplex vektoros és raszteres képek és designok készítéséhez kell. Méghozzá mindezt olyan intuitíven, gyorsan és fluid élményt biztosítva teszi, amiben bizony már régen lehetett részünk. Ráadásul közel 100%-os AI és PSD kompatibiltással rendelkezik!

    Képernyőkép az Affinity Designerről.
  • Affinity Photo

    Az Affinity Designer tökéletes párja, melynél a fotók és raszteres képek állnak a középpontban. A két alkalmazás gördülékeny együttműködése olyannyira példaértékű, hogy az esetek nagy részében nem számít, hogy ténylegesen melyik alkalmazást használjuk! Míg a Photo raszteres képek, fotók szerkesztésében, addig a Designer a vektorgrafikában az erősebb.

    Képernyőkép az  Affinity Photo-ról.
  • Pixelmator Pro

    Az egyedi de mégis intuitív kezelelőfelületének hála nagyon egyszerű használni. Hihetetlenül kis helyet foglal, gyors és gördülékeny vele minden művelet. Ráadásul tele van automatikus intelligens eszközökkel. S még a nem túl összetett PSD fájlokkal is elboldogul. Én leginkább gyors képszerkesztésre használom.

    Képernyőkép a Pixelmator Pro-ról
  • Sketch

    Atomic designra épülő egyszerű vektorgrafikus alkalmazás, mely napjainkra az - Mac-es környezetekben - az elsőszámú mobil app és webdesigner alkalmazássá nőtte ki magát. Fájlok közötti szimbólum támogatással, nem destruktív alakzat kombinálással és egyszerű prototípus készítéssel is rendelkezik. Külső bővítményekkel rendkívül jól moddolható. Én többnyire design összeállításra, SVG szerkesztésre és asset generálásra használom.

    Képernyőkép a Sketch-ről.
  • Flinto

    Elsősorban mobil és webes app prototípus készítő alkalmazás; de egyéb animációkat készíthetünk vele. Egyszerűbb elemeket a Flintoban is elkészíthetünk, ám összetettebbekhez Sketch-re lesz szükségünk. Csupán prezentációs eszköz: a végterméket videó felvételként megoszthatjuk vagy macOS-en és iOS-en tudjuk interaktívan kipróbálni.

    Képernyőkép a Flinto-ról.
  • Hype

    Animációs és interaktív alkalmazás készítő alkalmazás, melynek segítségével akár kód írás nélkül készíthetünk animációt, prototípust, interaktív alkalmazást, animált weboldalt, HTML5 videót vagy animált GIF-et. Támogatja a reszponzív tervezést, fizikai szimulációt és a JavaScript alapú vezérlést is.

    Képernyőkép a  Hype-ról.
  • Motion

    Az Apple videó effektus és animáció készítő alkalmazása nem csak a kiváló vágóprogramjának: a Final Cut-nak az ajánlott kiegészítője, de önmagában is simán megállja a helyét. Szerintem a legkönnyebben kezelhető keyframe alapú effektus és animáció készítő alkalmazás, mely animált prototípus készítéshez sem utolsó.

    Képernyőkép a Motion-ról.

Fejlesztői eszközeim

Kedvenc kódmágus alkalmazásaim, melyek nélkülözhetetlen munkatársaim minden kód alapú projektjeim során. Segítségükkel még az undok kódsorok is barátságosabbá szelidülnek.

  • Visual Studio Code

    Mostanában a Microsoft Visual Studio platformfüggetlen kistesója lett a kedvenc kódszerkesztőm. Többnyire gyors, akadozás mentes, szép és tele van okos megoldásokkal alapból, amit további kiegészítőkkel még tovább lehet bővíteni.

    Képernyőkép a Visual Studio Code-ról.
  • PhpStorm

    Ez egy Java alapú szörnyeteg PHP / frontend fejlesztéshez. Nagyon sokat tud (bővítményekkel még tovább bővíthető) és aránylag jól használható a különböző programnyelvi és keretrendszer specifikus dolgoktól kezdve az automatizmusokon át a verziókezelésig.

    Képernyőkép a PhpStormról.
  • iTerm

    Napjainkban egy webfejlesztő már nem nélkülözheti a parancssoros felületet. Én erre a macOS kissé fapados Terminál appja helyett az iTermet használom a testreszabhatósága, rugalmassága és kényelmi funkciói miatt.

    Képernyőkép az  iTermről.
  • Tower

    Webes projektek verziókezeléséhez és közös munkához szinte mindenki a Gitet használja. Ha nem parancssorból vagy egy IDE-ből gitezek, akkor többnyire Tower az én Git kliensem, bár még lenne hova fejlődnie…

    Képernyőkép a Towerről.
  • Transmit

    Fájlok távoli gépek közötti mozgatására, kezelésére a macOS legnépszerűbb hálózati fájlkezelőjét használom. Letisztult megjelenésének és elegáns megoldásainak köszönhetően használata intuitív, számomra az unalmas fájlműveletek is sokkal élvezetesebbek.

    Képernyőkép a Transmitről.