Figma: Disenyo, Prototype, at Pakikipagtulungan sa Buong Enterprise

figma

Ang huling ilang buwan, tumutulong ako upang bumuo at isama ang isang lubos na napasadyang halimbawa ng WordPress para sa isang kliyente. Ito ay ang balanse ng estilo, pagpapalawak ng WordPress sa pamamagitan ng mga pasadyang larangan, mga uri ng pasadyang post, isang balangkas sa disenyo, isang tema ng bata, at mga pasadyang plugin.

Ang mahirap na bahagi ay ginagawa ko ito mula sa simpleng mga mockup mula sa isang pagmamay-ari na platform ng prototyping. Habang ito ay isang solidong platform para sa visualization at disenyo, hindi ito madaling isalin sa HTML5 at CSS3. Idagdag ang lahat ng iba pang mga pag-ulit, at ang aking mga araw ay medyo nakakabigo sa pag-unlad na napakabagal.

Ang isang piraso ng palaisipan ay ang ahensya ng disenyo na ipinasa lamang ang mga prototype, nang hindi nagbibigay ng anumang uri ng master styleheet ... kaya nagsusumikap kaming magawa iyon sa pamamagitan ng pag-export ng mga prototype sa airship, at pagkatapos ay isinasalin ang CSS sa WordPress. Ang bilang ng mga kinakailangang hakbang at ang mga puwang sa pagitan ng mga platform ay ginagawang isang mahirap na proseso. Hindi banggitin ang pagsubok na gawing simple ang mga kumplikado para sa bilis at kakayahang sumukat

figma

figma naisentralisahin ang karamihan sa gawaing ito sa isang platform na nagbibigay-daan sa disenyo, puna, at pakikipagtulungan sa buong bawat miyembro ng iyong koponan, kabilang ang:

  • Taga-disenyo - Makipagtulungan sa konteksto at sa real time. Huwag mag-alala tungkol sa iyong mga file na wala sa petsa o pag-o-overtake sa gawain ng bawat isa.
  • Mga stakeholder - Magpadala ng isang link upang mangolekta ng puna, makakuha ng mga kahilingan sa pagbabago, at payagan ang mga stakeholder na gumawa ng mga pag-update ng kopya sa iyong mga disenyo.
  • Mga Nag-develop - Laging may access ang mga inhinyero sa kasalukuyang mapagkukunan-ng-katotohanan at maaaring siyasatin ang mga elemento, i-export ang mga asset, at kopya ng code.

Ang Figma ay may ilang Mga Natatanging Tampok:

  • Mga Operasyon ng Boolean - Sa apat na formula: unyon, ibawas, intersect, at ibukod, maaari mong pagsamahin ang anumang hanay ng mga layer ng hugis na may katumpakan.
  • Piraso - Bumuo ng mas mabilis at mas tuloy-tuloy na may magagamit muli at nasusukat na mga elemento sa iyong mga file. I-access ang mga layer sa bawat pagkakataon upang maaari mong intuitively i-edit at i-override ang teksto at mga imahe na naka-linya.
  • hadlang - Sukatin ang iyong disenyo upang magkasya sa anumang laki ng screen sa pamamagitan ng pag-aayos ng mga bagay sa isang frame ng magulang, pag-snap ng object sa isang grid, o kahit sa pamamagitan ng paglikha ng mga sangkap na sukat.
  • Mga Frame ng Device - Ipakita ang iyong mga disenyo sa tamang mga kapaligiran. Maaari ka ring pumili sa pagitan ng portrait at landscape mode.
  • Pakikipag-ugnayan - Gawing buhay ang iyong mga prototype sa pamamagitan ng pagtukoy sa mga pakikipag-ugnay sa pag-click, habang lumilipad, habang pinindot, at higit pa.
  • Mga Overlay - Sa kamag-anak at manu-manong pagpoposisyon mayroon kang buong kontrol sa kung saan at kung paano lilitaw ang mga overlay.
  • Pixel-pagiging perpekto - 60fps interactive na pag-edit ay nagdudulot sa iyo ng ultra malutong, perpektong mga preview ng pixel at pag-export.
  • prototyping - Mabilis na bumuo ng mga daloy sa pamamagitan ng pagkonekta ng mga screen at pagdaragdag ng mga elemento tulad ng mga pakikipag-ugnayan, paglipat, overlay, at marami pa. Sa halip na mag-sync sa iba pang mga tool magbahagi lamang ng isang URL upang makatanggap ng puna.
  • Nakikiramay Disenyo - I-stretch ang iyong mga layout at makita kung paano sila tutugon sa mga pagbabago sa laki ng screen.

Tumutugon Prototyping

  • Pag-scroll - Paganahin ang pahalang, patayo, o anumang direksyon sa pag-scroll sa loob ng mga indibidwal na hugis o ang buong frame ng magulang.
  • Estilo - Pagsabayin ang mga kulay, teksto, grids at mga epekto sa lahat ng iyong mga proyekto. Panatilihin ang mas kaunting mga istilo ng teksto at ihanay ang iyong mga disenyo sa iba't ibang mga aparato sa mga natatanging estilo ng grid ng Figma.
  • Mga Aklatan ng Koponan - Ibahagi ang mga bahagi at istilo sa Figma-hindi na kailangan para sa mga nakabahaging drive o karagdagang tool. Kinokontrol mo at ng iyong koponan kung paano at kailan ilulunsad ang mga pagbabago sa mga simpleng daloy ng pag-publish.
  • Mga Network ng Vector - Ginawa ng Figma ang tool sa pen upang maging mas madaling maunawaan, pinapayagan para sa direktang pagmamanipula habang pinapanatili ang paatras-pagiging tugma sa mga landas.

para proyekto kliyente, ang Figma ay maaaring maghimok ng pagkakapare-pareho, kahusayan, at seguridad sa antas. Pinapayagan ng platform ang mga kliyente ng enterprise na madaling pamahalaan ang mga system ng disenyo sa mga library ng pangkat at ang kakayahang mag-upload at magbahagi ng mga pasadyang font sa iyong samahan. Nag-iisang Pag-sign-On, mga kontrol sa pag-access, at mga tala ng aktibidad ay kasama.

Magsimula sa Figma

Ang Figma ay may mahusay na pagpipilian ng mga tutorial na pinapanatili nila sa kanilang Channel ng YouTube, narito ang isang video na Nagsisimula:

figma nagbibigay sa mga developer ng kakayahang siyasatin, kopyahin, i-export ang mga assets, at kopyahin ang CSS nang direkta mula sa file ng disenyo. Maaari mo ring paganahin ang iyong umiiral na mga daloy ng trabaho na may mga pagsasama, kasama ang airship, Avocode, Jira, Dropbox, ProtoPie, at Prinsipyo para sa Mac. Mayroon din silang isang matatag na API.

Subukan ang Figma nang Libre

Ano sa tingin ninyo?

Ang site na ito ay gumagamit ng Akismet upang mabawasan ang spam. Alamin kung paano naproseso ang data ng iyong komento.