COMP9511 Human Computer Interaction(HCI)–Week4

这周的内容不多，有很多是关于UI/UX里面的内容，但是Assessment2和Final会考这里面的知识点，重点在于functionality; non-functionnality

用户中心设计流程(User-Centred Design Process)(UCD)

Goal目标：

• 设计一个面向用户的原型，在正式做界面前，需经历多个阶段：

Step步骤流程包括：

1. 创意发散（Creative Thinking: Brainstorming, Mind Maps）
2. 产品描述（Product Description Statement）
3. 明确人群（People involved (stakeholders) Stakeholders）
4. 收集用户数据（Data Gathering: Interview, Observation, Questionnaire）
   • Questionnaires
   • Interviews
5. 分析（Analysis）
6. 构建用户模型（Personas）
7. 编写使用情景（Scenarios）
8. 明确需求（Functional / Non-functional Requirements）
9. 快速原型（Low / High Fidelity Prototyping）
10. 可用性测试（Usability Testing）

这一整套方法在 Assignment 2 中都会被用到。

从创意到结构化想法

Brainstorming

• 初期发散式思维，用于发现问题空间与潜在解决方向
• “想出好点子的最好方法就是——想出很多点子！”

Mind Maps

• 用图示方式整理信息，展示概念之间的关联
• 可以包含图像、颜色和非线性结构，激发创意

Affinity Diagram（亲和图）

• 将零散想法归类成“主题块”
• 适合从问卷或访谈数据中提取共同模式
• Card sorting 非常适合卡片搜集的类型brainstorm

Product Description Statement(PDS)

产品描述（PDS）语句模板（基本50词一段话讲清楚）：

讲清楚产品如何满足用户的目标

Our app will help users _ by _ so that they can ___.

问题陈述（Problem Statement）结构（适合写 Assignment 的项目目标！任何一个product 其实都适合）

PS is the base of PDS

1. Ideal – 理想状态（目标）describes the goals of the stakeholders.
2. Reality – 当前现实（问题）describes the current state of the process or product.
3. Consequences – 若不解决会怎样（后果） describes the impacts if the problem is not fixed or improved upon.
4. Proposal – 初步解决方案（提案） describe potential solutions.

产品描述（PDS）语句模板（约50词）：

Our app will help users _ by _ so that they can ___.

Stakeholders: 用户群体分类

Primary Users：直接使用系统的用户（例如输入数据、点击按钮）

• individuals who work with the product

Secondary Users：间接受益者，例如接收报告、旁观者

• Individuals who do not directly interact with the system/prpduct
• Still affected by its use and/or benefit form its outputs
• Those who receive report from the product

Data Gathering 数据收集方法

这里面最重要的是interview, lecture也重点去描述了interview

• Interviews
• Focus Group
• Questionnaires
  • Similar to a structured interview
  • Can have closed and open questions
  • Can be distributed easily to large numbe
• Direct Observation
  • Structuring frameworks: used to guide observation
  • Think-aloud technique
• Indirect Observation‘
  • Diaries
  • Logs and web-analytics
  • Watching’

方法	特点与优点
Interview	深入挖掘动机和期望，适合前期探索
Questionnaire	广泛覆盖，便于量化分析，可用于后期反馈
Observation	真实环境中观察用户行为，识别问题

Interview techniques 在Assessment2 中有checkpoints

• Ask relevant questions to your product
• Consistency is important 问题保持连续和一致
• Avoid leading questions 避免诱导性提问
• Avoid jargon 避免使用太专业的名词
• Avoid long questions 使用简短的问题
• Need accurate records 问题需要被记录
• Need to make participants feel comfortable 注意受访者舒适度
• Written consent needed and sometimes ethics approval 参与者要有知情并且同意

数据分析方法

定量分析（Quantitative）：均值、标准差、ANOVA，使用 Excel、SPSS

定性分析（Qualitative）：关键词归类（NVIVO），可用亲和图

Persona 任务画像

虚构但基于真实调研的代表性用户模型，帮助团队“站在用户角度设计”。

包含信息：

• Persona Information

• 年龄、职业、目标、痛点、在线行为、设备使用偏好
• 通常用一张 stock photo 配图以增强真实感

Persona 帮助：

• 激发同理心（Empathy）
• 聚焦不同用户的差异需求
• 是编写 context scenarios 的基础

The number of personas you need to define depends on the different types of stakeholders who will use your application.

Scenarios（情景）

这个在HCI中非常常见，具体一个场景中来描述如何你的app如何被使用

Context Scenario（情境故事）

• 聚焦用户的背景、需求和使用环境，而不是系统行为 Define the core problem and userneed
• 写故事而不是流程图！避免提具体技术 Stories which designers create to show how users might act to achieve a goal in a system or an environment
• 应回答：谁（who）？在哪（where）？为什么（why）？什么时候（when）?背景（Context）？

类型	关注点
Context Scenario	用户需求、目标、环境、故事化
Use Case	系统与用户交互（输入/输出逻辑）
Task Scenario	可用性测试中给用户的具体任务说明

User-Centred Design UCD is an iterative, repeatable, and testable process:

关键词	含义
用户参与	用户在设计的早期、中期、后期都要被考虑或实际参与
反复迭代	不是一次设计就完事，要不断地测试 → 改进 → 测试
基于证据	使用访谈、问卷、观察等方法收集数据作为设计依据
关注情境	不仅考虑用户怎么点按钮，更关注他们在什么场景下使用

Prototype

需求（Requirements）基础

• Functional Requirements（功能性需求）：
  • Specific behaviours or functions What a system is meant to do 系统应该做什么（what it does）
  • 示例：添加朋友、定义锻炼计划、发出挑战、排行榜系统 Motivational elements such as giving point, badge; Share achievements
• Non-functional Requirements（非功能性需求）：
  • Qualities of a system – usability, accessibility 系统应具有什么样的特性（how it is）
  • 示例：界面简洁、美观、支持移动/桌面适配、数据隐私保护 Appropriate color theme

重点：功能需求解决“用什么做事”，非功能需求强调“怎么做得更好”。

Examples of non-functional requirements

Focus on user and team which are more about the Assessment and final exam

Important to User	Important to Team	Important to Business
Performance	Maintainability	Time to market
Security	Portability	Cost
Usability	Reusability	Flexibility
Compatibility	Testability	Speed
Accessibility	Naming Convention
Flexibility	Tech Stack
Disaster Recovery	Monitoring

Flexibility: This function is allow user freedom to explor and prevent error

Accessibility: both of functional and non-functional – if u can see or can click that is function, if that is backend that is non-function,

non-Functional sometime is more visual features and have important effort on usability goals.

如果用户能自定义的features那他就是Functionnal

如何得出需求？

• 来源：Context Scenarios 和 Personas
• 工具： Interviews、Direct Observation、Questionnaires、Focus Groups、Studying Documentation
• 可使用 Volere 模板 或 Jira/MS Project 进行需求管理

信息架构 + 三大设计维度

当需求明确后，设计会围绕这三个核心维度展开：

Design	Content Description
Visual Design	配色、布局、UI 组件样式
Interaction Design	用户行为流程、按钮点击、反馈机制
Information Architecting	如何呈现信息：结构、层级、组合方式等

Prototyping 原型设计

原型是将想法可视化、验证可用性、迭代改进的核心工具。 下面的基本都是prototyping 必不可少的activies

– Product objectives

– User research

– Personas

– Scenarios

– Requirements

Fidelity 保真度

Type	Description
Low-Fidelity	快速、粗略草图，如纸面原型（纸、便利贴）
High-Fidelity	高度真实感，可交互，如 Figma、Adobe XD、Axure

Low-fidelity: 基本都是wireframe 线稿图

Choosing a fidelity:

💡 选择保真度要看阶段：前期快速验证选纸质原型，后期需要真实交互选电子原型。

Paper Prototypes纸质原型

现在基本没人会再用了，20年前应该这种方式还是流行的

pros：

• 快速
• 成本低
• 激发创意
• 易于与用户/团队协作

cons：

• 无法展示动画或复杂交互
• 测试时需要主持人手动“模拟”系统反应
• 外观粗糙，不适合后期展

Electronic Prototypes电子原型

Pros：

• 更接近真实系统，用户体验更准确
• 支持动画、交互、响应式等
• 可测试实际界面行为

Cons：

• 学习成本高（尤其是设计工具）
• 可能让用户过早关注“视觉细节”而非核心流程
• 太精致的界面让用户不好意思提出负面反馈

常用工具（推荐用于 Assignment 2）：

工具	特点
Figma	免费、协作强、Web + App 都支持
Adobe XD	专业、支持动画过渡
PowerPoint	上手快，适合交互流程演示
Axure RP	功能强大，适合正式交互原型
Balsamiq	更适合做粗线框草图