Sushi Design System - UI Kit

10 ਹਜ਼ਾਰ+
ਡਾਊਨਲੋਡ
ਸਮੱਗਰੀ ਰੇਟਿੰਗ
ਹਰੇਕ ਲਈ
ਸਕ੍ਰੀਨਸ਼ਾਟ ਚਿੱਤਰ
ਸਕ੍ਰੀਨਸ਼ਾਟ ਚਿੱਤਰ
ਸਕ੍ਰੀਨਸ਼ਾਟ ਚਿੱਤਰ
ਸਕ੍ਰੀਨਸ਼ਾਟ ਚਿੱਤਰ

ਇਸ ਐਪ ਬਾਰੇ

ਸੁਸ਼ੀ ਜ਼ੋਮੈਟੋ ਦਾ ਆਪਣਾ ਖੁਦ ਦਾ ਡਿਜ਼ਾਈਨ ਸਿਸਟਮ ਹੈ, ਜੋ ਸਾਫ਼ ਅਤੇ ਸਰਲ ਡਿਜ਼ਾਈਨ ਭਾਸ਼ਾ ਦੇ ਬਾਅਦ ਮਜ਼ਬੂਤ ​​ਯੂਜ਼ਰ ਇੰਟਰਫੇਸ ਬਣਾਉਣ ਵਿੱਚ ਮਦਦ ਕਰਦਾ ਹੈ। ਅਸੀਂ ਜ਼ੋਮੈਟੋ 'ਤੇ, ਇਸ ਨੂੰ ਜ਼ਮੀਨ ਤੋਂ ਉੱਪਰ ਬਣਾਇਆ ਹੈ। ਇਹ ਸਾਡੇ ਲਈ ਸਿਰਫ਼ ਇੱਕ ਡਿਜ਼ਾਇਨ ਸਿਸਟਮ ਨਹੀਂ ਹੈ, ਪਰ ਇਸ ਤੋਂ ਵੱਧ ਇਹ ਸਾਡੇ ਉਪਭੋਗਤਾਵਾਂ ਨੂੰ ਇੱਕ ਨਵਾਂ ਅਤੇ ਵਿਸਤ੍ਰਿਤ ਅਨੁਭਵ ਪ੍ਰਦਾਨ ਕਰਨ ਵਿੱਚ ਸਾਡੀ ਮਦਦ ਕਰਦਾ ਹੈ। ਸੁਸ਼ੀ ਪਰਮਾਣੂ, ਸਾਫ਼ ਅਤੇ ਸਧਾਰਨ ਡਿਜ਼ਾਈਨ ਭਾਸ਼ਾ ਦੀ ਪਾਲਣਾ ਕਰਦੇ ਹੋਏ ਬੇਸਪੋਕ ਉਪਭੋਗਤਾ ਇੰਟਰਫੇਸ ਬਣਾਉਣ ਵਿੱਚ ਤੁਹਾਡੀ ਮਦਦ ਕਰ ਸਕਦੀ ਹੈ। ਜਦੋਂ ਕਿ ਸੁਸ਼ੀ ਆਪਣੀ ਖੁਦ ਦੀ ਡਿਜ਼ਾਈਨ ਭਾਸ਼ਾ 'ਤੇ ਨਿਰਮਾਣ ਕਰਦੀ ਹੈ, ਇਹ ਬਹੁਤ ਸਾਰੇ ਖੇਤਰਾਂ ਵਿੱਚ ਅੰਦਰੂਨੀ ਤੌਰ 'ਤੇ Google ਦੇ ਮਟੀਰੀਅਲ ਡਿਜ਼ਾਈਨ ਦੇ ਹਿੱਸਿਆਂ ਨੂੰ ਪੂਰੀ ਤਰ੍ਹਾਂ ਗ੍ਰਹਿਣ ਕਰਦੀ ਹੈ ਅਤੇ ਵਰਤਦੀ ਹੈ।

ਇੱਕ ਡਿਜ਼ਾਈਨ ਪ੍ਰਣਾਲੀ ਅਤੇ ਬ੍ਰਾਂਡ ਦਿਸ਼ਾ-ਨਿਰਦੇਸ਼ਾਂ ਲਈ ਇੱਕ ਸੰਦਰਭ ਦੇ ਰੂਪ ਵਿੱਚ, ਇਸਦੀ ਵਰਤੋਂ Zomato ਦੇ ਅੰਦਰ ਵੱਖ-ਵੱਖ ਟੀਮਾਂ ਦੁਆਰਾ ਕੀਤੀ ਜਾਂਦੀ ਹੈ, ਜਿਵੇਂ ਕਿ - ਉਤਪਾਦ, ਇੰਜੀਨੀਅਰਿੰਗ, ਮਾਰਕੀਟਿੰਗ ਅਤੇ ਬ੍ਰਾਂਡਿੰਗ।

ਡਿਜ਼ਾਇਨ ਸਿਸਟਮ ਕੀ ਹੈ?
ਇੱਕ ਡਿਜ਼ਾਇਨ ਸਿਸਟਮ ਮੁੜ ਵਰਤੋਂ ਯੋਗ ਭਾਗਾਂ ਦਾ ਇੱਕ ਸੰਗ੍ਰਹਿ ਹੁੰਦਾ ਹੈ, ਜੋ ਸਪਸ਼ਟ ਮਾਪਦੰਡਾਂ ਦੁਆਰਾ ਸੇਧਿਤ ਹੁੰਦਾ ਹੈ, ਜਿਸ ਨੂੰ ਕਿਸੇ ਵੀ ਗਿਣਤੀ ਵਿੱਚ ਐਪਲੀਕੇਸ਼ਨ ਬਣਾਉਣ ਲਈ ਇਕੱਠੇ ਕੀਤਾ ਜਾ ਸਕਦਾ ਹੈ। ਇੱਕ ਡਿਜ਼ਾਇਨ ਸਿਸਟਮ ਕੇਵਲ ਉਹਨਾਂ ਸੰਪਤੀਆਂ ਅਤੇ ਭਾਗਾਂ ਦਾ ਸੰਗ੍ਰਹਿ ਨਹੀਂ ਹੈ ਜੋ ਤੁਸੀਂ ਇੱਕ ਡਿਜੀਟਲ ਉਤਪਾਦ ਬਣਾਉਣ ਲਈ ਵਰਤਦੇ ਹੋ। ਇੰਟਰਕਾਮ 'ਤੇ ਉਤਪਾਦ ਡਿਜ਼ਾਈਨ ਦੇ ਨਿਰਦੇਸ਼ਕ, ਐਮੇਟ ਕੋਨੋਲੀ ਦੇ ਅਨੁਸਾਰ, "... ਜ਼ਿਆਦਾਤਰ ਡਿਜ਼ਾਈਨ ਸਿਸਟਮ ਅਸਲ ਵਿੱਚ ਸਿਰਫ਼ ਪੈਟਰਨ ਲਾਇਬ੍ਰੇਰੀਆਂ ਹਨ: UI ਲੇਗੋ ਦੇ ਟੁਕੜਿਆਂ ਦਾ ਇੱਕ ਵੱਡਾ ਬਾਕਸ ਜੋ ਕਿ ਨੇੜੇ-ਅਨੰਤ ਤਰੀਕਿਆਂ ਨਾਲ ਇਕੱਠਾ ਕੀਤਾ ਜਾ ਸਕਦਾ ਹੈ। ਸਾਰੇ ਟੁਕੜੇ ਇਕਸਾਰ ਹੋ ਸਕਦੇ ਹਨ, ਪਰ ਇਸਦਾ ਮਤਲਬ ਇਹ ਨਹੀਂ ਹੈ ਕਿ ਇਕੱਠੇ ਕੀਤੇ ਨਤੀਜੇ ਹੋਣਗੇ। ਤੁਹਾਡਾ ਉਤਪਾਦ ਮੁੜ ਵਰਤੋਂ ਯੋਗ UI ਤੱਤਾਂ ਦੇ ਇੱਕ ਢੇਰ ਤੋਂ ਵੱਧ ਹੈ। ਇਸ ਦੀ ਬਣਤਰ ਅਤੇ ਅਰਥ ਹਨ। ਇਹ ਇੱਕ ਆਮ ਵੈੱਬ ਪੇਜ ਨਹੀਂ ਹੈ, ਇਹ ਸੰਕਲਪਾਂ ਦੀ ਇੱਕ ਪ੍ਰਣਾਲੀ ਦਾ ਰੂਪ ਹੈ।"

ਸੁਸ਼ੀ ਡਿਜ਼ਾਈਨ ਸਿਸਟਮ

ਫਾਊਂਡੇਸ਼ਨਾਂ
ਫਾਊਂਡੇਸ਼ਨ ਡਿਜ਼ੀਟਲ ਬ੍ਰਾਂਡ ਦਿਸ਼ਾ-ਨਿਰਦੇਸ਼ ਹਨ, ਜੋ ਕਿ ਸਾਡੇ ਡਿਜ਼ਾਈਨ ਸਿਸਟਮ ਦੇ ਟਾਈਪੋਗ੍ਰਾਫੀ, ਕਲਰ ਪੈਲੇਟਸ, ਆਈਕਨ, ਸਪੇਸਿੰਗ, ਸ਼ੈਡੋ ਅਤੇ ਜਾਣਕਾਰੀ ਆਰਕੀਟੈਕਚਰ ਨੂੰ ਪਰਿਭਾਸ਼ਿਤ ਕਰਦੇ ਹਨ। ਸੁਸ਼ੀ, ਪਰਮਾਣੂ ਡਿਜ਼ਾਇਨ ਦੇ ਸਿਧਾਂਤਾਂ ਦੀ ਪਾਲਣਾ ਕਰਦੇ ਹੋਏ, ਕੰਪੋਸੇਬਲ ਕੰਪੋਨੈਂਟਸ ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਤਲ-ਅੱਪ ਬਣਾਇਆ ਗਿਆ ਹੈ, ਪਰਮਾਣੂ ➡️ ਅਣੂਆਂ ➡️ ਜੀਵਾਂ ਦੇ ਰੂਪ ਵਿੱਚ ਆਰਡਰ ਕੀਤਾ ਗਿਆ ਹੈ।

ਪਰਮਾਣੂ ਡਿਜ਼ਾਈਨ
ਪਰਮਾਣੂ ਡਿਜ਼ਾਈਨ (ਜਿਵੇਂ ਕਿ ਬ੍ਰੈਡ ਫ੍ਰੌਸਟ ਦੁਆਰਾ ਵਰਣਨ ਕੀਤਾ ਗਿਆ ਹੈ) ਸਾਡੇ ਸਿਸਟਮ ਨਾਲ ਮੈਪ ਕੀਤਾ ਗਿਆ ਹੈ।

# ਐਟਮ
ਸਭ ਤੋਂ ਛੋਟੀਆਂ ਅਵਿਭਾਗੀ ਇਕਾਈਆਂ ਪਰਮਾਣੂ ਹਨ। ਐਂਡਰੌਇਡ (ਜਾਂ ਕਿਸੇ ਵੀ ਮੋਬਾਈਲ UI) ਵਿੱਚ ਟੈਕਸਟ ਲੇਬਲ, ਬਟਨ ਅਤੇ ਚਿੱਤਰ ਧਾਰਕ ਐਟਮ ਹਨ।

#ਅਣੂ
ਵਿਯੂਜ਼ ਜੋ ਬਣਾਉਣ ਲਈ ਕਈ ਪਰਮਾਣੂਆਂ ਨੂੰ ਸ਼ਾਮਲ ਕਰਦੇ ਹਨ, ਪਰ ਫਿਰ ਵੀ ਉਪਭੋਗਤਾ ਲਈ ਇੱਕ ਸਿੰਗਲ ਇਕਾਈ ਵਾਂਗ ਦਿਖਾਈ ਦਿੰਦੇ ਹਨ ਅਤੇ ਵਿਵਹਾਰ ਕਰਦੇ ਹਨ ਅਣੂ ਹਨ। ਉਦਾਹਰਨ ਲਈ, ਇਨਪੁਟ ਫੀਲਡ ਵਿੱਚ ਇਨਪੁਟ ਬਾਕਸ, ਐਰਰ ਫੀਲਡ, ਅਤੇ ਇੱਕ ਸਾਫ ਬਟਨ ਹੁੰਦਾ ਹੈ, ਪਰ ਇਕੱਠੇ ਇਹ ਇੱਕ ਇਕਾਈ ਹੈ।

#ਜੀਵ
ਗੁੰਝਲਦਾਰ, ਪਰ ਮੁੜ ਵਰਤੋਂ ਯੋਗ ਹਿੱਸੇ, ਜੋ ਇਕੱਠੇ ਮਿਲ ਕੇ ਕੰਮ ਕਰਦੇ ਹਨ। ਕਈ ਪਰਮਾਣੂਆਂ ਅਤੇ ਅਣੂਆਂ ਤੋਂ ਬਣਿਆ। ਪੁਆਇੰਟ ਵਿੱਚ ਇੱਕ ਕੇਸ ਰੇਟਿੰਗ ਬਾਰ ਹੈ, ਜਿਸ ਵਿੱਚ ਟੈਗ ਹੁੰਦੇ ਹਨ, ਹਰੇਕ ਵਿੱਚ ਇੱਕ ਨੰਬਰ ਅਤੇ ਇੱਕ ਆਈਕਨ ਹੁੰਦਾ ਹੈ। ਜਦੋਂ ਵੱਖ-ਵੱਖ ਰੇਟਿੰਗਾਂ ਦੀ ਚੋਣ ਕੀਤੀ ਜਾਂਦੀ ਹੈ ਤਾਂ ਟੈਗ ਰੰਗ ਵੀ ਬਦਲਦੇ ਹਨ। ਹਰੇਕ ਟੈਗ ਨੂੰ ਵੱਖਰੇ ਤੌਰ 'ਤੇ ਦੂਜੀਆਂ ਥਾਵਾਂ 'ਤੇ ਵੀ ਵਰਤਿਆ ਜਾਂਦਾ ਹੈ, ਪਰ ਇੱਕ ਰੇਟਿੰਗ ਪੱਟੀ ਵਜੋਂ, ਇਹ ਸਾਰੇ ਨਵੇਂ ਅਰਥ ਬਣਾਉਣ ਲਈ ਇਕੱਠੇ ਕੰਮ ਕਰਦੇ ਹਨ।

ਟਾਇਪੋਗ੍ਰਾਫੀ
ਟਾਈਪੋਗ੍ਰਾਫੀ, ਜਿਵੇਂ ਕਿ ਤੁਸੀਂ ਜਾਣਦੇ ਹੋਵੋਗੇ, ਪ੍ਰਦਰਸ਼ਿਤ ਹੋਣ 'ਤੇ ਲਿਖਤੀ ਭਾਸ਼ਾ ਨੂੰ ਪੜ੍ਹਨਯੋਗ, ਪੜ੍ਹਨਯੋਗ ਅਤੇ ਆਕਰਸ਼ਕ ਬਣਾਉਣ ਲਈ ਕਿਸਮ ਦੀ ਵਿਵਸਥਾ ਕਰਨ ਦੀ ਕਲਾ ਹੈ। ਕਿਸਮ ਦੀ ਵਿਵਸਥਾ ਵਿੱਚ ਟਾਈਪਫੇਸ, ਬਿੰਦੂ ਦੇ ਆਕਾਰ, ਲਾਈਨ ਦੀ ਲੰਬਾਈ, ਲਾਈਨ-ਸਪੇਸਿੰਗ, ਅਤੇ ਅੱਖਰ-ਸਪੇਸਿੰਗ, ਅਤੇ ਅੱਖਰਾਂ ਦੇ ਜੋੜਿਆਂ ਵਿਚਕਾਰ ਸਪੇਸ ਨੂੰ ਵਿਵਸਥਿਤ ਕਰਨਾ ਸ਼ਾਮਲ ਹੁੰਦਾ ਹੈ।

ਅਸੀਂ ਹੇਠਾਂ ਦਿੱਤੇ ਟਾਈਪਫੇਸ ਭਿੰਨਤਾਵਾਂ ਦਾ ਸਮਰਥਨ ਕਰਦੇ ਹਾਂ -

ਵਾਧੂ ਲਾਈਟ
ਰੋਸ਼ਨੀ
ਰੋਜਾਨਾ
ਦਰਮਿਆਨਾ
ਸੈਮੀਬੋਲਡ
ਬੋਲਡ
ਵਾਧੂ ਬੋਲਡ

ਤੁਸੀਂ ਕਿਸੇ ਵੀ ਫੌਂਟ ਦੀ ਵਰਤੋਂ ਕਰ ਸਕਦੇ ਹੋ ਜਿਸ ਵਿੱਚ 8 ਫੌਂਟ ਵਜ਼ਨ ਹਨ ਅਤੇ ਇਹਨਾਂ ਉਪਨਾਮਾਂ ਤੋਂ ਉਹਨਾਂ ਨੂੰ ਨਿਰਧਾਰਤ ਕਰੋ। ਜਦੋਂ ਕਿ ਸਾਡੇ ਕੋਲ ਡੈਮੋ ਲਈ ਮੈਟਰੋਪੋਲਿਸ, ਓਕਰਾ ਅਤੇ ਰੋਬੋਟੋ ਹੈ, ਤੁਸੀਂ ਕਿਸੇ ਵੀ ਫੌਂਟ ਦੀ ਵਰਤੋਂ ਕਰ ਸਕਦੇ ਹੋ ਜੋ ਤੁਹਾਡੇ ਬ੍ਰਾਂਡ ਨਾਲ ਜਾਂਦਾ ਹੈ।

ਰੰਗ
ਸੁਸ਼ੀ ਆਪਣੇ ਪੈਲੇਟ ਵਿੱਚ ਪਹਿਲਾਂ ਤੋਂ ਪਰਿਭਾਸ਼ਿਤ ਰੰਗਾਂ ਦਾ ਇੱਕ ਸੈੱਟ ਵੀ ਪ੍ਰਦਾਨ ਕਰਦੀ ਹੈ। ਬਹੁਤ ਹੀ ਵਿਲੱਖਣ ਮਾਮਲਿਆਂ ਲਈ, ਆਪਣੇ ਖੁਦ ਦੇ ਰੰਗਾਂ ਦੀ ਵਰਤੋਂ ਕਰਨ ਲਈ ਸੁਤੰਤਰ ਮਹਿਸੂਸ ਕਰੋ, ਪਰ ਨਹੀਂ ਤਾਂ, ਅਸੀਂ ਤੁਹਾਡੇ ਉਤਪਾਦ ਦੇ ਸਾਰੇ ਹਿੱਸਿਆਂ ਲਈ ਇਸ ਪੈਲੇਟ ਤੋਂ ਰੰਗਾਂ ਦੀ ਵਰਤੋਂ ਕਰਨ ਦੀ ਸਿਫਾਰਸ਼ ਕਰਦੇ ਹਾਂ।

ਕੋਡ ਭੰਡਾਰ
ਨੂੰ ਅੱਪਡੇਟ ਕੀਤਾ
16 ਦਸੰ 2020

ਡਾਟਾ ਸੁਰੱਖਿਆ

ਵਿਕਾਸਕਾਰ ਇੱਥੇ ਇਹ ਜਾਣਕਾਰੀ ਦਿਖਾ ਸਕਦੇ ਹਨ ਕਿ ਉਨ੍ਹਾਂ ਦੀ ਐਪ ਤੁਹਾਡੇ ਡਾਟੇ ਨੂੰ ਕਿਵੇਂ ਇਕੱਤਰ ਕਰਦੀ ਅਤੇ ਵਰਤਦੀ ਹੈ। ਡਾਟਾ ਸੁਰੱਖਿਆ ਬਾਰੇ ਹੋਰ ਜਾਣੋ
ਕੋਈ ਜਾਣਕਾਰੀ ਉਪਲਬਧ ਨਹੀਂ ਹੈ