☰ خطة العام · تكنولوجيا المعلومات والاتصالات (بالإنجليزية)

User experience (UX)

الأسبوع 7 · الدرس ١ «مبادئ تصميم واجهات احترافية شيقة للمواقع الإلكترونية» (١): تجربة المستخدم UX ومبادئها · 3 دروس
2

Easy to find: navigation

ICT Prep 2 Term 1, Unit 2, Lesson 1: pp. 42–46
GoalDesign a simple main menu with four or five clear items.
New words
navigation · moving around a website or an app to find what you needmain menu · the list of main places in a site or appbutton · a part of the screen you press to do somethingmenu item · one choice in a menu
Explanation

Navigation is how you move around an app to find what you need. The main menu is the map of an app. A good main menu has only a few clear buttons, four or five, with names that say what they do, such as Home, Lessons, Homework and Help. A poor menu is long, hides choices inside other choices and uses names nobody understands. When a menu is too long, people give up. A good rule is that a user should reach any page in only a few steps. On paper you can plan a menu like a wireframe: a simple drawing in boxes that shows where the menu items go before any real work starts. The names must be short and in the same order on every page.

A
1School app: main menu
2Home
3Lessons
4Homework
5Quiz
6Help
Worked examples
BeforeAfter
buttons145
steps to the timetablemanyone
A student app has a menu with fourteen buttons, some inside others. A new student looks for the timetable for two minutes and gives up. The team cuts the menu to five clear buttons. Now the timetable is one tap away.
Hana draws her own menu on paper for an invented school club app: Home, Events, Photos, Contact. She says each name aloud to a friend, who guesses what is behind each button. The friend guesses all four, so the names are clear.
Class activity

Plan a main menu for an invented school club app with four or five items. Draw it as a list of boxes. Test it on a family member: say each name and ask what they think is behind it. Change any name they do not understand.

Practice
1
What is a main menu?
2
How many items should a good main menu have, roughly?
3
Why is a menu with many hidden choices a problem?
4
Write good names for four buttons of a school app.