Kaip naudoti bibliotekas Figma? | Figma pradedantiesiems #6

Kaip sukurti stilių ir komponentų bibliotekas Figma? Kaip juos naudoti savo failuose ir dalintis su kitais komandos nariais? Atsakymą rasite šiame straipsnyje. Naudojant stilius, lengviau išlaikyti nuoseklumą komandos projektuose. Skaitykite toliau.

Bibliotekos Figma – turinys:

1. Stiliai
2. Komponentai
3. Stilių ir komponentų publikavimas bibliotekoje

Stiliai

Tai yra savybių rinkiniai, kurie gali būti taikomi sluoksniams projektuose. Norėdami sukurti stilių, pirmiausia turite pasirinkti objektą, kurio savybes norite išsaugoti. Tada spustelėkite Stilių ikoną Savybių paneelyje šalia pasirinktos savybės, tada spustelėkite + ikoną.

Atidarys langas, kuriame turėsite įvesti kuriamo stiliaus pavadinimą. Spustelėkite Sukurti stilių.

Jūs matysite sukurtus stilius Savybių paneelyje, kai nebus pasirinkta jokių objektų.

Redaguoti stilius paneleyje galite pridėti aprašymą ir redaguoti kiekvieno stiliaus savybes. Kiekvieną kartą, kai pakeisite pasirinkto stiliaus savybes, šie pakeitimai bus taikomi visiems objektams, kurie jį naudoja.

Galite sukurti šiuos stilius:

Spalvų (dažų) stiliai – užpildymams ir kontūrams, tekstui ir fonams, netgi vaizdams ir gradientams.

Teksto stiliai – dėka teksto stilių galite apibrėžti stilius antraštėms ir pagrindiniam tekstui. Galite taikyti teksto stilius visam teksto blokui arba tik daliai teksto bloke. Galite apibrėžti: šriftų šeimą, dydį, eilutės aukštį, tarpus.

Pastaba: su teksto stiliais negalite nustatyti teksto lygiavimo.

Efektai – čia galite apibrėžti šešėlio ir neryškumo atributus.

Išdėstymo tinklai – kuriant Išdėstymo tinklų stilius, tai naudinga, jei norite pakartoti tam tikrą struktūrą keliuose projektuose.

Norėdami taikyti stilių aktyviam sluoksniui, spustelėkite Stilių ikoną Savybių paneelyje šalia pasirinktos savybės ir pasirinkite stilių iš sąrašo.

Norėdami pašalinti stilių iš aktyvaus sluoksnio, spustelėkite Atsijungti stilius. Tai naudinga, kai norite atlikti pakeitimus objekte, nesikišdami į stilių.

Užduotis 6.1. Praktikuokite stilių kūrimą Figma. Sukurkite stilius skyriaus antraštėms pagrindiniame puslapyje, produktų pavadinimams ir kainoms.

Komponentai

Tai yra jūsų dizaino statybiniai blokai, kuriuos galite pakartotinai naudoti. Jie gali būti ikonėlės, mygtukai ar sudėtingesni elementai. Komponentai padeda išlaikyti jūsų dizainus nuoseklius ir leidžia greitai atlikti pakeitimus keliuose failuose ir projektuose.

Norėdami sukurti komponentą, pirmiausia turite pasirinkti sluoksnius, kurie sudarys komponentą, ir tada spustelėti Sukurti komponentą Įrankių juostoje.

Komponentų sluoksniai bus įterpti į specialų rėmą ir pažymėti violetine spalva, todėl galėsite lengvai juos atskirti nuo kitų sluoksnių Sluoksnių paneelyje.

Komponentai automatiškai gauna pavadinimus. Galite pervadinti komponentus Sluoksnių skirtuke. Kaip ir kitų sluoksnių atveju, dukart spustelėkite pavadinimą. Pasirinkę komponentą Savybių paneelyje, galite pridėti komponento aprašymą ir Dokumentacijos nuorodą komandos nariams.

Galite peržiūrėti komponentus Turto skirtuke Sluoksnių paneelyje.

Užduotis 6.2. Praktikuokite komponentų kūrimą Figma. Sukurkite šiuos komponentus:

• paieškos juostą – sudarytą iš užpildymo, didinamojo stiklo ikonėlės ir “Ieškoti” teksto,
• apatinę juostą – sudarytą iš stačiakampio ir ikonėlių,
• CTA mygtukus – sudarytus iš stačiakampio ir teksto.

Stilių ir komponentų publikavimas bibliotekoje

Kai sukuriate stilius ir komponentus, turite prieigą prie jų tik dabartiniame faile. Norėdami naudoti stilius ir komponentus kituose failuose, galite juos publikuoti bibliotekoje. Galimybė dalintis stiliais yra prieinama Įrankių juostoje – išplėskite meniu šalia failo pavadinimo ir spustelėkite Publikuoti stilius ir komponentus.

Jūs ką tik sužinojote, kaip naudoti bibliotekas Figma. Taip pat skaitykite: Ką veikia UX dizaineris?

Jei jums patinka mūsų turinys, prisijunkite prie mūsų užimtų bičių bendruomenės Facebook, Twitter, LinkedIn, Instagram, YouTube, Pinterest.