• úvod
  • témata
  • události
  • tržiště
  • diskuze
  • nástěnka
  • přihlásit
    registrace
    ztracené heslo?
    KULHYUI design, design systémy, interakční design, ♥ Figma
    KULHY
    KULHY --- ---
    Btw tohle je pecka! Text baseline alignment…

    KULHY
    KULHY --- ---
    CUBICULA: Jasne ze muzu, jen jsem nebyl u kompu :)

    Me to funguje na jednicku.

    CUBICULA
    CUBICULA --- ---
    KULHY: Nu a nemuzes se podivat, jestli mas stejny problem? :)
    KULHY
    KULHY --- ---
    CUBICULA: Jses si jistej? Mam za to, ze to ukazovali primo live, ale treba se pletu…
    CUBICULA
    CUBICULA --- ---
    Component properties se nezobrazujou v inspectu. Všiml jsem si toho, až když jsem předělal půlku DS :/

    Jinak jako super update jaxvině
    RESK181
    RESK181 --- ---
    Ou yeah! Dark mode ON
    KULHY
    KULHY --- ---
    - password protected prototypes
    KULHY
    KULHY --- ---
    DAVVID: nz

    Jeste mi uniklo:

    - components properties (text, visibility of elements, instance override — drive se to resilo nekonecnym mnozstvim variant)
    - variable fonts
    - absolutni pozice uvnitr auto layoutu
    DAVVID
    DAVVID --- ---
    KULHY: dik za souhrn!
    KULHY
    KULHY --- ---
    Tak za co jsem se modlil neprislo, ale i tak hezka nadilka. Co me utkvelo:

    - negative spacing
    - moznost vybirat poradi vrstev pro kazdy auto layout
    - interskce se spacingem a paddingen primo na canvasu
    - moznost zapocitavat bordery do velikosti auto layoutu
    - indicidualni nastaveni stran borderu
    - dark mode
    KULHY
    KULHY --- ---
    KULHY
    KULHY --- ---
    TIKVIK: Procenta, sloupce a zalamovani objektu radku — muj sen do Figmy.
    TIKVIK
    TIKVIK --- ---
    OUKE: Animapp ti vysvihne celkem pouzitelnou strukturu v blocich, ale nema treba jedotky procenta, takze pro fluidni design menici se podle okna browseru musis opravovat pevne px jednotky velikosti workspace na procentualni. Tze width, min-width, paddingy apod. Ale pak to funguje celkem fajn. Plive to i breakpointy.
    KULHY
    KULHY --- ---
    OUKE: Prijde mi, ze cilem vetsiny tehlech metod je dorucit nejaky hruby, ale korektni a pouzitelny zaklad na handoff pro frontend. Nevim jestli te chapu spravne, ale funkcni web z toho nevypadne (ucesany prototyp ano). Dalsi stranka veci je, ze takovy zamer klade na designera vysoke naroky na spravnost struktury designu v editoru a cistotu prace obecne.

    Kdybys chtel neco co opravdu pracuje s html a css a daji se v tom udelat funkcni weby tak prozkoumej Webflow.
    DSTEPZ
    DSTEPZ --- ---
    OUKE: Anima je free to try, tak si to otesti. Btw k cemu html5? Potrebujes animace?
    KULHY
    KULHY --- ---
    KAJJAK: Jeste spis te asi bude zajimat primo ten push to nejakeho githubu nebo tak.

    Anima: Design to code | High-fidelity prototypes
    https://www.animaapp.com/
    KULHY
    KULHY --- ---
    KAJJAK: Tohle je pro me zatim trochu neprobadana puda. Rekl bych ze cesty na to jsou, ale vzhledem k povaze Figmy to asi neni uplne optimalni a dotazeny CSS. Figma uz v zakladu nabizi nejaky CSS readout v inspect panelu a pak jsou tu nejaky pluginy ktery to asi posouvaji dal (napr. CSSGen).

    Vetsinou je stejne potreba harmonckej tandem designera a frontendisty, aby si nastavili atomickej zaklad a pak uz se vesele sklada jen z nazvu komponent a jejich properties.

    KAJJAK
    KAJJAK --- ---
    KULHY:

    umi to pak nejak figma propsat primo do csska? nebo se tohle vse pak musi preklepat duplicitne rucne?
    KULHY
    KULHY --- ---
    KULHY: Ideal by byla nativni podpora ve Figme.
    KULHY
    KULHY --- ---
    Jak jste na tom s pouzivanim pluginu v paternich casetch design systemu na produkcni praci? Nebo pluginy pro produkcni praci obecne. Osobne se bojim, ze se to nekde v nejake verzi rozsype a ja budu muset opravovat cely design system.

    Hodne me laka zacit pouzivat Tokens:
    Figma
    https://www.figma.com/community/plugin/843461159747178978/Figma-Tokens

    Nejvic me laka uziti promenych spacingu a nestovani barev.

    Tady na Figma kanalu meli zajimavou demonstraci vyuziti Tokens na headless design system:
    In the file - Building a headless design system
    https://www.youtube.com/watch?v=yvblQEPGPkM


    Trochu monstrozita na me, ale rozhodne to je pusobive a ledacos se z toho da prevzit.
    Kliknutím sem můžete změnit nastavení reklam