‫ﺗﺠﻤﻴﻊ ﻣﺼﺎدر‬

‫ﺗﻌﻠﻢ ﺗﺼﻤﻴﻢ‬
‫واﺟﻬﺎت وﺗﺠﺮﺑﺔ‬
‫اﻟﻤﺴﺘﺨﺪم‬

‫إﻋﺪاد ‪ :‬ﻓﺎﻃﻤﺔ اﻟﻌﻤﻮدي‬

‫ﺗﻮﻳﺘﺮ‪@Alamoudiby :‬‬
 ‫ﻣﻘﺪﻣﺔ اﻟﻜﺘﺎب‬
‫اﻟﺼﻼة واﻟﺴﻼم ﻋﻠﻰ ﻧﺒﻴﻨﺎ ﻣﺤﻤﺪ وﻋﻠﻰ اﻟﻪ وﺻﺤﺒﻪ اﺟﻤﻌﻴﻦ‪.‬‬
‫أﻣﺎ ﺑﻌﺪ‪:‬‬

‫ﻫﺬا اﻟﻜﺘﺎب اﺟﺘﻬﺎد ﺷﺨﺼﻲ ﻹﻓﺎدة ﺟﻤﻴﻊ ﻣﻦ ﻳﺮﻳﺪ ﺗﻌﻠﻢ ﺗﺼﻤﻴﻢ اﻟﻮاﺟﻬﺎت‬
‫ً‬
‫ﻧﻈﺮا ﻟﻨﺪرة اﻟﻤﺼﺎدر‬ ‫وﺗﺠﺮﺑﺔ اﻟﻤﺴﺘﺨﺪم‪ .‬أﻛﺜﺮ اﻟﻤﺼﺎدر اﻟﻤﺬﻛﺮوة ﻟﻠﻐﺔ اﻹﻧﺠﻠﻴﺰﻳﺔ‬
‫ً‬
‫ﻋﺎﺋﻘﺎ ﻟﻠﺘﻌﻠﻢ‪ .‬إذا ﻓﺎدك ﻫﺬا اﻟﻜﺘﺎب ﻻﺗﻨﺴﻰ ذﻛﺮي‬ ‫اﻟﻌﺮﺑﻴﺔ ﻟﻜﻦ ﻻﺗﺠﻌﻞ اﻟﻠﻐﺔ‬
‫ً‬
‫ﺳﻠﻜﺎ وﻳﻨﻔﻊ ﺑﻌﻠﻤﻚ‬ ‫وواﻟﺪي ﺑﺪﻋﻮة ﻃﻴﺒﺔ‪ .‬أﺳﺎل اﻟﻠﻪ ان ﻳﺠﻌﻞ ﻃﺮﻳﻖ ﺗﻌﻠﻤﻚ‬
‫وﺗﻘﻄﻒ ﺛﻤﺎر ﺟﻬﺪك‪.‬‬

‫ﺗﻤﻨﻴﺎﺗﻲ ﻟﻚ ﻟﺘﻮﻓﻴﻖ‪:‬‬
‫ﻓﺎﻃﻤﺔ اﻟﻌﻤﻮدي‬
 ‫ﻟﻤﻦ ﻫﺬا اﻟﻜﺘﺎب؟‬

‫ﻣﻦ ﻳﺮﻳﺪ ﺗﻌﻠﻢ ﺗﺼﻤﻴﻢ واﺟﻬﺎت وﺗﺠﺮﺑﺔ اﻟﻤﺘﺴﺘﺨﺪم ﺑﺸﻜﻞ ذاﺗﻲ‬

‫ﻣﻦ ﻳﺮﻳﺪ ﺧﻄﺔ واﺿﺤﺔ ﻟﺘﻌﻠﻢ ﺗﺼﻤﻴﻢ اﻟﻮاﺟﻬﺎت وﺗﺠﺮﺑﺔ اﻟﻤﺴﺘﺨﺪم‬

‫ﻣﻦ ﻳﺮﻳﺪ ﺗﺠﻤﻴﻊ ﻟﻤﺼﺎدر ﺗﻌﻠﻢ ﺗﺼﻤﻴﻢ اﻟﻮاﺟﻬﺎت وﺗﺠﺮﺑﺔ اﻟﻤﺴﺘﺨﺪم‬

 ‫ﻣﺎذا ﻳﺤﺘﻮي ﻫﺬا اﻟﻜﺘﺎب؟‬

‫ﺧﻄﺔ ﻟﺘﻌﻠﻢ ﺗﺼﻤﻴﻢ اﻟﻮاﺟﻬﺎت وﺗﺠﺮﺑﺔ اﻟﻤﺴﺘﺨﺪم‬

‫ﻣﺼﺎدر ﻟﺘﻌﻠﻢ ﺗﺼﻤﻴﻢ اﻟﻮاﺟﻬﺎت وﺗﺠﺮﺑﺔ اﻟﻤﺴﺘﺤﺪم ﻣﻘﺴﻤﺔ ﻋﻠﻰ ﺣﺴﺐ‬

‫اﻟﻤﻮاﺿﻴﻊ‬

‫ﻧﻘﺎط ﻟﻠﺘﺤﻘﻖ ﻣﻦ ﻓﻬﻤﻚ ﺑﻌﺪ ﻛﻞ ﻣﻮﺿﻮع‬

‫ﻧﻘﺎط ﻟﻠﺘﻄﺒﻴﻖ اﻟﻌﻤﻠﻲ ﻟﻠﺘﺄﻛﺪ ﻣﻦ ﻓﻬﻢ اﻟﻤﻮﺿﻮع‬

‫ﻗﺎﻟﺐ ﻧﻮﺷﺒﻦ ﻟﺘﺘﺒﻊ اﻟﺘﻘﺪم ﻓﻲ اﻟﻜﻮرس‬

 ‫ﻛﻴﻒ ﺗﺤﻘﻖ اﻹﺳﺘﻔﺎدة‬
‫اﻟﻘﺼﻮى ﻣﻦ اﻟﻜﺘﺎب؟‬

‫ﺣﺪد ﻓﻜﺮة ﺗﻄﺒﻴﻖ أو ﻣﻮﻗﻊ ﻗﺒﻞ اﻟﺒﺪء ﻟﺘﺼﻤﻴﻤﻬﺎ‬

‫ﺗﺪوﻳﻦ ﻣﻼﺣﻈﺎت ﺳﺘﺨﺪام ﺗﻄﺒﻴﻖ ﻧﻮﺷﻴﻦ أو ﺗﻄﺒﻴﻘﻚ اﻟﻤﻔﻀﻞ‪.‬‬

‫راﺑﻂ ﻗﺎﻟﺐ ﻧﻮﺷﻴﻦ‬

‫اﻟﺘﻄﺒﻴﻖ اﻟﻌﻤﻠﻲ ﻓﻲ ﻧﻬﺎﻳﺔ ﻛﻞ درس ﻟﺘﺜﺒﻴﺖ اﻟﻤﻌﻠﻮﻣﺔ‬

‫ﺷﺎرك ﻣﺎ ﺗﻌﻠﻤﺘﻪ ﻋﻠﻰ ﻣﻮاﻗﻊ اﻟﺘﻮاﺻﻞ اﻹﺟﺘﻤﺎﻋﻲ ﻹﻓﺎدة ﻧﻔﺴﻚ‬

‫وﻏﻴﺮك‬
‫‪8‬‬ ‫(‪ )Map Learning‬خريطة التعلم‬

‫‪11‬‬ ‫(‪ )UX Laws‬قوانين تجربة المستخدم‬

‫‪13‬‬ ‫(‪ )Competitive Analysis‬تحليل المنافسين‬

‫‪15‬‬ ‫(‪ )User Flow‬سير المستخدم‬

‫‪17‬‬ ‫(‪ )User Journey‬رحلة المستخدم‬

‫‪19‬‬ ‫(‪ )User Research‬بحث المستخدم‬

‫‪21‬‬ ‫(‪ )User Persona‬شخصية المستخدم‬

‫‪23‬‬ ‫(‪ )Pain Points‬نقاط الصعوبة‬

‫‪25‬‬ ‫(‪ )Inclusive Design‬التصميم الشامل‬

‫‪27‬‬ ‫(‪ )Design Process‬عملية التصميم‬

‫‪29‬‬ ‫(‪ )KPIs‬مؤشرات األداء‬

‫‪31‬‬ ‫(‪ )Usability Testing‬اختبار قابلية اإلستخدام‬

‫‪34‬‬ ‫(‪ )Color Theory‬نظرية األلوان‬

‫‪36‬‬ ‫(‪ )Color Contrast‬تباين األلوان‬

‫‪38‬‬ ‫‪Mood Board‬‬

‫‪40‬‬ ‫(‪ )Consistency‬التناسق‬

‫‪42‬‬ ‫(‪ )Design System‬نظام التصميم‬

‫‪44‬‬ ‫(‪ )Style Guide‬دليل التصميم‬

‫‪46‬‬ ‫(‪ )Responsive Design‬التصميم المتجاوب‬

‫‪48‬‬ ‫(‪ )Accessibility‬الوصول‬

‫‪50‬‬ ‫(‪ )Visual Hierarchy‬التسلسل الهرمي‬

‫‪52‬‬ ‫(‪ )Typography‬الخطوط‬

‫‪54‬‬ ‫()‪Wireframes‬‬

‫‪56‬‬ ‫(‪ )Prototype‬النموذج األولي‬

‫‪57‬‬ ‫مصادر اخرى لتعلم تصميم الواجهات وتجربة المستخدم‬

‫‪58‬‬ ‫ماذا بعد ذلك؟‬

‫‪6‬‬
 ‫ﺧﺮﻳﻄﺔ اﻟﺘﻌﻠﻢ‬
(Learning Map)
(Map Learning) ‫ﺧﺮﻳﻄﺔ اﻟﺘﻌﻠﻢ‬

8
‫ﺗﺼﻤﻴﻢ ﺗﺠﺮﺑﺔ‬
‫اﻟﻤﺴﺘﺨﺪم‬
‫)‪(UX Desgin‬‬
‫ﻗﻮاﻧﻴﻦ ﺗﺠﺮﺑﺔ‬
‫اﻟﻤﺴﺘﺨﺪم‬
‫)‪(UX Laws‬‬
‫ﻗﻮاﻧﲔ ﺗﺠﺮﺑﺔ اﻟﻤﺴﺘﺨﺪم )‪(UX Laws‬‬

‫ﻣﺼﺎدر اﻟﺘﻌﻠﻢ‪:‬‬

‫اﻟﻤﺼﺪر اﻷول‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻧﻲ‬

‫اﻟﺘﺤﻘﻖ ﻣﻦ اﻟﻔﻬﻢ‪:‬‬

‫ﻣﺎ ﻫﻲ ﻗﻮاﻧﲔ ﺗﺠﺮﺑﺔ اﻟﻤﺴﺘﺨﺪم؟‬

‫ﻓﻬﻢ ﻛﻴﻔﻴﺔ ﺗﻄﺒﻴﻖ ﻗﻮاﻧﲔ ﺗﺠﺮﺑﺔ اﻟﻤﺴﺘﺨﺪم‪.‬‬

‫اﻟﺘﻄﺒﻴﻖ اﻟﻌﻤﲇ‪:‬‬

‫ﺗﻄﺒﻴﻖ ﻗﻮاﻧﲔ ﺗﺠﺮﺑﺔ اﻟﻤﺴﺘﺨﺪم اﻟﻤﻤﻜﻦ ﺗﻄﺒﻴﻘﻬﺎ ﻋﲆ ﺗﺼﻤﻴﻤﻚ‪.‬‬

‫‪11‬‬
‫ﺗﺤﻠﻴﻞ اﻟﻤﻨﺎﻓﺴﻴﻦ‬
Competitve)
(Analysis
‫ﺗﺤﻠﻴﻞ اﻟﻤﻨﺎﻓﺴﲔ )‪(Competitive Analysis‬‬

‫ﻣﺼﺎدر اﻟﺘﻌﻠﻢ‪:‬‬

‫اﻟﻤﺼﺪر اﻷول‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻧﻲ‬

‫ﺗﺤﺪي‬

‫اﻟﺘﺤﻘﻖ ﻣﻦ اﻟﻔﻬﻢ‪:‬‬

‫ﻣﺎ ﻫﻮ ﺗﺤﻠﻴﻞ اﻟﻤﻨﺎﻓﺴﲔ؟‬

‫ﻣﺎ أﻫﻤﻴﺔ ﻋﻤﻞ ﺗﺤﻠﻴﻞ اﻟﻤﻨﺎﻓﺴﲔ ﻗﺒﻞ ﺑﺪء اﻟﺘﺼﻤﻴﻢ؟‬

‫اﻟﺘﻄﺒﻴﻖ اﻟﻌﻤﲇ‪:‬‬

‫ﻋﻤﻞ ﺗﺤﻠﻴﻞ ﻟﻠﻤﻨﺎﻓﺴﲔ أﺻﺤﺎب ﻧﻔﺲ ﻓﻜﺮة ﺗﺼﻤﻴﻤﻚ ﻣﻦ ﺣﻮﻟﻚ‪.‬‬

‫‪13‬‬
‫ﺳﻴﺮ اﻟﻤﺴﺘﺨﺪم‬
‫)‪(User Flow‬‬
‫ﺳﲑ اﻟﻤﺴﺘﺨﺪم )‪(User Flow‬‬

‫ﻣﺼﺎدر اﻟﺘﻌﻠﻢ‪:‬‬

‫اﻟﻤﺼﺪر اﻷول‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻧﻲ‬

‫ﺗﺤﺪي‬

‫اﻟﺘﺤﻘﻖ ﻣﻦ اﻟﻔﻬﻢ‪:‬‬

‫ﻣﺎ ﻫﻮ ﺳﲑ اﻟﻤﺴﺘﺨﺪم وﻣﺎ أﻫﻤﻴﺘﻪ؟‬

‫ﻣﺎ أﻧﻮاع ﺳﲑ اﻟﻤﺴﺘﺨﺪم؟‬

‫ﻛﻴﻔﻴﺔ ﺗﺼﻤﻴﻢ ﺳﲑ اﻟﻤﺴﺘﺨﺪم؟‬

‫اﻟﺘﻄﺒﻴﻖ اﻟﻌﻤﲇ‪:‬‬

‫ﻋﻤﻞ ‪ User Flow‬ﻻﺣﺪى اﻟﻤﻬﻤﺎت ﻓﻲ اﻟﺘﻄﺒﻴﻖ‪.‬‬

‫‪15‬‬
 ‫رﺣﻠﺔ اﻟﻤﺴﺘﺨﺪم‬
‫)‪(User Journey‬‬
‫رﺣﻠﺔ اﻟﻤﺴﺘﺨﺪم )‪(User Journey‬‬

‫ﻣﺼﺎدر اﻟﺘﻌﻠﻢ‪:‬‬

‫اﻟﻤﺼﺪر اﻷول‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻧﻲ‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻟﺚ‬

‫ﺗﺤﺪي‬

‫اﻟﺘﺤﻘﻖ ﻣﻦ اﻟﻔﻬﻢ‪:‬‬

‫ﻣﺎ ﻫﻲ رﺣﻠﺔ اﻟﻤﺴﺘﺨﺪم وﻣﺎ أﻫﻤﻴﺘﻬﺎ؟‬

‫ﻛﻴﻔﻴﺔ ﺗﺼﻤﻴﻢ رﺣﻠﺔ اﻟﻤﺴﺘﺨﺪم؟‬

‫اﻟﺘﻄﺒﻴﻖ اﻟﻌﻤﲇ‪:‬‬

‫ﻋﻤﻞ ‪ User Journey‬ﻟﻠﺘﻄﺒﻴﻖ‪.‬‬

‫‪17‬‬
 ‫ﺑﺤﺚ اﻟﻤﺴﺘﺨﺪم‬
(User Research)
‫ﺑﺤﺚ اﻟﻤﺴﺘﺨﺪم )‪(User Research‬‬

‫ﻣﺼﺎدر اﻟﺘﻌﻠﻢ‪:‬‬

‫اﻟﻤﺼﺪر اﻷول‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻧﻲ‬

‫ﺗﺤﺪي‬

‫اﻟﺘﺤﻘﻖ ﻣﻦ اﻟﻔﻬﻢ‪:‬‬

‫ﻣﺎ ﻫﻮ ﺑﺤﺚ اﻟﻤﺴﺘﺨﺪم وﻣﺎ أﻫﻤﻴﺘﻪ؟‬

‫ﻣﺎ ﻫﻲ اﻟﻄﺮق اﻟﻤﺨﺘﻠﻔﺔ ﻟﻠﺒﺤﺚ اﻟﻤﺴﺘﺨﺪم؟‬

‫اﻟﺘﻄﺒﻴﻖ اﻟﻌﻤﲇ‪:‬‬

‫ﻋﻤﻞ ‪ User Research‬ﻟﻤﺴﺘﺨﺪﻣﻲ اﻟﺘﻄﺒﻴﻖ اﻟﻤﺤﺘﻤﻠﲔ‪.‬‬

‫‪19‬‬
 ‫ﺷﺨﺼﻴﺔ‬
‫اﻟﻤﺴﺘﺨﺪم‬
‫)‪(User Persona‬‬
‫ﺷﺨﺼﻴﺔ اﻟﻤﺴﺘﺨﺪم )‪(User Persona‬‬

‫ﻣﺼﺎدر اﻟﺘﻌﻠﻢ‪:‬‬

‫اﻟﻤﺼﺪر اﻷول‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻧﻲ‬

‫ﺗﺤﺪي‬

‫اﻟﺘﺤﻘﻖ ﻣﻦ اﻟﻔﻬﻢ‪:‬‬

‫ﻣﺎ ﻫﻲ ﺷﺨﺼﻴﺔ اﻟﻤﺴﺘﺨﺪم؟‬

‫ﻛﻴﻔﻴﺔ ﺗﺼﻤﻴﻢ ﺷﺨﺼﻴﺔ اﻟﻤﺴﺘﺨﺪم؟‬

‫اﻟﺘﻄﺒﻴﻖ اﻟﻌﻤﲇ‪:‬‬

‫ﻋﻤﻞ ‪ User Persona‬ﻟﻤﺴﺘﺨﺪﻣﻲ اﻟﺘﻄﺒﻴﻖ اﻟﻤﺤﺘﻤﻠﲔ‪.‬‬

‫‪21‬‬
‫ﻧﻘﺎط اﻟﺼﻌﻮﺑﺔ‬
‫)‪(Pain Points‬‬
 ‫ﻧﻘﺎط اﻟﺼﻌﻮﺑﺔ )‪(Pain Points‬‬

‫ﻣﺼﺎدر اﻟﺘﻌﻠﻢ‪:‬‬

‫اﻟﻤﺼﺪر اﻷول‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻧﻲ‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻟﺚ‬

‫اﻟﺘﺤﻘﻖ ﻣﻦ اﻟﻔﻬﻢ‪:‬‬

‫ﻣﺎ ﻫﻲ ﻧﻘﺎط اﻟﺼﻌﻮﺑﺔ ﻟﺪى اﻟﻤﺴﺘﺨﺪم؟‬

‫ﻣﺎ ﻫﻲ أﻫﻤﻴﺔ ﺣﻞ ﻣﺸﺎﻛﻞ اﻟﻨﺎﺗﺠﺔ ﻋﻦ ﻧﻘﺎط اﻟﺼﻌﻮﺑﺔ؟‬

‫اﻟﺘﻄﺒﻴﻖ اﻟﻌﻤﲇ‪:‬‬

‫ﺣﻞ ﻧﻘﺎط اﻟﺼﻌﻮﺑﺔ ﻟﺪى ﻣﺴﺘﺨﺪﻣﻲ ﺗﻄﺒﻴﻘﻚ إن وﺟﺪت )ﻳﻤﻜﻦ اﻛﺘﺸﺎف ﻧﻘﺎط اﻟﺼﻌﻮﺑﺔ ﻓﻲ‬

‫اﻟﺘﻄﺒﻴﻖ ﻣﻦ ﺧﻼل ﺗﺠﺮﺑﺘﻪ ﻣﻦ ﻗﺒﻞ ﺻﺪﻳﻖ(‪.‬‬

‫‪23‬‬
‫اﻟﺘﺼﻤﻴﻢ اﻟﺸﺎﻣﻞ‬
Inclusive)
(Design
 ‫اﻟﺘﺼﻤﻴﻢ اﻟﺸﺎﻣﻞ )‪(Inclusive Design‬‬

‫ﻣﺼﺎدر اﻟﺘﻌﻠﻢ‪:‬‬

‫اﻟﻤﺼﺪر اﻷول‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻧﻲ‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻟﺚ‬

‫اﻟﺘﺤﻘﻖ ﻣﻦ اﻟﻔﻬﻢ‪:‬‬

‫ﻣﺎ ﻫﻮ اﻟﺘﺼﻤﻴﻢ اﻟﺸﺎﻣﻞ وﻣﺎ أﻫﻤﻴﺘﻪ؟‬

‫ﻛﻴﻔﻴﺔ ﻋﻤﻞ ﺗﺼﻤﻴﻢ ﺷﺎﻣﻞ؟‬

‫اﻟﺘﻄﺒﻴﻖ اﻟﻌﻤﲇ‪:‬‬

‫ﺗﺄﻛﺪ ﻣﻦ أن ﺗﺼﻤﻴﻤﻚ ﺗﺼﻤﻴﻢ ﺷﺎﻣﻞ وﻏﲑ ﻣﻨﺤﺎز ﻟﻔﺌﺔ أو ﺛﻘﺎﻓﺔ ﻣﻌﻴﻨﺔ إﻻ إذا ﻛﻨﺖ ﺗﺴﺘﻬﺪف ﻓﺌﺔ‬

‫ﻣﻌﻴﻨﺔ‪.‬‬

‫‪25‬‬
‫ﻋﻤﻠﻴﺔ اﻟﺘﺼﻤﻴﻢ‬
Design)
(Process
‫ﻋﻤﻠﻴﺔ اﻟﺘﺼﻤﻴﻢ )‪(Design Process‬‬

‫ﻣﺼﺎدر اﻟﺘﻌﻠﻢ‪:‬‬

‫اﻟﻤﺼﺪر اﻷول‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻧﻲ‬

‫اﻟﺘﺤﻘﻖ ﻣﻦ اﻟﻔﻬﻢ‪:‬‬

‫ﻣﺎﻫﻲ اﻟﺨﻄﻮات اﻟﻤﺘﺒﻌﺔ ﻓﻲ ﻋﻤﻠﻴﺔ اﻟﺘﺼﻤﻴﻢ؟‬

‫ﻓﻬﻢ اﻟﻨﺎﺗﺞ اﻟﻨﻬﺎﺋﻲ ﻓﻲ ﺧﻄﻮات ﻋﻤﻠﻴﺔ اﻟﺘﺼﻤﻴﻢ‪.‬‬

‫اﻟﺘﻄﺒﻴﻖ اﻟﻌﻤﲇ‪:‬‬

‫اﺗﺒﺎع ﺧﻄﻮات ﻋﻤﻠﻴﺔ اﻟﺘﺼﻤﻴﻢ ﻓﻲ ﻋﻤﻞ اﻟﺘﺼﻤﻴﻢ‪.‬‬

‫‪27‬‬
‫ﻣﺆﺷﺮات اﻷداء‬
‫)‪(KPIs‬‬
 ‫ﻣﺆﴍات اﻷداء )‪(KPIs‬‬

‫ﻣﺼﺎدر اﻟﺘﻌﻠﻢ‪:‬‬

‫اﻟﻤﺼﺪر اﻷول‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻧﻲ‬

‫اﻟﺘﺤﻘﻖ ﻣﻦ اﻟﻔﻬﻢ‪:‬‬

‫ﻣﺎ ﻫﻲ ﻣﺆﴍات اﻷداء؟‬

‫ﻣﺎ أﻫﻤﻴﺔ ﻗﻴﺎس ﻣﺆﴍات اﻷداء؟‬

‫اﻟﺘﻄﺒﻴﻖ اﻟﻌﻤﲇ‪:‬‬

‫ﻗﻴﺎس ﻣﺆﴍات اﻷداء ﻟﺘﺼﻤﻴﻤﻚ إذا ﺗﻢ اﺧﺘﻴﺎره ﻣﻦ ﻗﺒﻞ ﻣﺴﺘﺨﺪﻣﲔ‪.‬‬

‫‪29‬‬
‫اﺧﺘﺒﺎر ﻗﺎﺑﻠﻴﺔ‬
‫اﻹﺳﺘﺨﺪام‬
‫)‪Usability‬‬
‫‪(Testing‬‬
‫اختبار قابلية اإلستخدام )‪(Usability Testing‬‬

‫مصادر التعلم‪:‬‬

‫المصدر األول‬

‫المصدر الثاني‬

‫تحدي‬

‫التحقق من الفهم‪:‬‬

‫ما هو اختبار قابلية اإلستخدام؟‬

‫كيفية اختبار قابلية اإلستخدام لتصميمك؟‬

‫التطبيق العميل‪:‬‬

‫عمل اختبار قابلية اإلستخدام لتصميمك من قبل صديق‪.‬‬

‫‪6‬‬
 ‫ﺗﺼﻤﻴﻢ‬
‫اﻟﻮاﺟﻬﺎت‬
‫)‪(UI Design‬‬
 ‫ﻧﻈﺮﻳﺔ اﻷﻟﻮان‬
(Color Theory)
‫ﻧﻈﺮﻳﺔ اﻷﻟﻮان )‪(Color Theory‬‬

‫ﻣﺼﺎدر اﻟﺘﻌﻠﻢ‪:‬‬

‫اﻟﻤﺼﺪر اﻷول‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻧﻲ‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻟﺚ‬

‫اﻟﺘﺤﻘﻖ ﻣﻦ اﻟﻔﻬﻢ‪:‬‬

‫ﻣﻌﺮﻓﺔ اﻷﻧﻮاع اﻟﻤﺨﺘﻠﻔﺔ ﻟﻸﻟﻮان‬

‫ﻣﻌﺮﻓﺔ اﻟﻤﺴﻤﻴﺎت اﻟﻤﺨﺘﻠﻔﺔ ﻟﻤﺠﻤﻮﻋﺔ اﻷﻟﻮان‬

‫ﻣﻌﺮﻓﺔ ﻣﻌﺎﻧﻲ اﻷﻟﻮان‬

‫اﻟﺘﻄﺒﻴﻖ اﻟﻌﻤﲇ‪:‬‬

‫ﺗﺠﻬﲒ ﻣﺠﻤﻮﻋﺔ اﻟﻮان ﻟﺘﺼﻤﻴﻤﻚ‬

‫‪34‬‬
 ‫ﺗﺒﺎﻳﻦ اﻷﻟﻮان‬
(Color Contrast)
 ‫ﺗﺒﺎﻳﻦ اﻷﻟﻮان )‪(Color Contrast‬‬

‫ﻣﺼﺎدر اﻟﺘﻌﻠﻢ‪:‬‬

‫اﻟﻤﺼﺪر اﻷول‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻧﻲ‬

‫ﻣﻮﻗﻊ ﻟﻠﺘﺤﻘﻖ ﻣﻦ ﻧﺴﺒﺔ ﺗﺒﺎﻳﻦ اﻷﻟﻮان‬

‫اﻟﺘﺤﻘﻖ ﻣﻦ اﻟﻔﻬﻢ‪:‬‬

‫ﻣﺎ ﻫﻮ ﺗﺒﺎﻳﻦ اﻷﻟﻮان وﻣﺎ أﻫﻤﻴﺔ ﺗﻄﺒﻴﻘﻪ ؟‬

‫ﻛﻴﻔﻴﺔ ﺗﻄﺒﻴﻖ ﺗﺒﺎﻳﻦ اﻷﻟﻮان؟‬

‫ﻛﻴﻔﻴﺔ اﻟﺘﺤﻘﻖ ﻣﻦ ﻧﺴﺒﺔ ﺗﺒﺎﻳﻦ اﻷﻟﻮان ﻓﻲ اﻟﺘﺼﻤﻴﻢ؟‬

‫اﻟﺘﻄﺒﻴﻖ اﻟﻌﻤﲇ‪:‬‬

‫ﺗﺤﻘﻖ وﺗﺄﻛﺪ ﻣﻦ ﺗﺠﺎوز اﻟﺨﻄﻮط ﻓﻲ ﺗﺼﻤﻴﻤﻚ ﻧﺴﺒﺔ اﻟﺘﺒﺎﻳﻦ اﻟﻤﻮﴅ ﺑﻬﺎ‪.‬‬

‫‪36‬‬
(Mood Board)
‫‪Mood Board‬‬

‫ﻣﺼﺎدر اﻟﺘﻌﻠﻢ‪:‬‬

‫اﻟﻤﺼﺪر اﻷول‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻧﻲ‬

‫اﻟﺘﺤﻘﻖ ﻣﻦ اﻟﻔﻬﻢ‪:‬‬

‫ﻣﻌﺮﻓﺔ ﻣﻌﲎ ‪ Mood Board‬واﻟﻬﺪف ﻣﻨﻪ‬

‫اﻟﺘﻄﺒﻴﻖ اﻟﻌﻤﲇ‪:‬‬

‫ﻋﻤﻞ ‪ Mood Board‬ﻟﺘﺼﻤﻴﻤﻚ‪.‬‬

‫‪38‬‬
 ‫اﻟﺘﻨﺎﺳﻖ‬
(Consistency)
‫اﻟﺘﻨﺎﺳﻖ )‪(Consistency‬‬

‫ﻣﺼﺎدر اﻟﺘﻌﻠﻢ‪:‬‬

‫اﻟﻤﺼﺪر اﻷول‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻧﻲ‬

‫اﻟﺘﺤﻘﻖ ﻣﻦ اﻟﻔﻬﻢ‪:‬‬

‫أﻫﻤﻴﺔ اﻟﺘﻨﺎﺳﻖ ﻓﻲ اﻟﺘﺼﻤﻴﻢ‪.‬‬

‫ﻛﻴﻔﻴﺔ ﺗﺤﻘﻴﻖ اﻟﺘﻨﺎﺳﻖ ﻓﻲ اﻟﺘﺼﻤﻴﻢ‪.‬‬

‫اﻟﺘﻄﺒﻴﻖ اﻟﻌﻤﲇ‪:‬‬

‫ﻃﺒﻖ أﻓﻜﺎر ﺗﺤﻘﻖ اﻟﺘﻨﺎﺳﻖ ﻓﻲ ﺗﺼﻤﻴﻤﻚ‪.‬‬

‫‪40‬‬
 ‫ﻧﻈﺎم اﻟﺘﺼﻤﻴﻢ‬
(Design System)
 ‫ﻧﻈﺎم اﻟﺘﺼﻤﻴﻢ )‪(Design System‬‬

‫ﻣﺼﺎدر اﻟﺘﻌﻠﻢ‪:‬‬

‫اﻟﻤﺼﺪر اﻷول‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻧﻲ‬

‫ﺗﺤﺪي‬

‫اﻟﺘﺤﻘﻖ ﻣﻦ اﻟﻔﻬﻢ‪:‬‬

‫اﻟﺘﻌﺮف ﻋﲆ ﻣﻌﲎ ﻧﻈﺎم اﻟﺘﺼﻤﻴﻢ واﻟﻔﺎﺋﺪة ﻣﻨﻪ‪.‬‬

‫اﻹﻃﻼع ﻋﲆ أﻧﻈﻤﺔ اﻟﺘﺼﻤﻴﻢ اﻟﻤﺸﻬﻮرة ﻣﺜﻞ ‪.Material Design, Apple Interface Guidelines‬‬

‫اﻟﺘﻄﺒﻴﻖ اﻟﻌﻤﲇ‪:‬‬

‫ﻣﻤﻜﻦ ان ﺗﺄﺧﺬ أﻓﻜﺎر أو ﻋﻨﺎﴏ ﺗﺼﻤﻴﻢ ﻣﻦ أﻧﻈﻤﺔ ﺗﺼﻤﻴﻢ ﻣﺨﺘﻠﻔﺔ‪.‬‬

‫‪42‬‬
‫دﻟﻴﻞ اﻟﺘﺼﻤﻴﻢ‬
‫)‪(Style Guide‬‬
 ‫دﻟﻴﻞ اﻟﺘﺼﻤﻴﻢ )‪(Style Guide‬‬

‫ﻣﺼﺎدر اﻟﺘﻌﻠﻢ‪:‬‬

‫اﻟﻤﺼﺪر اﻷول‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻧﻲ‬

‫اﻟﺘﺤﻘﻖ ﻣﻦ اﻟﻔﻬﻢ‪:‬‬

‫ﻣﺎﻫﻮ دﻟﻴﻞ اﻟﺘﺼﻤﻴﻢ؟‬

‫ﻣﺎ أﻫﻤﻴﺔ دﻟﻴﻞ اﻟﺘﺼﻤﻴﻢ؟‬

‫اﻟﺘﻄﺒﻴﻖ اﻟﻌﻤﲇ‪:‬‬

‫اﻟﻌﻤﻞ ﻋﲆ ﺗﻜﻮﻳﻦ دﻟﻴﻞ ﺗﺼﻤﻴﻢ ﻟﺘﺼﻤﻴﻤﻚ )اﺧﺘﻴﺎري ﻷﻧﻪ ﻟﻴﺲ ﻣﻦ ﻣﻬﻤﺎت ﻣﺼﻤﻢ اﻟﻮاﺟﻬﺎت‬

‫وﺗﺠﺮﺑﺔ اﻟﻤﺴﺘﺨﺪم(‪.‬‬

‫‪44‬‬
‫اﻟﺘﺼﻤﻴﻢ اﻟﻤﺘﺠﺎوب‬
Responsive)
(Desgin
 ‫اﻟﺘﺼﻤﻴﻢ اﻟﻤﺘﺠﺎوب )‪(Responsive Design‬‬

‫ﻣﺼﺎدر اﻟﺘﻌﻠﻢ‪:‬‬

‫اﻟﻤﺼﺪر اﻷول‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻧﻲ‬

‫اﻟﺘﺤﻘﻖ ﻣﻦ اﻟﻔﻬﻢ‪:‬‬

‫ﻣﺎ ﻫﻮ اﻟﺘﺼﻤﻴﻢ اﻟﻤﺘﺠﺎوب وﻣﺎ أﻫﻤﻴﺘﻪ؟‬

‫ﻛﻴﻔﻴﺔ ﻋﻤﻞ ﺗﺼﻤﻴﻢ ﻣﺘﺠﺎوب‪.‬‬

‫اﻟﺘﻄﺒﻴﻖ اﻟﻌﻤﲇ‪:‬‬

‫اﻟﺘﺄﻛﺪ ﻣﻦ ﺗﻄﺒﻴﻖ أﺳﺎﺳﻴﺎت اﻟﺘﺼﻤﻴﻢ اﻟﻤﺘﺠﺎوب إذا ﻛﺎﻧﺖ ﻓﻜﺮة ﺗﺼﻤﻴﻢ ﻣﻮﻗﻊ‪.‬‬

‫‪46‬‬
 ‫اﻟﻮﺻﻮل‬
(Accessibility)
‫اﻟﻮﺻﻮل )‪(Accessibility‬‬

‫ﻣﺼﺎدر اﻟﺘﻌﻠﻢ‪:‬‬

‫اﻟﻤﺼﺪر اﻷول‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻧﻲ‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻟﺚ‬

‫ﺗﺤﺪي‬

‫اﻟﺘﺤﻘﻖ ﻣﻦ اﻟﻔﻬﻢ‪:‬‬

‫ﻣﺎﻫﻲ ‪ accessibility‬ﻓﻲ اﻟﺘﺼﻤﻴﻢ وﻣﺎ أﻫﻤﻴﺘﻬﺎ؟‬

‫ﻛﻴﻔﻴﺔ ﺗﺤﻘﻴﻖ ‪ accessibility‬ﻓﻲ اﻟﺘﺼﻤﻴﻢ‪.‬‬

‫اﻟﺘﻄﺒﻴﻖ اﻟﻌﻤﲇ‪:‬‬

‫ﺗﻄﺒﻴﻖ ﻣﺎﺗﻌﻠﻤﺘﻪ ﻣﻦ أﺳﺎﺳﻴﺎت ‪ accessibility‬ﻋﲆ ﺗﺼﺎﻣﻴﻤﻚ‪.‬‬

‫‪48‬‬
‫اﻟﺘﺴﻠﺴﻞ اﻟﻬﺮﻣﻲ‬
(Visual
Hierarchy)
 ‫اﻟﺘﺴﻠﺴﻞ اﻟﻬﺮﻣﻲ )‪(Visual Hierarchy‬‬

‫ﻣﺼﺎدر اﻟﺘﻌﻠﻢ‪:‬‬

‫اﻟﻤﺼﺪر اﻷول‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻧﻲ‬

‫اﻟﺘﺤﻘﻖ ﻣﻦ اﻟﻔﻬﻢ‪:‬‬

‫ﻣﺎ ﻫﻮ اﻟﺘﺴﻠﺴﻞ اﻟﻬﺮﻣﻲ وﻣﺎ ﻓﺎﺋﺪة ﺗﻄﺒﻴﻘﻪ؟‬

‫ﻛﻴﻔﻴﺔ ﺗﻄﺒﻴﻖ اﻟﺘﺴﻠﺴﻞ اﻟﻬﺮﻣﻲ؟‬

‫اﻟﺘﻄﺒﻴﻖ اﻟﻌﻤﲇ‪:‬‬

‫اﺑﺤﺚ ﻋﻦ اﻟﻄﺮﻳﻘﺔ اﻟﻤﻨﺎﺳﺒﺔ ﻟﺘﻄﺒﻴﻖ ﻓﻜﺮة اﻟﺘﺴﻠﺴﻞ اﻟﻬﺮﻣﻲ ﻓﻲ ﺗﺼﻤﻴﻤﻚ‪.‬‬

‫‪50‬‬
 ‫اﻟﺨﻄﻮط‬
(Typography)
‫اﻟﺨﻄﻮط )‪(Typography‬‬

‫ﻣﺼﺎدر اﻟﺘﻌﻠﻢ‪:‬‬

‫اﻟﻤﺼﺪر اﻷول‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻧﻲ‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻟﺚ‬

‫اﻟﺘﺤﻘﻖ ﻣﻦ اﻟﻔﻬﻢ‪:‬‬

‫اﻟﺘﻌﺮف ﻋﲆ ﺧﺼﺎﺋﺺ اﻟﺨﻄﻮط‪.‬‬

‫اﻟﺘﻌﺮف ﻋﲆ أﻧﻮاع اﻟﺨﻄﻮط اﻟﻤﺨﺘﻠﻔﺔ‪.‬‬

‫اﻟﺘﻄﺒﻴﻖ اﻟﻌﻤﲇ‪:‬‬

‫اﺧﺘﻴﺎر ﺧﻂ ﻣﻨﺎﺳﺐ ﻟﻔﻜﺮة ﺗﺼﻤﻴﻤﻚ‪.‬‬

‫‪52‬‬
(Wireframes)
‫)‪(Wireframes‬‬

‫ﻣﺼﺎدر اﻟﺘﻌﻠﻢ‪:‬‬

‫اﻟﻤﺼﺪر اﻷول‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻧﻲ‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻟﺚ‬

‫ﺗﺤﺪي‬

‫اﻟﺘﺤﻘﻖ ﻣﻦ اﻟﻔﻬﻢ‪:‬‬

‫ﻣﺎﻫﻮ ‪ Wireframe‬وﻣﺎ أﻫﻤﻴﺔ ﺗﻄﺒﻴﻘﻪ؟‬

‫ﻛﻴﻔﻴﺔ ﻋﻤﻞ ‪ Wireframe‬ﻟﻠﻤﻮﻗﻊ أو اﻟﺘﻄﺒﻴﻖ‪.‬‬

‫اﻟﺘﻄﺒﻴﻖ اﻟﻌﻤﲇ‪:‬‬

‫ﻋﻤﻞ ‪ Wireframe‬ﻟﻔﻜﺮة اﻟﻤﻮﻗﻊ أو اﻟﺘﻄﺒﻴﻖ اﻟﻤﺨﺘﺎرة‪.‬‬

‫‪54‬‬
(Prototype)
‫اﻟﻨﻤﻮذج اﻷوﱄ )‪(Prototype‬‬

‫ﻣﺼﺎدر اﻟﺘﻌﻠﻢ‪:‬‬

‫اﻟﻤﺼﺪر اﻷول‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻧﻲ‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻟﺚ‬

‫ﺗﺤﺪي‬

‫اﻟﺘﺤﻘﻖ ﻣﻦ اﻟﻔﻬﻢ‪:‬‬

‫ﻣﺎﻫﻮ ‪ Prototype‬وﻣﺎ أﻫﻤﻴﺔ ﺗﻄﺒﻴﻘﻪ؟‬

‫ﻛﻴﻔﻴﺔ ﻋﻤﻞ ‪ Prototype‬ﻟﻠﻤﻮﻗﻊ أو اﻟﺘﻄﺒﻴﻖ‪.‬‬

‫اﻟﺘﻄﺒﻴﻖ اﻟﻌﻤﲇ‪:‬‬

‫ﻋﻤﻞ ‪ Prototype‬ﻟﺘﺼﻤﻴﻤﻚ‪.‬‬

‫‪56‬‬
‫ﻣﺼﺎدر اﺧﺮى ﻟﺘﻌﻠﻢ ﺗﺼﻤﻴﻢ اﻟﻮاﺟﻬﺎت وﺗﺠﺮﺑﺔ اﻟﻤﺴﺘﺨﺪم‬

‫ﻣﻮاﻗﻊ‪:‬‬

‫ﻣﻮﻗﻊ ‪) Uxcel‬ﻣﺠﺎﻧﻲ وﻣﺪﻓﻮع(‬ ‫‪-‬‬

‫ﻣﻮﻗﻊ ‪) UX Tools‬ﻣﺠﺎﻧﻲ(‬ ‫‪-‬‬

‫ﻣﻮﻗﻊ ‪) Buninux‬ﻣﺠﺎﻧﻲ(‬ ‫‪-‬‬

‫ﻣﻮﻗﻊ ‪) GoodUX‬ﻣﺠﺎﻧﻲ(‬ ‫‪-‬‬

‫ﻣﻮﻗﻊ ‪) Uxmovement‬ﻣﺠﺎﻧﻲ(‬ ‫‪-‬‬

‫ﻣﻮﻗﻊ ‪) Uilearn‬ﻣﺠﺎﻧﻲ(‬ ‫‪-‬‬

‫ﻣﻮﻗﻊ ‪) dailyui‬ﻣﺠﺎﻧﻲ(‬ ‫‪-‬‬

‫ﻣﻮﻗﻊ ‪) hackdesign‬ﻣﺠﺎﻧﻲ(‬ ‫‪-‬‬

‫ﻣﻮﻗﻊ ‪) uidesigntips‬ﻣﺠﺎﻧﻲ(‬ ‫‪-‬‬

‫ﻛﺘﺐ‪:‬‬

‫ﻛﺘﺎب ‪Don't make me think‬‬ ‫‪-‬‬

‫ﻛﺘﺎب ‪Universal principles of design‬‬ ‫‪-‬‬

‫ﺧﲑ(‬ ‫ﻣﺠﻤﻮﻋﺔ ﻛﺘﺐ ‪ UI/UX‬ﻣﺠﻤﻌﺔ ﻣﻦ ﻗﺒﻞ ﺷﺨﺺ )ﺟﺰاه‬ ‫‪-‬‬

‫أﻧﻈﻤﺔ ﺗﺼﻤﻴﻢ )‪:(Design Systems‬‬

‫ﻧﻈﺎم ﺗﺼﻤﻴﻢ ‪Google - Material Design‬‬ ‫‪-‬‬

‫ﻧﻈﺎم ﺗﺼﻤﻴﻢ ‪Apple‬‬ ‫‪-‬‬

‫‪57‬‬
 ‫ﻣﺎذا ﺑﻌﺪ ذﻟﻚ؟‬

‫ﺑﻌﺪ اﻹﻧﺘﻬﺎء ﻣﻦ ﺗﻌﻠﻢ اﻟﻤﺼﺎدر اﻟﻤﺬﻛﻮرة واﻟﺘﻄﺒﻴﻖ اﻟﻌﻤﲇ‪ ,‬ﻳﻤﻜﻦ ﺗﺮﺗﻴﺐ ﻣﺎ ﺗﻢ اﻟﻌﻤﻞ ﻋﻠﻴﻪ ﻓﻴﻪ دراﺳﺔ او‬

‫ﻣﺎﻳﺴﻤﻰ ب "‪ "Case Study‬واﻟﱵ ﺗﻔﻴﺪ ﻓﻲ ﻣﺠﺎل اﻟﺘﻮﻇﻴﻒ واﻟﻌﻤﻞ اﻟﺤﺮ‪ .‬ﻫﻨﺎ ﺟﻤﻌﺖ ﺑﻌﺪ اﻟﻤﺼﺎدر اﻟﻤﻔﻴﺪة‪:‬‬

‫اﻟﻤﺼﺪر اﻷول‬

‫اﻟﻤﺼﺪر اﻟﺜﺎﻧﻲ‬

‫ﻫﻮ ﺗﻌﻠﻴﻢ ﻏﲑك وﻧﴩ‬ ‫ﻻﺗﻨﴗ اﻹﺳﺘﻤﺮار ﻓﻲ ﺗﻄﻮﻳﺮ ﻧﻔﺴﻚ واﻟﺴﻌﻲ اﻟﻤﺘﻮاﺻﻞ‪ .‬ﻣﻦ أﻓﻀﻞ اﻟﻄﺮق ﻟﺘﻌﻠﻢ‬

‫رﺣﻠﺘﻚ ﻋﲆ ﻣﻮاﻗﻊ اﻟﺘﻮاﺻﻞ اﻹﺟﺘﻤﺎﻋﻲ اﻟﱵ ﺗﻔﻴﺪك ﻣﻦ ﺧﻼل ﺟﺬب اﻧﺘﺒﺎه أﺻﺤﺎب اﻟﻤﺸﺎرﻳﻊ واﻟﺘﻮﻇﻴﻒ وﺗﻔﻴﺪ‬

‫ﻏﲑك‪.‬‬

‫‪58‬‬
 ‫اﻟﺨﺎﺗﻤﺔ‬

‫اﺗﻤﻨﻰ ﺗﻜﻮن اﻟﻤﺼﺎدر ﻣﺜﺮﻳﺔ وﻣﻔﻴﺪة وﺗﺴﻬﻞ ﺗﻌﻠﻴﻢ ﻫﺬا اﻟﻤﺠﺎل‪.‬‬

‫ﻛﻐﻴﺮه ﻣﻦ اﻟﻤﺠﺎﻻت‪ ,‬ﻻﻳﻤﻜﻦ ﺣﺼﺮ ﻛﻞ اﻟﻤﺼﺎدر ﻻن اﻟﻤﺠﺎل ﻳﺘﻄﻮر‬
‫ﻟﻜﻦ ﻫﺬه اﻷﺳﺎﺳﻴﺎت اﻟﻤﻬﻢ ﻓﻬﻤﻬﺎ واﻟﺘﻲ ﺳﺘﺒﻨﻲ أﺳﺎس ﻗﻮي‬
‫ﻳﻤﻜﻦ اﻟﺒﻨﺎء ﻋﻠﻴﻪ ﻓﻲ اﻟﻤﺴﺘﻘﺒﻞ‪.‬‬

‫إﻋﺪاد ‪ :‬ﻓﺎﻃﻤﺔ اﻟﻌﻤﻮدي‬

‫ﺗﻮﻳﺘﺮ‪@Alamoudiby :‬‬

‫ﺑﻴﻬﺎﻧﺲ‪@fatimahalamoudi :‬‬