Kugadzira hungwaru kunoreva dhizaini nekurongeka: kana zvinhu zvanzi zvakafanana kune wese munhu, timu inoshanda mushe uye kutakura kunomhanya pasina kurova. MuFigma, izvi zvinoturikira mukutora zita rakajeka rezvikamu, zvikamu, masitayera, zvinosiyana, uye nyika, kuitira kuti chero munhu anzwisise kuti chinhu chimwe nechimwe chiri papi. Kugadza mitemo inowirirana yekutumidza mazita kunowedzera kukurumidza, kunodzivirira kuvhiringidzika, uye kuchengetedza maonero akafanana. mune chero chirongwa, kubva kune yakapusa UI kit kuenda kune yakakura dhizaini system.
Mugwaro rese iri, iwe uchaona nzira yekuvaka yakazara taxonomy inovhara zvese kubva kumhando yemhando uye zvimiro zvavo kusvika pakutumidza girama, chimiro, uye kuronga. Iwe unozodzidza zvakare maitiro ekukwirisa Figma AI kutumidzazve maseru muhuwandu uye kuita zvinosiyana senge tokens inogoneka yekugadzira dhizaini uye prototyping. Pfungwa ndeyokuti iwe unopedzisira wava nemutauro wakajairika, unoshanda waunogona kukwira zvisina musono..
Izvo zvekutanga: nei nomenclature yakakosha mune dhizaini system
Usati waenda mune zvakadzama, zvakakosha kumisa iyo dhizaini: dhizaini sisitimu muFigma inounza pamwechete zvikamu, masitayipi uye mitemo inotsanangura iyo interface. Kutsanangura mazita nguva dzose muhurongwa hwese kwakakosha pakuchengetedza kuenderana uye kushanda zvakanaka.Nenzira iyo, raibhurari yako haiite nyonganyonga yemabhatani anenge akafanana asi anodaidzwa nechiuru chemazita akasiyana.
Mukati meiyo sisitimu, zvivakwa uye hunhu hwazvo ndizvo zvakakosha: ruvara, typography, spacing, saizi, nyika, modes… Kunyanya kuenderana iwe mukupa zita chivako chimwe nechimwe uye kukosha kwega kwega, zvichave nyore kushandisa nekuchengetedza chitarisiko chose. muzvikamu zvose zvechigadzirwa.
Kurongeka kunoshanda kwezvikamu uye masitayera
Paunenge uchishanda nezvikamu, kushandisa mazita anotsanangurwa uye anofanotaurwa anokuchengetedza nguva yekutsvaga nekunzwisisa zviitiko. Kune mabhatani, semuenzaniso, siyanisa rudzi uye chinangwa (yekutanga, yechipiri); uye wedzera mamiriro (semuenzaniso, zvakajairika kana kutenderera) pazvinenge zvakakodzera.
Nezvidhori, zvakanakisa kudzivirira generic se "Icon 123". Sarudza mazita anozivikanwa se "tsamba", "ngoro", kana "network" Vanofanira kutsanangura zvavari pamusoro pasina kuvhura layer. Kujeka ikoko kunokosheswa kana uchisefa muraibhurari uye kana uchiongorora kubva kuDev Mode.
Nezvekudyidzana kwezvikamu, zvipe mazita kuitira kuti zvisiyaniswe zvisina tsarukano: semuenzaniso, bhatani guru pakuzorora uye vhezheni yaro ye hover inofanira kusiyaniswa zvakajeka. Kushandisa chivakashure kana chigadziriso chehurumende kunoita hunyengeri (semuenzaniso, chekutanga/yekutanga-hover).
Kana iwe uchitonga anopfuura imwe dhizaini system yakafanana, tarisa iwo hierarchy. Kusiyanisa pakati pe "main" set ne "secondary" seti inodzivirira kusanganisa zvidimbu zvisiri pamwe chete.kunyanya mumasangano ane ma brand akawanda kana verticals.
Mabhenefiti ekuenzanisa mazita pakati pekugadzira nekusimudzira
Kuita kuti timu yese ishandise mutauro mumwechete kunoderedza kupokana: kana mugadziri achiverenga zita rekuti uye rinoenderana nechiratidzo kana kirasi mukodhi, kuita kwakatwasanuka. Nomenclature ndiyo glue inobata pamwechete kubatana pakati pezvirango. uye inopfupisa kutenderera kwekuongorora.
Uyezve, kana yasvika nguva yekuongorora kana kuyera sisitimu, kuona uye kuisa mumapoka zvinhu zviri nyore kana mitemo yekupa mazita yakashandiswa nguva dzose. Nominal consistency inoshandura mukuchengetedza uye kuchengetedza mari kupfuuridza nguva.
Matanho ekuvaka yako dhizaini system faira muFigma
Kuvaka hurongwa hwakasimba haisi nyaya yenguva, asi pane nzira yakajeka yaunogona kutevera kuitira kuti usarasika munzira. Tanga nezvakakosha uye nyora sarudzo yega yega kuti igovane.
- Inventory yezvinhu zvakakosha: tsanangura zvauri kuzomisa (palette, mafonti, zvikero zvepakati, zvakakosha semabhatani, mapipu, makadhi…). Clear scope inodzivirira kushandazve gare gare.
- Faira yakatsaurirwa kune system: inogadzira chaiyo faira inoshanda sesosi yechokwadi. Kupatsanura raibhurari kubva kumapurojekiti kunovimbisa kuti shanduko dzinodzorwa zvirinani uye kushandurwa..
- Batanidza nemaitiro: inoronga zvikamu uye zvakasiyana-siyana zvichienderana negungano rakasarudzwa. Zita rinofanira kuratidza rudzi, chinangwa, uye chimiro kana rabata.
- Tsanangura masitayeraZvitaera zvemavara, mavara, uye mhedzisiro ine mazita anoenderana saka iwo anowanikwa zviri nyore. Inoshandisa girama imwechete uye maitiro ekubatanidza mazwi..
- Nyora kushandiswa: wedzera manotsi pamusoro pekushandisa chidimbu chimwe nechimwe, miganhu, uye mienzaniso. Nhungamiro yakajeka inoita kuti zvive nyore kune sangano rose kugadzira "pamhepo yakafanana".
Taxonomy: zvikamu, zvinhu, zvivakwa, uye kukosha
Kuti glossary ishande, iwe unofanirwa kutanga waziva kuti zvikamu zvipi zvauri kutaura nezvazvo uye kuti zvinodyidzana sei kune mumwe nemumwe. Iyi taxonomy ichashanda semepu yekuona kuti hausiyi chero yakasununguka..
Zvikamu: base uye makomboni
Mumashoko eFigma, chikamu ibhuroka ine chiziviso chayo mukati meUI kit (sekadhi). A base component chimedu chakagadzirirwa kugara mukati mevamwe. (Semuenzaniso, bhatani renhamba rinongowanikwa mukati memutengi wemazuva). Mamwe maraibhurari anoanyora semidziyo, zvimedu, zvikamu, zvinhu, kana zvikamu zviduku: pfungwa yacho yakafanana.
Zvinhu: midziyo uye zvinhu
Chiro (chinhu) ichidimbu chiri mukati mechikamu. Kune mapoka maviri makuru: midziyo (mabhokisi, zvikamu) uye zvinhu (zviri mukati)Pakati pezvinhu zvauchawana zvinyorwa (label, title, subtitle, caption), zvimwe zvikamu (icons, mifananidzo, mabhatani, matafura), vectors (denderedzwa, rectangle, polygon) uye midhiya (mufananidzo, gif, vhidhiyo).
Properties uye tsika
Izvo zvivakwa zvikamu zvakasiyana (saizi, nyika, ruvara, density, nezvimwewo). Nzvimbo imwe neimwe inopa seti yezvinogona kukoshaSemuenzaniso, iyo "state" pfuma yebhatani inogona kunge yakajairika, hover, kudzvanywa, kuremara ...
Kune mhuri mbiri dzezvakakosha: zvakasiyana uye booleans. Musiyano mumwe unotsigira zvinopfuura zviviri zvingasarudzwa (xs/s/m/l, kana info/chenjedza/kukanganisa), nepo boolean ichimiririra yakajairika hongu/kwete (Chokwadi/Nhema, Pa/Kudzima, ShowIcon/HideIcon).
Kutumidza chimiro: modifiers uye chinzvimbo chavo
Kana wanyatsojeka pamusoro pezvauri kupa zita (chikamu, chinhu, pfuma kana kukosha), unofanira kusarudza kuti ungamaka sei kusiyana kwavo. Mamodhifita anobatsira kusiyanisa zvakasiyana, nyika, uye mamiriro.
Mhando dzema modifiers
Pane nzira dzakati wandei dzekuchinja zita. Iwe unogona kushandisa zvidhori, zviratidzo, kana mazwi makuru. kusimbisa kuverenga kwako:
- Icon: semuenzaniso, chiratidzo pamberi kuratidza zvinoshandiswa kana chimiro (chete kana komputa yako ichitsigira nekuinzwisisa).
- Zviratidzo zvepunctuation: prefixes kana kupatsanura senge ._Base kana sub-level mamaki.
- Mazwi, acronyms uye zvipfupiso: suffixes seItem-List, Cell-Header, ShowIcon, BC_…
Chinhu chakakosha ndechekuti gungano rakajeka uye rakanyorwa. Kana ukabatanidza modhifita mhando, tsanangura zvinonyanya kukosha uye makesi ekushandisa. kudzivirira kusanganiswa kwechaotic.
Modifier chinzvimbo
Kurongeka kunofanirwa kuenderana mukati mese system. Unogona kuisa iyo modifier pamberi (Item-Rondedzero) kana mushure (Rondedzero-Chinhu)Chinhu chakakosha hachisi chekuchinjana pakati pemapatani ese pasina zano rakajeka.
Grammar yemazita: mhando, nhamba, mavambo uye mibatanidzwa
Kugadzirisa girama kunoita kuti mazita averengeke uye agone kufanoziva. Sarudza kamwe chete uye shandisa nguva dzoseZvikasadaro, kunze kwakaoma kurangarira kunokura.
Term type
Sarudza kuti zita racho richava rechiito here, chirevo, kana zita, uye kuti rinobatanidzwa nenzira ipi. Sarudzo dzinoshanda: chibatanidzi (Chakaputsika), nguva iripo (Kuputsika), chipauro (Chinokorokoka), zita (Chinoputsika) kana misanganiswa yakaita sekuti “inogomara”, “show Collapsible”, “icon before”.
Humwe kana kuwanda
Tsanangura kuti unodoma muumwechete here kana muuzhinji uye chengetedza pateni. Kushandisa Bhatani/Mabhatani kana Saizi/Saizi zvinogara zvichiita kuti kutsvaga nekuverenga kuve nyoreIwe unogona zvakare kuseta generic ("zviito") kana zvirinani mapoka akawanda zvinhu.
Pakutanga uye maitiro ekuona
Ronga mashandisiro aunoita: Uppercase + Uppercase (Icon Pamberi), mavara madiki + madiki (icon pamberi), Uppercase + lowercase (Icon pamberi) kana lowercase + Uppercase (icon Pamberi). Capitalization chikamu chehurongwa, kwete diki diki.
Kubatanidza mazwi
Masanganisiro aunoita mazwi anotsanangura kuverenga uye kuenderana nekodhi. Sarudzo dzakajairika: hapana nzvimbo (iconPamberi), ine nzvimbo (icon pamberi), nguva (icon.Pamberi), hyphen (icon-pamberi), underscore (icon_before)Dzivisa misanganiswa inokanganisa kuverenga kana ikasawedzera kukosha.
Predefined masitaera (Case Styles) ari pasi pekuvandudzwa anosanganisa kutanga uye mibatanidzwa: ngameraCase (hapana nzvimbo uye izwi rega rega rakaiswa mazita kunze kwekutanga), PascalCase (ese ane capitalized uye asina nzvimbo), kebab-case (hyphen uye madiki mavara) uye nyoka_case (underscore uye madiki mavara)Sarudza iyo inonyatsokodzera stack yako uye inoenderana.
Maitiro ekuronga: nealfabheti, zvakatevedzana, uye hierarchically
Kupfuura zita, nzira iyo rondedzero refu yakarongerwa zvine basa rekutsvaga zvinhu nekukurumidza. Nzira nhatu dzinoshanda zvakanaka mumaraibhurari:
- Arufabheti: a–zoz–a (semuenzaniso, pasi, kuruboshwe, kurudyi, kumusoro).
- Sequential: 0–10 kana 10–0 (e.g., default/hover/active size or states).
- Hierarchical: kubva kuvazhinji kusvika kune vadiki kana zvakasiyana (semuenzaniso, yepuraimari, yechipiri, kana ruzivo/yambiro/kukanganisa kusasimba).
Kushandisa nzira imwechete yekurongeka kune zvese zvakaunganidzwa zvinodzivirira timu yega yega kuodha "nenzira yavo". Tsanangura zvaunofarira uye mienzaniso yegwaro kune nyaya dzisina kujeka.
Kuitwa: kuongorora uye kugadzira glossary
Nemitemo inotsanangurwa, inguva yekuishandisa. Iwe une nzira mbiri dzaungatobatanidza. kuve nechokwadi kumhara:
Content audit
Ongorora izvo zvakatovakwa: zvinyorwa zvezvinhu, zvinhu, zvivakwa, uye kukosha nemazita azvino. Chinangwa ndechekusvika pakubvumirana pane imwechete taxonomic system ine dhizaini nekusimudzira uye kuronga kutama pasina kutyora prototypes kana handoffs.
Kugadzira dudziro
Kunyangwe iwe uri kutanga kubva mukutanga kana kuti watoita ongororo, tsanangura chimiro, girama, uye kurongeka kune yega yega chinhu (chikamu, chinhu, pfuma, uye kukosha). Duramazwi rinova "duramazwi rako repamutemo" remazita uye mune sosi yenhengo itsva.
Figma AI yekushandura zita rezvikamu
Kutumidzazve mazana emapepa nemaoko kunonetesa. Pano, Figma AI inogona kukuchengetedza nguva nekushandisa zvirimo, chinzvimbo, uye hukama hukama kuratidza mazita emamiriro ezvinhu. Chishandiso chinoongorora sarudzo yako uye chinoshandisa mazita anoenderana apo chinoona iyo default pateni..
Kune miganhu nemaune: Figma AI inongopa mazita emafuremu, mapoka, zvinyorwa zvinyorwa, rectangles (uye akatenderedzwa) ane mufananidzo wakazara, uye mamwe mamiriro achiri kuchengetedza zita rekutanga rechikamu chikuru (chete chigaba, pasina kubata sublayers). Kana layer yatova nezita, yakakiyiwa kana kuvanzwa, kana iri yega vector shape (ellipse, polygon, star, mesh) isina mufananidzo, haizopihwa zita..
Unogona kutanga kutumidza zita nenzira dzakati wandei: kubva kumenu yemukati nekudzvanya kurudyi, kubva kuZviito mubhara rekushandisa, kana kuburikidza nekuita nekukurumidza nekunyora "Rename layers". Kana zvese zvatove nemazita nemazvo, iwe uchaona meseji "Hapana chikonzero chekutumidzazve maseru," nesarudzo yeku "Rename zvakadaro" kana iwe uchida kuimanikidza..
Ruzivo runobatsira: kana iwe uine akafanana asina kutaurwa mazita mumafuremu akati wandei epamusoro, Figma AI ichatumidza iwo anoenderana. Izvi zvinobatsira kuchengetedza akangwara animations uye kupururudza zvinzvimbo mune prototypes nekuchengetedza mazita etsamba.
Variables muFigma: reusable tokens yekugadzira uye prototyping
Zvinosiyana chengetedza kukosha izvo zvaunogona kushandisa zvakare mukugadzira zvivakwa uye prototype zviito, uye zvinogara pamwe nemamwe maturusi ekugadzira senge. 3D dhizaini zvirongwa zveMac. Ndiwo bhiriji rechisikigo rekushandisa dhizaini tokeni uye kuvaka inodyidzana logic pasina kudhirowa masisitimu.
Mamwe mashandisirwo anoshanda: gadzira uye shandisa tokeni (mavara, mafonti, nzvimbo), chinja pakati pehukuru hwechishandiso nekukasira kugadzirisa nzvimbo zvichienderana nechiyero chako, tarisa zvinyorwa mumitauro yakasiyana neshanduko yemamiriro ezvinhu, kana gadzira ngoro inoverengera huwandu hweodha. Zvose izvi pasina kuwanza misiyano isingakoshi.
Kune nzvimbo nhatu huru dzavanokunda: dhizaini nedhizaini masisitimu, advanced prototyping, uye APIs. Kugona izvi zvitatu zvinokutendera kuti ubatanidze dhizaini, kupindirana, uye otomatiki. mukuyerera kunoenderana.
Variables yekugadzira uye masisitimu
Shandisa zvinosiyana uye modhi kumiririra tokens uye mamwe mamiriro (chiedza / rima, mhando, matunhu). Ruvara uye nhamba ndiyo hwaro hwema palettes, saizi, uye densities.uye iwe unogona kuzvimepu kune zvakaunganidzwa uye modhi kuti uchinje paunotarisa.
Zvishandiso zvakajairika munzvimbo ino zvinosanganisira zvidzidzo zvekutanga, madhairekitori ekuunganidza uye modhi, uye kuenzanisa pakati pezvakasiyana uye masitayera kukubatsira kusarudza nguva yekushandisa imwe neimwe. Muchidimbu: masitayera anoshanda seanoonekwa preset; akasiyana anofukidza parameterizable kukosha nemamodhi.
Variables for advanced prototyping
Mune prototypes, zvinosiyana chengetedza nyika uye zvivakwa zvinoshanduka kuburikidza nekudyidzana. Iwe unogona kushandisa zviito kugadzirisa hunhu hwavo uye nekudaro kuchinja chitarisiko, zvirimo, kana kuoneka pasina kudzokorora mafuremu..
Kubatanidza zvinosiyana nezvirevo uye zvimiso zvinovhura musuwo kune tambo dzakasimba, mashandiro emasvomhu, uye ongororo yeBoolean. Nezviito zvakawanda uye kana / zvimwewo pfungwa, iwe unorongedza maitiro akaoma mune imwechete trigger..
Mhando dzakasiyana dzinoitawo basa mu prototypes: gadza kukosha nemamiriro (semuenzaniso, dingindira) uye shandisa mukutaura kushandura chitarisiko munguva chaiyo. Huwandu hwemasikirini anodiwa kune akapfuma mamiriro akaderedzwa zvakanyanya.
Variables uye API (REST, plugins uye widget)
Iwo akasiyana anowanikwa mune ese ari maviri plugin API uye iyo REST API. Iwe unogona kuona, kugadzira, kugadzirisa, uye kudzima zvinosiyana, pamwe nekuzvibatanidza kune zvikamu kubva kumaplugins.Izvi zvinogonesa maturusi akadai sevanopinza/vanotengesera kunze kana manyorero-kune-anochinja-chinja.
Widgets inowana zvinosiyana kuburikidza ne plugins API (kuverenga nekugadzira), kunze kwekuti ivo havagone kubatanidza zvakananga widget zvivakwa kune zvinosiyana. Kuti uwirirane neye repository, pane muenzaniso GitHub zviito zvinobatanidza Figma zvinosiyana kune yako codebase., kuwedzera kune emunharaunda sandbox mafaera ekuita njodzi-isina maitiro.
Maitiro akanaka ekutumidza mazita ezvikamu uye zvikamu
Isa prefix yemhando (semuenzaniso, Btn, Kadhi, Input) uye suffix yehurumende (hover, focus, disabled) kana saizi (sm, md, lg). Iyo yakakurudzirwa kurongeka kazhinji Type/Chinangwa/Size/Conditionuye shandisa mayunifomu ekuparadzanisa (kebab-kesi kana PascalCase, chero inokodzera stack yako).
Chengetedza kuwirirana pakati pematanho uye zviitiko: iyo yemuenzaniso mudziyo unofanirwa kugara nhaka yemaitiro eiyo master chikamu. Dzivisa misiyano yakavandudzwa yenzvimbo nekuti inokanganisa kutsvaga nekutsiviwa.Kana yave nguva yekuchinja, ita mushanduro ye master uye buritsa imwe vhezheni.
Pazvivakwa zve boolean, doma chivakwa, kwete kukosha: "Icon" ine On/Off kana Chokwadi/Nhema; dzivisa "ineIcon/withoutIcon" kana system yako ichishandisa boolean toggles. Izvi zvinowiriranisa mutauro neruzivo rweiyo prototype uye kodhi..
Kana purojekiti yako ichisanganisira anopfuura dura rimwechete (semuenzaniso, backoffice uye mutengi), wedzera chiyero kuunganidzwa kana zita refolda. Kupatsanura nemamiriro ezvinhu kunoderedza kudhumhana kwesemantic uye kunosimudzira kushandiswazve kwakakodzera.
Kukanganisa kwakajairika uye nzira yekuzvidzivisa
Imwe yezvikanganiso zvinowanzoitika hakusi kunyora gungano uye kurega munhu wega wega ataure zvinhu "nenzira yavo". Pasina nhungamiro, raibhurari inoparadzaniswa uye kumhanya kwechikwata kunodereraIpa mienzaniso yakajeka uye miganhu yemiganhu kubvisa kusava nechokwadi.
Imwe kukanganisa: kusanganisa kujoinha uye capitalization masitaera mukati meimwe chikamu chemhuri (kebab mune imwe, ngamera mune vamwe). Izvi zvinokanganisa mafirita, mibvunzo, uye kuverenga iyo layers panel.Tsanangura chimiro chekusarudzika uye shandisa zvakaganhurirwa uye zvinoruramiswa.
Dzivisa mazita asina zvaanoreva ("Frame 27 Copy 3", "Rectangle 12"). Kana Figma AI isingakwanise kubatsira nekuti mazita akatopihwa, vatumidzezve pamaoko kana pachikamu chechikamu. uye tora mukana wacho kubatanidza gungano rakasarudzwa.
Usaite kopi dzakasiyana dzakagadziriswa nechekare kana kuti boolean muchikamu. Mutemo wegoridhe: mashoma skrini, yakawanda parameterizationUnozopedzisira wava neraibhurari yakareruka uye inogoneka.
Adoption roadmap yezvikwata
Tanga diki neseti yezvikamu zvakakwirira-zvinokonzera (mabhatani, mapeji, typography, palette). Govera gungano, unganidza mhinduro, uye uvandudze usati waipa kune vamwe.Kubva ipapo, famba nemamodule uye shanduro.
Kana iwe uri kutsvaga kusimudzira kugona kwako kweaya maitiro, funga zvakadzama, kudzidziswa kwakanangana nechigadzirwa. Zvirongwa zvinodzidziswa nenyanzvi dzinoshanda zvinobatsira kuisa dzidziso mukuita mumamiriro ezvinhu epasirese. yatove kubatanidza Figma nemaitiro ebudiriro.
Kiyi kune zvese zviri pamusoro ndeye kubata nomenclature sechikamu chedhizaini, kwete sekufunga kwekupedzisira. Iine glossary yakajeka, girama uye mitemo yemaitiro, Figma AI tsigiro, uye zvakanyatsotsanangurwa zvinosiyana, yako system inowana kukurumidza, kuwirirana, uye scalability.Uye timu yako, yemhando yenguva yekutarisisa matambudziko emushandisi uye kwete kurwira mazita.
