人机交互的软件工程方法实验报告（黑龙江大学）

实验名称： 生活分享网站/APP界面设计

一、实验目的

发掘用户需求，利用界面草图探索设计控件，并通过一系列网站或程序界面将得到的用户需求组织成一个完整的故事，满足用户分享自己的生活、了解他人的生活的目的。

二、实验内容

该实验为半开放性实验，主要内容为设计一个网站，使人们能够以高效、安全和愉快的方式分享他们的生活故事。在设计过程中寻找人们关注的核心问题，围绕此问题设计网站界面。同时，网站应降低用户学习成本，界面功能布局清晰。在设计用户分享生活的方式时，可以考虑使用文字、图片、视频等多种形式。

三、实验设计原型描述

在首页，用户可以看到一个精心设计的轮播图，展示了一些热门文章和活动。此外，还有一个文章列表，列出了最新发布的文章，方便用户快速浏览。同时，页面上还有“我的”、“投稿”、“搜索”和“关于”等按钮，方便用户进行相应的操作。

当用户点击“我的”按钮时，将进入个人中心页面。在这里，用户可以查看自己发布的生活动态，以及别人对自己的评论。这样，用户可以轻松地了解自己在社区中的互动情况。

如果用户点击“搜索”按钮，将进入搜索页面。用户可以在搜索栏中输入关键字，系统会检索相关的文章列表并展示给用户。这样，用户可以快速找到感兴趣的内容。

当用户点击“投稿”按钮时，将进入投稿页面。在这里，用户可以选择作品类型，输入文章内容，发布自己的生活动态。这是一个让用户分享自己故事的平台。

如果用户点击“关于”按钮，将进入关于页面。在这个页面上，用户可以了解到网站的简介、技术支持、联系方式以及赞助商等信息。这有助于用户更好地了解网站的背景和相关资源。

最后，当用户点击首页的文字链接时，将进入文章详情页面。在这里，用户可以查看文章的详细内容、评论，以及对文章进行评论或对评论进行回复。这为用户提供了一个交流思想、分享观点的平台。

四、实验现象及结果

首页页面如图1-1所示。

图1-1首页

在首页点击搜索进入搜索页，搜索页如图1-2所示。

图1-2搜索页

在首页点击投稿，进入投稿页，投稿页如图1-3所示。

图1-3投稿页

在首页点击我的，进入我的页，我的页如图1-4所示。

图1-4我的页

在首页点击关于，进入关于页，关于页如图1-5所示。

图1-5关于页

点击评论，进入评论页，评论页如图1-6所示。

图1-6评论页

五、实验心得与总结

本实验旨在通过界面草图和设计探索，发掘用户需求并组织成故事，以实现一个能让人们高效、安全且愉快地分享生活故事的网站。在设计过程中，我们重点关注了用户的核心需求，确保网站功能布局清晰，降低用户的学习成本。我们采用了文字、图片、视频等多种形式来丰富用户的生活分享体验。通过迭代设计和用户反馈，我们成功地构建了一个既满足用户需求又易于使用的平台。此实验不仅提升了我们的设计技能，也加深了我们对用户体验在界面设计中重要性的理解。

实验名称： 交互漫游程序

一、实验目的

实现利用多种媒体与用户进行互动交流的方式，理解多媒体交互下用户的需求。

二、实验内容

载入清明上河图图片，通过指点拖动浏览，并且针对不同的对象场景预设风声、流水声、鸟声、喧闹人群声、讨价还价声、弹唱戏曲声等。当用户漫游至相应场景时，加载声音并合成。例如，用户远观整个街市场景时，合成喧闹人群声和自然声；当用户放大到图片某细节处，可能听到对图中该区域内容对应的清晰的叫卖声、人流声等声音。

三、人机交互方案设计

基于清明上河图的交互漫游程序设计，旨在通过结合图像与声音的多媒体交互方式，提供用户一种全新的互动体验。该程序主要服务于对古代文化和历史感兴趣的人群，通过模拟古代街市的环境，使用户能够更加直观和生动地感受到古代社会的风貌。

程序功能包括：

1.图像浏览：用户可以载入清明上河图的图片，通过拖动和缩放操作来浏览图片的各个部分。此功能允许用户自主选择想要探索的画面区域，从而更好地控制浏览体验。

2.场景声音合成：程序预设了多种与古代市场相关的声音效果，如风声、流水声、鸟声、喧闹人群声、讨价还价声和弹唱戏曲声等。根据用户浏览的场景，自动加载并合成相应的声音。例如，当用户查看整个街景时，会听到合成的喧闹人群声和自然背景声；而当用户聚焦于某个具体细节，如一个市集摊位，则播放更具体的叫卖声或人流声。

3.互动式声音反馈：用户可以通过简单的交互动作，如点击图中特定的对象或场景，触发额外的声音反馈。这种设计增加了用户的参与感和探索趣味，使体验更加丰富和动态。

操作方式简介：

1.用户首先需要通过界面载入清明上河图图片。

2.使用鼠标或手指（取决于设备）进行拖动和缩放操作，以浏览图片。

3.程序会自动根据用户浏览的画面加载相应声音。

4.用户可以通过点击图片中的特定对象来触发额外的声音效果。

整体而言，该交互漫游程序通过结合视觉与听觉的交互方式，不仅增强了用户体验的丰富性和沉浸感，还有助于用户更深入地理解古代社会和文化。

四、实验现象及结果

人声设置处如图1-1所示。

图1-1人声处

水声设置处如图1-2所示。

图1-2水声处

鸟声设置处如图1-3所示。

图1-2鸟声处

五、实验心得与总结

通过本次实验，我们成功地实现了一个交互漫游程序，该程序允许用户通过拖动和指点来浏览清明上河图图片，并在不同场景下加载预设的声音效果。这种多媒体交互方式不仅增强了用户的沉浸感，还帮助他们更好地理解图片中的内容。

在实验过程中，我们发现用户对于声音的反馈非常积极，他们表示这种交互方式让他们更加身临其境地感受到了古代街市的氛围。同时，我们也注意到了一些需要改进的地方，比如在某些场景下声音的加载速度较慢，以及在某些细节处声音的清晰度不够高。

总的来说，本次实验达到了预期的目标，我们将继续优化程序的性能和用户体验，以实现更好的交互效果。

实验名称： 旅行规划器

一、实验目的

掌握人机交互设计的过程，思考用户的需求，并通过绘制草图、实现程序界面等方式完成软件的人机交互设计。

二、实验内容

设计一款旅行规划器程序、网站，用来规划用户的旅行路线、检查签证需求，订飞机或火车票，查询目的地的设施。

三、草图与交互方案设计

草图一：首页/登录页面

功能描述：用户首先进入登录页面，可以通过邮箱或手机号登录，新用户可以选择注册。登录后进入首页。

设计元素：清晰的登录框，醒目的登录和注册按钮，简洁的背景图案以提升视觉体验。

草图二：搜索与规划页面

功能描述：用户可以输入目的地，选择出行日期，系统提供签证需求信息，路线规划建议等。

设计元素：智能搜索框支持城市名、国家或地标建筑的输入；日期选择器直观易用；清晰的按钮引导至详细规划页面。

草图三：详细规划页面（包含地图、交通和住宿选项）

功能描述：展示详细的旅行路线地图，交通方式（飞机或火车）的选择和预订，酒店或民宿的推荐及预订功能。

设计元素：交互式地图显示旅行点，交通工具和住宿的选项旁边有详细的价格、时间和用户评分。

用户操作流程图：

登录/注册：用户开始于登录/注册页面。

输入旅行信息：登录后在首页输入目的地和日期。

查看规划建议：系统根据输入显示签证需求、推荐的路线和活动。

选择交通和住宿：用户选择交通方式和住宿，进行预订。

确认旅行计划：所有选择被汇总，用户确认信息无误后完成规划。

旅行准备清单：系统生成包括天气、打包列表、旅行日程的准备工作清单。

结束：用户完成旅行规划，可以打印或下载旅行详情。

解释和说明：

该设计考虑了从旅行的初衷到最终实施的全过程，注重用户体验，通过直观的界面和逻辑的操作流程减少用户的操作难度，增加旅行规划的便利性和乐趣。每个步骤的设计都旨在提供必要信息，同时避免信息过载，确保用户可以快速有效地做出决策。

四、实验现象及结果

登录页如图1-1所示。

图1-1登录页

首页如图1-2所示。

图1-2首页

定位页如图1-3所示。

图1-3定位页

搜索页如图1-4所示。

图1-4搜索页

地图页如图1-5所示。

图1-5地图页

导航页如图1-6所示。

图1-6导航页

周边页如图1-7所示。

图1-7周边页

酒店页如图1-8所示。

图1-8酒店页

酒店预订页如图1-9所示。

图1-9酒店预订页

酒店详情如图1-10所示。

图1-10酒店详情页

机票页如图1-11所示。

图1-11机票页

机票详情页如图1-12所示。

图1-12机票详情页

订票页如图1-13所示

图1-13订票页

五、实验心得与总结

本实验旨在通过设计一个旅行规划器，深入掌握人机交互设计的全过程。在实验中，我们首先分析了用户的基本需求，例如路线规划、签证查询、交通预订及目的地信息获取等。随后，我们绘制了草图并逐步实现了程序界面，确保了设计的直观性和易用性。通过不断的测试和修改，最终完成了一个功能齐全的旅行规划器。该程序不仅提供了用户友好的交互界面，还整合了必要的旅行工具和服务，极大地简化了用户的旅行准备过程。此次实验有效地锻炼了我们的设计思维和实现能力，让我们对人机交互设计有了更深刻的理解。

​​
若觉得有帮助，欢迎点赞关注，一起成长进步~
声明​​：本文仅供学习交流，禁作商用；禁篡改、歪曲及有偿传播，引用需标明来源。侵权必究。