Разработка веб-сайта
Введено| English | Значение |
|---|---|
| information architecture/ˌɪnfəˈmeɪʃn ˈɑːkɪtektʃə/ | информационная архитектура |
| wireframe/ˈwaɪəfreɪm/ | макет-сетка |
| visual hierarchy/ˈvɪʒuːəl ˈhaɪərɑːki/ | визуальная иерархия |
| whitespace/ˈwaɪtspeɪs/ | воздух (свободное пространство) |
A new member cannot find the meeting place
- A school club homepage shows a large photo, but the room and meeting time are hidden. The visitor leaves without knowing how to join.
- Start with the audience and a task you can observe: “Find this week's meeting time and room.” Ask a classmate to try it before deciding the design works.
Какая задача дает участнику наблюдаемую цель?
Difficulty 1/5 · 100 coins + a small bonus on first completion today
Поиск конкретной информации дает результат, который можно наблюдать и проверить.
Опишите наблюдаемую задачу для нового члена клуба, посещающего веб-сайт.
Difficulty 3/5 · 200 coins + a small bonus on first completion today
Пример: «Найдите, где проходит встреча робототехнического клуба в этот четверг».
Give information a useful home
- Information architecture 信息架构 groups content and connects pages. List the information a visitor needs, then choose clear page and link names.
- A short route helps, but there is no universal three-click rule. A clear longer path can be easier than a short path with confusing labels.
Sketch a structure you can test
- A wireframe 线框图 is a simple page sketch. Use boxes for layout, but include realistic labels and key content so a partner can understand the choices.
- A template can save time if it fits the tasks. Check its navigation, readability and content space rather than accepting every section it supplies.
For a new member, put “Thursday, 4 pm, room 12” near a clearly labelled “How to join” link. A returning member may need the current project instead. Test both tasks rather than assuming one homepage suits everyone.
Что должно быть легко обсуждать с помощью полезного раннего прототипа?
Difficulty 1/5 · 100 coins + a small bonus on first completion today
Прототип проверяет структуру; реалистичные подписи помогают участнику понять предполагаемый маршрут.
Show what matters first
- Visual hierarchy 视觉层次 uses headings, size, spacing and contrast to show relationships. Whitespace 留白 separates groups so they are easier to scan.
- Use a readable heading for each section and a clear label for each action. Colour should support the structure, not be the only sign that something is clickable.
Придание каждому элементу одинаково сильного акцента всегда создает четкую иерархию.
Difficulty 1/5 · 100 coins + a small bonus on first completion today
Иерархия передает приоритеты и связи. Равный акцент может затруднить поиск важного действия.
Соотнесите инструмент дизайна с его основной целью.
Difficulty 2/5 · 140 coins + a small bonus on first completion today
Эти инструменты работают на разных уровнях: маршрута, макета страницы и визуального группирования.
Test the task, not just the appearance
- Give a partner the task without explaining where to click. Record where they hesitate, which label they choose and whether they find the right answer.
- Change the confusing part and repeat the task. A task test can reveal a problem that a screenshot does not show.
A good-looking page is not proof of a usable route. Do not invent a user quote or call your own opinion user research. Keep actual observations separate from your interpretation.
Что следует включить в протокол тестирования задач? Выберите все подходящие варианты.
Difficulty 2/5 · 140 coins + a small bonus on first completion today
Зафиксируйте то, что произошло. Интерпретация может последовать, но вымышленные наблюдения не должны подаваться как результаты исследования.
Turn findings into a design decision
- Create a page list, one wireframe and a short record of two task tests. Explain one revision using what the participants actually did.
- Keep the first version and the revised version so your reasoning is visible. Check the task brief for any required design evidence.
Audience → observable task → content structure → wireframe → task test → revision. Templates and click counts are tools, not guarantees.
Расставьте этапы этого первого цикла проектирования и тестирования.
Difficulty 3/5 · 200 coins + a small bonus on first completion today
Задача определяет набросок, набросок поддерживает тестирование, а наблюдения влияют на правки. В последующих итерациях могут пересматриваться предыдущие решения.
Четырехкликный маршрут работает при тестировании, а запутанный двухкликный — нет. Что следует сделать?
Difficulty 1/5 · 100 coins + a small bonus on first completion today
Количество кликов — это одно наблюдение, а не универсальный вердикт о удобстве использования.