نظام التصميم: ما هو ولماذا وكيف يتم إنشاؤه

مرحبا!

يسعدني أن أعود إليكم ، أيها القراء الأعزاء في المجتمع ، ومشاركة الخبرات والمعرفة المكتسبة من خلال العمل في شركة تكنولوجيا المعلومات Omega.

يبدو أن موضوع أنظمة التصميم قد تم النظر فيه بالفعل من جميع الجوانب: يمكنك العثور على العديد من المقالات والمنشورات والتقارير والمواد الأخرى. على الرغم من ذلك ، فإن كل من يصادف هذا المصطلح لديه العديد من الأسئلة. سأحاول الإجابة بالتفصيل على أهمها:

• ما هو نظام التصميم؟

• لما هذا؟

• كيف تصنعه؟

ما هو نظام التصميم؟

دعونا نفرزها بالترتيب. نظام التصميم هو مزيج من ثلاثة كيانات:

1. اللغة المرئية هي ما نراه.

2. الإطار هو مكتبة لغة مرئية ، رمزها.

3. إرشادات - قواعد لكيفية ظهور كل شيء وكيفية تطبيقه.

يمكن اعتبار أن نظام التصميم هو منتج منفصل داخل أي منتج من منتجات تكنولوجيا المعلومات.

لغة بصرية

يشتمل المكون المرئي لنظام التصميم على العديد من العناصر ، أهمها:

• الألوان

• UI-

– . , , . - , , , .

, , -, , , ? ? , .

Framework

– , , . .

. , « ». , « ».

, ? , . , ? , ?

, .

Guidelines

, -, « », .

, , . , - . . .

, . , ? , :

• ?

• ?

• ?

UI- : , .

, - . , - . , , .

-?

IT-, : -? , – « »?

. , . .

– . - .

, Figma . , , .

- . . .

– . .

, , , , .

, : , , .

IT- .

, : , , .

UX

, , . , , .

- user flow (, , ). , user flow .

- . , , .

-

-, , , .

-, - – . . - . : , - .

, - . - , .

, - - , , Figma. , UI-kit. , Figma ,

-?

-. , . , . (Brad Frost) «Atomic Web Design».

, :

• https://www.lightningdesignsystem.com/

• https://atlassian.design

بعد إنشاء نظام تصميم ، من المهم معرفة كيفية تنفيذه في ممارسات الشركة. في المقال الثاني سأتحدث عن كيفية بناء عملية تنفيذ نظام التصميم في أي شركة خطوة بخطوة.

آمل أن يكون الجميع قد تعلم الكثير من المقال. وكنت مقتنعًا مرة أخرى أن العمل على المقالة يبني المعرفة ويحفز على دراسة إضافية. 

شكرآ لك على أهتمامك!