Sushi Design System - UI Kit

Zomato

Apie šią programą

„Sushi“ yra „Zomato“ sukurta dizaino sistema, kuri padeda kurti patikimas vartotojo sąsajas, naudojant švarią ir paprastą dizaino kalbą. Mes, Zomato, sukūrėme tai nuo pat pradžių. Tai ne tik mums skirta projektavimo sistema, bet ne tik ji padeda vartotojams teikti naują ir patobulintą patirtį. „Sushi“ gali padėti sukurti pagal užsakymą sukurtas vartotojo sąsajas, naudojant nuoseklią, švarią ir paprastą dizaino kalbą. Nors „Sushi“ kuriama pagal savo dizaino kalbą, jis visiškai apima ir naudoja „Google“ medžiagų dizaino komponentus daugelyje sričių.

Kaip dizaino sistemą ir prekės ženklo gairių nuorodą, ją naudoja ir atstovauja įvairios „Zomato“ komandos, tokios kaip produktų, inžinerijos, rinkodaros ir prekės ženklo kūrimo.

Kas yra projektavimo sistema?
Projektavimo sistema yra daugkartinio naudojimo komponentų rinkinys, vadovaujantis aiškiais standartais, kuriuos galima surinkti kartu, kad būtų galima sukurti bet kokį skaičių programų. Projektavimo sistema nėra tik turto ir komponentų, kuriuos naudojate kurdami skaitmeninį produktą, rinkinys. Anot Emmeto Connolly, „Intercom“ gaminių dizaino direktoriaus, „… dauguma dizaino sistemų yra tik šablonų bibliotekos: didelė UI Lego dalių dėžutė, kurią galima surinkti beveik begaliniais būdais. Visos dalys gali būti nuoseklios, tačiau tai nereiškia, kad surinkti rezultatai bus tokie. Jūsų produktas yra daugiau nei daugkartinio naudojimo vartotojo sąsajos elementų krūva. Ji turi struktūrą ir prasmę. Tai nėra bendras tinklalapis, tai sąvokų sistemos įkūnijimas.

Sushi dizaino sistema

Pamatai
Pagrindai yra skaitmeninės prekės ženklo gairės, apibrėžiančios mūsų projektavimo sistemos tipografiją, spalvų paletes, piktogramas, tarpus, šešėlius ir informacijos architektūrą. Sušiai, laikantis atominio dizaino principų, yra kuriami iš apačios į viršų, naudojant komponuojamus komponentus, suskirstytus kaip atomai ➡️ molekulės ➡️ organizmai.

Atominis dizainas
Atominis dizainas (kaip apibūdino Bradas Frostas), susietas su mūsų sistema.

#Atomai
Mažiausi nedalomi vienetai yra atomai. „Android“ (arba bet kurioje mobiliojoje vartotojo sąsajoje) teksto etiketės, mygtukai ir vaizdų laikikliai yra atomai.

#Molekulės
Rodiniai, kuriuose formuojami keli atomai, bet vartotojui vis tiek atrodo ir elgiasi kaip vienas subjektas, yra molekulės. Pavyzdžiui, įvesties laukuose yra įvesties laukelis, klaidos laukas ir išvalymo mygtukas, tačiau kartu tai yra vienas objektas.

#Organizmai
Sudėtingi, bet daugkartinio naudojimo komponentai, kurie veikia darniai. Susideda iš kelių atomų ir molekulių. Pavyzdys yra įvertinimo juostos, kurias sudaro žymos, kurių kiekviena turi skaičių ir piktogramą. Žymos taip pat keičia spalvą, kai pasirenkami skirtingi įvertinimai. Kiekviena žyma atskirai naudojama ir kitose vietose, tačiau kaip vertinimo juosta, ji veikia kartu, kad sukurtų naują prasmę.

Tipografija
Kaip tikriausiai žinote, tipografija yra šrifto išdėstymo menas, kad rašytinė kalba būtų įskaitoma, skaitoma ir patraukli. Šrifto išdėstymas apima šriftų pasirinkimą, taškų dydžius, eilučių ilgį, tarpus tarp eilučių ir tarpų tarp raidžių bei tarpo tarp raidžių porų reguliavimą.

Mes palaikome šiuos šrifto variantus -

ExtraLight
Šviesa
Reguliarus
Vidutinis
Pusiau paryškintas
Paryškintas
ExtraBold

Galite naudoti bet kokį šriftą, turintį iki 8 šriftų svorio, ir priskirti juos iš šių slapyvardžių. Nors demonstracijai turime Metropolis, Okra ir Roboto, galite naudoti bet kokį šriftą, atitinkantį jūsų prekės ženklą.

Spalvos
Sushi savo paletėje taip pat pateikia iš anksto nustatytų spalvų rinkinį. Ypatingai unikaliems atvejams drąsiai naudokite savo spalvas, o kitu atveju rekomenduojame naudoti spalvas iš šios paletės visiems gaminio komponentams.

Kodo saugykla