Designing the user interface | 设计用户界面

📚 Designing the user interface | 设计用户界面

This revision guide explains the key principles of user interface design, using practical examples from sport technology such as fitness trackers, performance analysis apps and wearable coaching tools. It is written for Cambridge learners who need to understand how effective interfaces are planned, tested and improved.

本复习指南讲解用户界面设计的关键原则，并结合体育科技中的实际例子，如健身追踪器、运动表现分析应用和可穿戴教练工具。本文面向剑桥学习者，帮助他们理解如何规划、测试和改进有效的用户界面。

1. Understanding User Interface Design | 理解用户界面设计

A user interface (UI) is the point of interaction between a human and a digital device. In sport technology, a well-designed UI might be found on a running watch, a team video analysis tablet or a referee decision-review screen. Good UI design makes tasks faster, clearer and less error-prone for athletes, coaches and officials.

用户界面（UI）是人与数字设备之间的交互点。在体育科技中，设计良好的用户界面可能出现在跑步手表、团队视频分析平板或裁判判罚回看屏幕上。良好的界面设计能让运动员、教练和裁判的操作更快、更清晰、更少出错。

Designing a user interface is not only about making screens look attractive. It includes understanding the user’s goals, selecting the correct input and output methods, applying layout conventions and testing the product with real users. For example, a coach using a performance app during a busy match needs large touch targets and minimal steps, not decorative graphics.

设计用户界面并不仅仅是让屏幕看起来美观。它还包括理解用户的目标、选择正确的输入和输出方式、应用布局规范以及与真实用户一起测试产品。例如，教练在紧张的比赛中使用表现分析应用，需要大面积的触摸目标和最少的操作步骤，而不是装饰性图形。

2. Types of User Interface in Sport Technology | 体育科技中的用户界面类型

Several types of user interface are used in sport and physical education technology. The most common are graphical user interfaces, menu-driven interfaces, command-line interfaces and natural or gesture-based interfaces. Each type has strengths and weaknesses depending on the context and the user’s expertise.

体育和体育教育科技中使用多种用户界面类型。最常见的包括图形用户界面、菜单驱动界面、命令行界面以及自然或手势界面。每种类型根据使用场景和用户的专业程度具有不同的优点和缺点。

A graphical user interface (GUI) uses windows, icons, menus and pointers, and is ideal for most coaches and athletes because it is intuitive.

图形用户界面（GUI）使用窗口、图标、菜单和指针，对大多数教练和运动员来说非常直观，因此最为理想。
A menu-driven interface guides the user through a fixed set of options, which suits beginner-friendly fitness machines or stadium kiosks.

菜单驱动界面引导用户在一组固定选项中进行选择，适用于初学者友好的健身器械或体育场馆自助服务终端。
A command-line interface requires typed instructions and is rarely used by athletes, but may appear in advanced sports data analysis tools.

命令行界面需要输入文字指令，运动员很少使用，但可能出现在高级体育数据分析工具中。
Gesture and voice interfaces allow hands-free control, which is valuable during training when a runner wants to start a lap timer without stopping.

手势和语音界面允许免提控制，这在训练中非常有价值，例如跑步者无需停下即可启动单圈计时。

3. Graphical User Interfaces for Coaches and Athletes | 教练与运动员的图形用户界面

Most sport applications use a graphical user interface because it reduces cognitive load. A coach preparing a training session can drag and drop drill icons onto a calendar, while an athlete can view heart-rate zones using colour-coded charts. The GUI relies on visual metaphors such as buttons, sliders and checkboxes that users already recognise.

大多数体育应用使用图形用户界面，因为它能减轻认知负担。教练备课时可以将训练项目图标拖放到日历上，运动员可以通过颜色编码的图表查看心率区间。图形用户界面依赖于用户已经熟悉的视觉隐喻，如按钮、滑块和复选框。

In a sport performance dashboard, GUI design must prioritise glanceability. A sprinter checking split times between repetitions should not have to search through multiple menus. Effective dashboards show the most important metric in a large font at the top, with secondary data arranged below in a logical hierarchy.

在运动表现仪表板中，图形用户界面设计必须优先考虑可扫读性。短跑运动员在组间查看分段成绩时，不应在多个菜单中寻找。有效的仪表板在顶部用大号字体显示最重要的指标，次要数据则按合理层级排列在下方。

4. Menu-Driven and Voice Interfaces in Fitness Equipment | 健身设备中的菜单驱动与语音界面

Menu-driven interfaces are common on treadmills, stationary bikes and public gym machines. Users progress through clearly labelled screens such as ‘Select program’, ‘Set duration’ and ‘Start workout’. This design reduces the chance of accidental input, which is important when users are moving or sweating.

菜单驱动界面常见于跑步机、动感单车和公共健身房器械。用户通过清晰标注的屏幕依次操作，如“选择程序”“设置时长”和“开始训练”。这种设计减少了误输入的可能性，这在用户正在运动或出汗时尤为重要。

Voice interfaces are growing in wearable sport devices. A cyclist can say ‘Start interval session’ while keeping both hands on the handlebars. However, voice recognition must cope with background noise, heavy breathing and different accents, so designers include visual confirmation prompts as a backup.

语音界面在可穿戴运动设备中日益普及。骑行者可以双手不离车把地说“开始间歇训练”。然而，语音识别必须应对背景噪音、沉重呼吸和不同口音，因此设计师会加入视觉确认提示作为备用方案。

5. Gesture-Based and Natural Interfaces in Training | 训练中的手势与自然界面

Gesture-based interfaces use body movement as input. In sport, they appear in interactive physiotherapy screens, virtual reality reaction trainers and motion-capture coaching systems. A tennis player may swing a controller or use a camera-tracked racket, and the interface responds to the movement without requiring a keyboard or mouse.

手势界面以身体动作作为输入方式。在体育中，它们出现在交互式物理治疗屏幕、虚拟现实反应训练器和动作捕捉教练系统中。网球运动员可以挥动控制器或使用摄像头跟踪的球拍，界面根据动作做出反应，无需键盘或鼠标。

Designing natural interfaces for sport requires careful mapping. If a user steps to the right, the on-screen avatar should move right immediately. Any delay or reversed mapping breaks the feeling of immersion. Usability tests often measure reaction latency and user comfort during repeated body movements.

为体育设计自然界面需要仔细的动作映射。如果用户向右移动，屏幕上的虚拟形象应立即向右移动。任何延迟或反向映射都会破坏沉浸感。可用性测试通常测量重复身体动作时的反应延迟和用户舒适度。

6. Core Principles of Effective UI Design | 有效用户界面设计的核心原则

Effective user interface design follows a set of core principles: clarity, consistency, feedback, accessibility and error prevention. In a sports context, these principles are tested under pressure. A coach making a quick substitution needs clear confirmation that the change has been recorded, not a subtle colour change.

有效的用户界面设计遵循一套核心原则：清晰性、一致性、反馈、可达性和错误预防。在体育场景中，这些原则在压力下受到考验。教练快速换人时需要清晰的确认信息，表明更改已被记录，而不是细微的颜色变化。

Clarity means the purpose of every screen is obvious at a glance. Consistency means similar actions produce similar results across the whole application. Feedback tells the user what has happened after an action. Accessibility ensures people with different abilities can use the interface. Error prevention reduces the chance of mistakes before they occur.

清晰性意味着每个屏幕的目的能让人一目了然。一致性意味着相似的操作在整个应用中产生相似的结果。反馈告诉用户操作之后发生了什么。可达性确保不同能力的人都能使用界面。错误预防在错误发生之前就降低了出错的可能性。

7. Consistency and Feedback in Performance Apps | 表现应用中的一致性与反馈

Consistency is vital when athletes switch between screens under fatigue. If a red button means ‘stop’ on one screen but ‘delete’ on another, the user may make a serious error. Designers create style guides that define colours, button shapes, icon styles and navigation patterns for the whole product.

当运动员在疲劳状态下切换屏幕时，一致性至关重要。如果红色按钮在一个屏幕上表示“停止”，在另一个屏幕上表示“删除”，用户可能会犯严重错误。设计师会创建样式指南，为整个产品定义颜色、按钮形状、图标样式和导航模式。

Feedback can be visual, auditory or haptic. A fitness tracker vibrates when a target heart-rate zone is reached, while a training app plays a sound when a rest interval ends. Immediate feedback reassures users that the system has recognised their input, and it reduces uncertainty during high-intensity exercise.

反馈可以是视觉、听觉或触觉的。健身追踪器在达到目标心率区间时振动，训练应用在休息间隔结束时播放声音。即时反馈让用户确信系统已经识别了他们的输入，并减少高强度运动中的不确定性。

8. Accessibility and Inclusivity in Sport Interfaces | 体育界面中的可达性与包容性

Accessibility in UI design means ensuring that users with visual, hearing, motor or cognitive impairments can still operate the interface. In sport, this might include high-contrast colour schemes for outdoor sunlight, large fonts for older adults in rehabilitation classes, or voice descriptions of on-screen data for visually impaired athletes.

用户界面设计中的可达性意味着确保有视觉、听觉、运动或认知障碍的用户仍然可以操作界面。在体育中，这可能包括针对户外阳光的高对比度配色方案、为康复课程中的年长者设计的大字体，或为视障运动员提供的屏幕数据语音描述。

Designers follow accessibility guidelines such as providing text alternatives for images, ensuring keyboard or switch access, and avoiding reliance on colour alone to convey meaning. For example, a heart-rate graph should use both colour and line patterns so colour-blind users can distinguish training zones.

设计师遵循可达性指南，例如为图像提供文本替代、确保键盘或开关访问，以及避免仅依赖颜色来传达信息。例如，心率图应同时使用颜色和线条样式，以便色盲用户区分训练区间。

9. Usability Testing in Sports Applications | 体育应用中的可用性测试

Usability testing is the process of observing real users as they complete tasks with the interface. In sport technology, test participants might include athletes, coaches, physiotherapists and match officials. Their feedback helps identify confusing navigation, unclear labels or buttons that are too small for gloved fingers.

可用性测试是观察真实用户在使用界面完成任务的过程。在体育科技中，测试参与者可能包括运动员、教练、物理治疗师和比赛裁判。他们的反馈有助于发现令人困惑的导航、不清晰的标签或对手套手指来说过小的按钮。

A typical usability test in a sports setting measures task success rate, time on task and error count. For example, a tester may ask a coach to create a substitution using a tablet app while a simulated crowd noise plays in the background. If the coach fails, the design team knows which steps need simplifying.

体育场景中典型的可用性测试会测量任务成功率、任务耗时和错误数量。例如，测试人员可能要求教练在模拟人群噪音的背景下使用平板应用完成一次换人操作。如果教练失败，设计团队就能知道哪些步骤需要简化。

10. Designing for Wearable Device Screens | 可穿戴设备屏幕的设计

Wearable devices such as smartwatches and chest straps have very small screens and limited input methods. UI designers must reduce the interface to a few critical actions and data fields. A runner’s watch face may show only current pace, distance and heart rate, with one physical button to start and stop.

智能手表和胸带等可穿戴设备屏幕非常小，输入方式也有限。界面设计师必须将界面精简为少数关键操作和数据字段。跑步者的表盘可能只显示当前配速、距离和心率，并通过一个实体按钮开始和停止。

Because users often interact with wearables while moving, touch targets must be large enough and spaced apart. Designers also consider outdoor readability by using high brightness and strong contrast. Data can be grouped into scrollable cards so users do not need to read several small numbers at once.

由于用户经常在移动中与可穿戴设备交互，触摸目标必须足够大且间距合理。设计师还通过高亮度和强对比度来考虑户外可读性。数据可以分组到可滚动的卡片中，这样用户无需一次读取多个小数字。

11. Colour, Layout and Readability in Sport Dashboards | 运动仪表板中的色彩、布局与可读性

Colour is not just decoration in sport interfaces; it carries meaning. Green often indicates a safe training zone, amber indicates caution and red indicates overexertion or danger. However, designers must never rely on colour alone, because some users cannot distinguish certain colours. Text, icons or patterns should reinforce the same message.

色彩在体育界面中不仅仅是装饰，它承载着含义。绿色通常表示安全的训练区间，琥珀色表示需要注意，红色表示过度用力或危险。然而，设计师绝不能仅依赖色彩，因为有些用户无法区分某些颜色。文字、图标或图案应强化同样的信息。

Layout should follow the natural reading direction and place primary actions where the thumb or eye lands first. For a smartphone fitness app, the main start button is usually at the bottom centre, within easy reach of the thumb. Critical data appears at the top of the screen, where the eye naturally looks first.

布局应遵循自然的阅读方向，并将主要操作放在拇指或视线首先落到的位置。对于智能手机健身应用，主启动按钮通常位于底部中央，方便拇指触及。关键数据则显示在屏幕顶部，即眼睛自然首看的位置。

12. Evaluation and Iterative Improvement of the Interface | 界面的评估与迭代改进

Designing a user interface is an iterative process. After the first prototype is built, it is tested, evaluated and refined. In sport technology, a prototype may be used in a short training session, after which users report issues such as delayed split times, confusing icons or exhausting navigation steps.

设计用户界面是一个迭代过程。第一个原型建成后，要经过测试、评估和完善。在体育科技中，原型可能用于一次短期训练课，课后用户会报告诸如分段成绩延迟、图标令人困惑或导航步骤繁琐等问题。

Evaluation methods include questionnaires, think-aloud protocols and automatic logging of user interactions. The design team then decides which problems are most serious and applies changes in the next version. This cycle continues until the interface meets usability targets, such as a task success rate above 90%.

评估方法包括问卷调查、出声思维法和自动记录用户交互日志。设计团队随后判断哪些问题最严重，并在下一个版本中修改。这个循环持续进行，直到界面达到可用性目标，例如任务成功率超过90%。

Ultimately, a good user interface in sport technology disappears into the background. The athlete focuses on the training stimulus, the coach focuses on tactics, and the referee focuses on the game. The UI simply makes their decisions faster, safer and more accurate without demanding attention itself.

最终，体育科技中优秀的用户界面会隐入背景。运动员专注于训练刺激，教练专注于战术，裁判专注于比赛。用户界面只是让他们的决策更快、更安全、更准确，而自身并不喧宾夺主。

Published by TutorHao | Physical Education Revision Series | aleveler.com

更多咨询请联系16621398022（同微信）

Designing the user interface | 设计用户界面