Sushi Design System - UI Kit

Zomato

Par šo lietotni

Suši ir Zomato izstrādātā dizaina sistēma, kas palīdz izveidot stabilas lietotāja saskarnes, izmantojot tīru un vienkāršu dizaina valodu. Mēs, Zomato, esam to izveidojuši no paša sākuma. Tā nav tikai mums paredzēta dizaina sistēma, bet vairāk nekā tā palīdz mums nodrošināt jaunu un uzlabotu pieredzi mūsu lietotājiem. Suši var palīdzēt jums izveidot īpaši pielāgotas lietotāja saskarnes, izmantojot kodolīgu, tīru un vienkāršu dizaina valodu. Kamēr Suši tiek veidots, izmantojot savu dizaina valodu, tas pilnībā aptver un izmanto Google materiālu dizaina komponentus daudzās jomās.

Kā dizaina sistēmu un atsauci uz zīmola vadlīnijām to izmanto un pārstāv dažādas Zomato komandas, piemēram, produktu, inženierzinātņu, mārketinga un zīmolrades.

Kas ir projektēšanas sistēma?
Dizaina sistēma ir atkārtoti lietojamu komponentu kopums, kas atbilst skaidriem standartiem un ko var salikt kopā, lai izveidotu jebkādu skaitu lietojumprogrammu. Dizaina sistēma nav tikai to aktīvu un komponentu kolekcija, ko izmantojat digitālā produkta izveidei. Saskaņā ar Emetu Konoliju, Intercom produktu dizaina direktoru, “… lielākā daļa dizaina sistēmu patiesībā ir tikai modeļu bibliotēkas: liela lietotāja interfeisa Lego detaļu kaste, ko var salikt gandrīz bezgalīgi. Visas detaļas var būt konsekventas, taču tas nenozīmē, ka apkopotie rezultāti būs tādi. Jūsu produkts ir vairāk nekā tikai atkārtoti lietojamu lietotāja interfeisa elementu kaudze. Tam ir struktūra un nozīme. Tā nav vispārīga tīmekļa lapa, tā ir jēdzienu sistēmas iemiesojums.

Suši dizaina sistēma

Pamati
Pamati ir digitālā zīmola vadlīnijas, kas nosaka mūsu dizaina sistēmas tipogrāfiju, krāsu paletes, ikonas, atstarpes, ēnu un informācijas arhitektūru. Suši, ievērojot atomu dizaina principus, tiek veidoti no apakšas uz augšu, izmantojot komponējamus komponentus, kas sakārtoti kā atomi ➡️ molekulas ➡️ organismi.

Atomiskais dizains
Atomic Design (kā aprakstījis Breds Frosts), kas kartēts ar mūsu sistēmu.

#Atomi
Mazākās nedalāmās vienības ir atomi. Operētājsistēmā Android (vai jebkurā mobilajā lietotāja saskarnē) teksta etiķetes, pogas un attēlu turētāji ir atomi.

#Molekulas
Skati, kuru veidošanā ir iesaistīti vairāki atomi, bet lietotājam joprojām izskatās un darbojas kā viena vienība, ir molekulas. Piemēram, ievades laukiem ir ievades lodziņš, kļūdas lauks un dzēšanas poga, bet kopā tā ir viena vienība.

#Organismi
Sarežģīti, bet atkārtoti lietojami komponenti, kas darbojas vienotā veidā. Sastāv no vairākiem atomiem un molekulām. Piemērs ir vērtējumu joslas, kas sastāv no tagiem, katram no kuriem ir cipars un ikona. Atlasot dažādus vērtējumus, mainās arī atzīmju krāsa. Katrs tags atsevišķi tiek izmantots arī citās vietās, taču kā vērtējuma josla tas darbojas kopā, lai radītu jaunu nozīmi.

Tipogrāfija
Tipogrāfija, kā jūs, iespējams, zināt, ir māksla sakārtot tekstu, lai rakstīto valodu padarītu salasāmu, lasāmu un pievilcīgu, kad tā tiek rādīta. Rakstu izkārtojums ietver burtveidolu, punktu izmēru, rindiņu garuma, rindstarpu un burtu atstarpju atlasi, kā arī atstarpes starp burtu pāriem pielāgošanu.

Mēs atbalstām šādas burtu variācijas -

Īpaši viegls
Gaisma
Regulāri
Vidēja
SemiBold
Treknrakstā
Īpaši treknrakstā

Varat izmantot jebkuru fontu, kuram ir līdz 8 fontu svariem, un piešķirt tos no šiem aizstājvārdiem. Lai gan demonstrācijai ir Metropolis, Okra un Roboto, varat izmantot jebkuru fontu, kas atbilst jūsu zīmolam.

Krāsas
Suši savā paletē nodrošina arī iepriekš noteiktu krāsu komplektu. Īpaši unikāliem gadījumiem droši izmantojiet savas krāsas, taču pretējā gadījumā mēs iesakām izmantot krāsas no šīs paletes visām jūsu produkta sastāvdaļām.

Kodu krātuve