Projektēšanas sistēmas izstrāde. Kā izvairīties no neparedzētas rutīnas.

Četras vienkāršas lietas, kas jāatceras un jāievēro pirms dizaina sistēmas izstrādes

Ja jūs izstrādājat dizaina sistēmas, jūs droši vien uzzinājāt, ka secība ir svarīga. Kad tika izveidots komponents vai simbols, un jūs to reizinājāt, pirms tam tika piešķirtas nepieciešamās īpašības, kļuva iespējams rutīnas risks.

Piemērs: komponents ir izveidots no tajā ievietotiem ligzdotiem simboliem. Ja esat aizmirsis precīzi norādīt parametru / ierobežojumu izmēru maiņu savlaicīgi, visi klonētie tiek koriģēti nepareizi.

Paātriniet projektēšanas un izstrādes laiku līdz pat 50%

Materiālu projektēšanas sistēma Figma sastāv tieši no 512 materiāla lietotāja saskarnes komponentiem un 1171 materiāla ikonām.

  • Unikāla arhitektūra ātrai pielāgošanai
  • Aprīkota ar vienkāršu un skaidru dokumentāciju
  • Paredzēts darbam galddatoros un mobilajās lietojumprogrammās
  • Izgatavots, ievērojot materiāla dizaina vadlīnijas
  • Maksimāli izmanto Figma 'instances' funkcijas
  • Atbalsta Figma tīmekļa API integrāciju reāllaikā
  • Klienti atbalsta 7 dienas nedēļā!

Uzziniet vairāk → http://setproduct.com/material

Ja jums joprojām ir šaubas, iesaku skatīties pārskatu

① Izveidojiet atkārtojošo elementu sarakstu

Identificējiet un grupējiet visus atkārtotos objektus precīzā izkārtojumā, prototipā vai koncepcijā. Ne tikai pogas sarakstā. Etiķetes, ikonas, ievadi, virsraksti un tā tālāk. Ir vērts pievienot fonus un pat ēnu parametrus, ja vēlaties izveidot pietiekami elastīgu sistēmu. Zemāk jūs uzzināsit šo darbību mērķi.

Daži no atkārtotiem komponentiem

② Nosakiet visus iespējamos stāvokļus

Tagad sāciet veidot sarakstu ar elementiem, uz kuriem ir iespējama sistēmas reakcija, pretējā gadījumā lietotājs, iespējams, mijiedarbosies. Ja jūsu misija prasa aprakstīt pat kādus stāvokļus, es ieteiktu šo procesu vēlāk saglabāt līdz pēdējiem attīstības posmiem, kad visi komponenti ir vizuāli zināmi, un tad varat sev uzdot jautājumu: “Kuriem no tiem nepieciešams klonēt papildu stāvokļus ? ”

Tikai daži iespējamie teksta ievades stāvokļi

③ Pielāgojiet ierobežojumus vai parametru mainīšanu

Iegūstiet sev noteikumu: “Strādājot ar komponentu, es vienmēr paturu prātā, kā tas tiek vērtēts”. Vai jūs varētu atcerēties piemēru, no kura es sāku šo ziņu? Būtība ir tāda, ka jums ir jāiestata ierobežojumi / izmēru maiņas parametri tūlīt pēc kadra pārveidošanas par sastāvdaļu. Pretējā gadījumā jums pietrūks ikdienas, ja nākotnē jums tas būs manuāli jāpielāgo katram elementam.

Parametru izmēru mainīšanas ikonas, kas iestatītas, lai tās ieslēgtu pa labi

First Pieejamie vārdi bija pirmie, štati - pēc

Vai jūsu komponents tika izveidots un jūs to klonēsit papildu stāvokļiem? Lieliski, bet pirmo reizi tam piemēro pieejamu vārdu. Rūpēties par sevi un savu komandu un lietot skaidrus nosaukumus. Ņemiet vērā, ka klonētais komponents saglabā vecāku vārdu. Ja jūs dodat priekšroku kārtībai, es domāju, ka jūsu teksta laukam vajadzētu izklausīties šādi:

Teksta lauki / pasvītrots / noklusējums

Tagad sastāvdaļu var droši klonēt. Pēc tam noņemiet instanci, veiciet nepieciešamās vizuālās izmaiņas, un rediģēšana paliek tikai beigās:

Teksta lauki / pasvītroti / aktīvi

⑤ Kaut kas desertam

Nav rutīnas. Mans dizaina process tagad ir saistīts ar dizaina sistēmu un tiek rādīts tiešraidē vietnē YouTube:

Apakšējā līnija ⤑ saglabā secību ♛

Tas viss attiecas uz šodienas pamatiem. Nav šaubu, ka dizaina sistēmu izstrādē ir daudz vairāk nianšu, iespējams, aprakstīšu par tām vēlāk. Lūdzu, dalieties komentāros par savām metodēm / soļiem, sākot sistēmu no jauna. Priekā.

Ko tālāk? Ātri sāciet savu materiāla dizaina projektu, izmantojot šo Figma bibliotēku

Izveidots, izmantojot materiāla prototipēšanas sistēmu Figma
❶ Izpētiet sistēmu → http://setproduct.com/material
❷ Komponentu pārskats → http://setproduct.com/material/components
❸ Vairāk video → http://setproduct.com/material/videos
❹ Iegādājieties un lejupielādējiet → http://setproduct.com/material/download
❺ 1000+ materiāla ikonas → http://setproduct.com/material/icons_pro