Međusobni dizajn i razvoj

TL; DR: Interplay je prvi alat za dizajn koji omogućuje dizajniranju i inženjeringu da neometano rade na istim ekranima iz bilo kojeg mjesta na svijetu, približavajući se proizvodnji sa svakom ponovom.

Interakcija - Dizajn s stvarnim komponentama koda (Foto: designecologist)

Zašto?

Dizajn digitalnih proizvoda postaje sve teži posljednjih godina. Aplikacije su složenije, rade na sve većem broju uređaja, različitih stanja i sofisticirane interakcije.

Neki su zagovarali kako bi dizajneri trebali kodirati ove složenosti, ali u Interplayu vjerujemo da je bolje rješenje da dizajneri usko surađuju s programerima. Nedavno je ova suradnja uvelike profitirala od usvajanja Sustava dizajna i strukturiranjem naših timova za rad u multi-disciplinarnim strojevima. Kaelig najbolje stoji u svom nadahnjujućem postu „Design Systems Ops“:

„Najbolje proizvode grade timovi s velikim mostovima komunikacije između dizajnera i inženjera. Bez obzira jeste li jedan ili drugi, na kraju dana ... svi smo program za isporuku. "- Kaelig

To volimo, ali otkrili smo da samo dobra komunikacija nije dovoljna. Adam Michela ide još dalje u pronicljivom odgovoru Quore na pitanje „Da li gradimo prave alate za dizajn?“.

"Vjerujem da ide naprijed postoji mogućnost stvaranja alata koji spajaju (a ne most) dizajn i implementaciju." - Adam Michela

Bez alata koji spaja dizajn i implementaciju, doživljavamo bol dizajnerskih datoteka koje se razlikuju od proizvodnog koda, dizajnerskih sustava i stilskih vodiča postaju zastarjeli i zastarjeli, a krajnji proizvod ne odražava točno namjeru izraženu u originalnom dizajnu.

Zamisliti

Zamislite kada bi dizajneri i programeri mogli raditi zajedno u brzoj ponavljajućoj petlji, istovremeno radeći na istim ekranima iz bilo kojeg mjesta na svijetu, približavajući se proizvodnji sa svakom iteracijom.

Zamislite da možete uistinu testirati kako se dizajn osjeća upravo od prve verzije dizajna. Svaku verziju procijenite u više stanja i konteksta te u potpunosti vjerni svim bogatim interakcijama i prijelazima koji su već ugrađeni u vaš sustav dizajna.

Predstavljamo interakciju

To je upravo ono što gradimo s Interplayom i stvarno smo uzbuđeni što ćemo za nekoliko tjedana predstaviti našu javnu beta verziju. Evo nekih detalja na kojima radimo ...

Izrada s stvarnim komponentama koda

Zahvaljujući snazi ​​komponenti koda, možemo se oprostiti od dana simuliranja stanja i interaktivnosti dupliciranjem ploča i dodavanjem žarišnih mjesta. Budući da komponente koda imaju ugrađena stanja, prijelaze i događaje, prototipovi koje stvorite u programu Interplay dolaze sa svim tim dobrim stvarima besplatno. To znači stvarne tipke s pravilnim stanjima paddinga i lebdenja, stvarni unosi oblika s rezerviranim mjestima, naljepnicama i porukama o pogreškama te ispravnom navigacijom.

Google materijalne komponente u interakciji

Izrađen za oslobađanje vašeg sustava dizajna - ili za pomoć da se on dogodi

Dizajnerski sustavi sadrže stotine (ako ne i tisuće) teško osvojenih odluka dizajna - od potpuno interaktivnih komponenti koda s animacijama do sustava za tipografiju, razmak, boje i ikone. U Interplayu, Design Systems su građani prve klase. Dizajneri imaju na dohvat ruke najnovije komponente proizvodnog koda, tako da njihovi dizajni automatski nasljeđuju svu tu dobrotu i dosljednost. Ali to nije samo jednosmjerna stvar - programeri mogu ažurirati komponente u pokretu, a dizajneri mogu doprinijeti dizajnerskom sustavu tako da on s vremenom i dalje raste i sazrijeva.

Korištenje tokena u boji s vašeg dizajnerskog sustava

Suradnja uživo i trenutna razmjena

U toku napravite vizualne promjene koje vaš tim može odmah vidjeti na bilo kojem uređaju i bilo gdje u svijetu. (Volimo ovo i nadamo se da ćete i vi!)

Dozivne React komponente iz Vodiča za stil potražnje, Seek.com.au - hvala @markdalgleish

Izvoz prekrasnog koda

Čujemo vas ... vidjeli smo kako mnogi alati za dizajn pokušavaju ponuditi izvoz koda, ali često na kraju generiraju kašu HTML i CSS. To je zato što oni pokušavaju pretvoriti slike ili pravokutnike u kod.

Kad izvozimo kod iz tvrtke Interplay, mi stvarno samo izvozimo aranžman komponenti kvalitete proizvodnje koje ste uveli. Izvoz se može prilagoditi pomoću predložaka prema željenom stilu kodiranja vaših programera (npr. Redux & css-module / mobx & styled-components /…).

Izvoz komponenti Polaris React pomoću predloška za izvoz stiliziranih komponenti

A tu je i puno više!

  • Izgledi - CSS Grid, Stacks (Flexbox), Tok dokumenta, Frame (i pričekajte dok ne vidite Auto Grid! )
  • Integracija radnog tijeka - uvozite sredstva iz alata koje poznajete i volite, bilo da se radi o kodu (React, Angular, Vue,…) ili alata za dizajn (Sketch, InVision Studio, Figma,…)
  • Podaci i stanja - testirajte svoj dizajn stvarnim podacima.

Tek smo nekoliko tjedana od našeg javnog beta izdanja i objavljivat ćemo više informacija tijekom narednih tjedana - budite nas pratite nas slijedeći @interplayapp ili se prijavite za rani pristup na https://interplayapp.com

Na kraju, svim zadivljujućim ljudima koji su nam pružili rane povratne informacije o konceptu, poigrali se s ranijim verzijama Interplay-a ili pružili pronicljive odgovore na naše ankete, ogromno hvala !

Michael (@mkeftz) i Adam (@MrAdamWalters)

Suosnivači, interplayapp.com