Suunnittelujärjestelmän kehittäminen. Kuinka välttää odottamaton rutiini.

Neljä yksinkertaista asiaa, jotka muistetaan ja noudatetaan ennen suunnittelujärjestelmän kehittämistä

Jos olet kehittämässä suunnittelujärjestelmiä, olet todennäköisesti oppinut, että järjestys on tärkeä. Kun komponentti tai symboli luotiin ja olet monistanut sen ennen kuin sille on määritetty tarvittavat ominaisuudet, rutiinin riski tuli mahdolliseksi.

Esimerkki: olet luonut komponentin sisäkkäisistä symboleista. Jos unohdat määritellä parametrejä / rajoituksia oikeaan aikaan, kaikki kloonatut skaalataan väärin.

Nopeuta suunnittelu- ja kehitysaikaa jopa 50%

Figman materiaalisuunnittelujärjestelmä koostuu tarkalleen 512 materiaalin käyttöliittymän komponenteista ja 1171 materiaalikuvakkeesta.

  • Ainutlaatuinen arkkitehtuuri nopeaa mukauttamista varten
  • Varustettu yksinkertaisella ja selkeällä dokumentaatiolla
  • Omistettu sopimaan pöytätietokoneisiin ja mobiilisovelluksiin
  • Valmistettu materiaalisuunnitteluohjeista seuraavien mukaisesti
  • Käyttää korkeintaan Figma 'Esimerkki' -ominaisuuksia
  • Tukee Figma web -sovellusliittymää reaaliaikaiseen integrointiin
  • Asiakkaat tukevat 7 päivää viikossa!

Lisätietoja → http://setproduct.com/material

Jos epäilet edelleen, suosittelen katsomaan katsausta

① Muodosta luettelo toistuvista elementeistä

Tunnista ja ryhmittele kaikki toistuvat kohteet tarkan asettelun, prototyypin tai konseptin mukaan. Ei vain painikkeita luettelossa. Tarrat, kuvakkeet, tulot, otsikot ja niin edelleen. On syytä lisätä taustoja ja jopa varjoparametreja, jos haluat rakentaa riittävän joustavan järjestelmän. Alla opit näiden toimien tarkoitusta.

Jotkut toistuvista komponenteista

② Määritä kaikki mahdolliset tilat

Aloita nyt luettelon laatiminen sellaisille elementeille, joissa järjestelmän vastaus on mahdollista, tai käyttäjän tulee todennäköisesti olla vuorovaikutuksessa. Jos tehtäväsi vaatii kuvaamaan jo olemassa olevia valtioita, suosittelen pitämään tätä prosessia myöhemmin viimeisissä kehitysvaiheissa, kun kaikki komponentit tunnetaan visuaalisesti ja voit kysyä itseltäsi ”Mikä niistä vaatii kloonaamista lisätiloiksi ?”

Muutama mahdollinen tila tekstituloille

③ Säädä rajoituksia tai parametrien koon muuttamista

Hyväksy itsellesi sääntö: workingKun työskentelen komponentin kanssa, muistan aina, kuinka se skaalautuu❞. Muistatko esimerkin, josta aloitin tämän viestin? Tärkeintä on, että sinun on asetettava rajoitukset / parametrien koon muuttaminen heti sen jälkeen, kun olet muuttanut kehyksen komponentiksi. Muutoin olet kiinni rutiinista, jos joudut jatkossa säätämään sitä manuaalisesti jokaiselle elementille.

Parametrien koon muuttavat kuvakkeet asetetaan napsahtamaan oikealle

④ Saavutettavat nimet olivat etusijalla, tilat - jälkeen

Saitko komponentin valmista ja aiotte kloonata sen lisätiloihin? Erinomainen, mutta käytä ensimmäistä kertaa helposti käytettävää nimeä siihen. Pidä huolta itsestäsi ja DEV-tiimistäsi ja käytä selkeitä nimityksiä. Muista, että kloonatulla komponentilla on vanhemman nimi. Jos pidät parempana järjestyksessä, odotan tekstikentän kuulostavan seuraavalta:

Tekstikentät / alleviivattu / oletus

Nyt komponentti voidaan turvallisesti kloonata. Irrota sitten ilmentymä, tee tarvittavat visuaaliset muutokset, ja se on jäljellä vain lopussa:

Tekstikentät / alleviivattu / aktiivinen

⑤ Jotain jälkiruokaan

Ei rutiinia. Suunnitteluprosessini on nyt sidoksissa suunnittelujärjestelmään ja näytetty suorana YouTube:

Alarivi ⤑ pitää järjestys ♛

Siinä kaikki on tämän päivän perusteita. Ei epäilystäkään, suunnittelujärjestelmien kehittämisessä on paljon enemmän vivahteita, ehkä kerron siitä myöhemmin. Ole hyvä ja jaa kommentissa omat menetelmäsi / vaiheenne, kun aloitat järjestelmän suunnittelun tyhjästä. Kippis.

Mitä seuraavaksi? Pika-aloittaa materiaalisuunnitteluprojektisi tällä Figma-kirjastolla

Luotu Materiaalin prototyyppijärjestelmällä Figmalle
❶ Tutustu järjestelmään → http://setproduct.com/material
Overview Yleiskatsaus komponenteista → http://setproduct.com/material/components
❸ Lisää videoita → http://setproduct.com/material/videos
❹ Osta ja lataa → http://setproduct.com/material/download
❺ 1000+ materiaalikuvakkeita → http://setproduct.com/material/icons_pro