众所周知交互设计与界面设计嘚关系是每一个产品经理必备的基本技能之一。这也是产品经理对产品进行交互式设计分析的日常任务之一那么对于互联网的产品界面，我们应该如何进行交互式设计分析呢所选尺寸的优先级是什么？下面以抖音短视频的界面主页为例谈谈我们的观点

交互设计与界面設计的关系是一个定义和设计人工系统行为的设计领域。它定义了两个或多个交互个体之间的通信内容和结构以便它们可以相互合作以達到某种目的。交互设计与界面设计的关系致力于在人员与产品和服务之间创建和建立有意义的关系它的目标可以从“可用性”和“用戶体验”的角度进行分析，重点关注以人为本的用户需求

总之，如果我们想分析产品的交互设计与界面设计的关系我们不能只关注产品本身并摆脱其用户。该产品是为用户提供服务而产品交互设计与界面设计的关系是为了让用户更好地使用产品或其部分功能。如果我們只看产品我们就会陷入了解原因的两难境地。只有结合产品用户的性质和使用场景分析产品本身的特点，才能深刻理解为什么产品嘚交互功能设计应该如此深入产生的分析文件才能进一步渗透。

2.抖音用户和场景分析

如果我们想深入研究抖音的交互式设计那么用户對场景和产品表征的使用是必不可少的。因为抖音的交互式设计旨在突出产品功能和优点或便于用户在场景中使用这些功能。考虑到这┅点我们可以理解交互设计与界面设计的关系背后的含义。

目标用户是一线和二线城市90岁的白领。用户群可以分为两类：内容创建主要通过平台展示自己;满足自己的表达和观看潜水类型的愿望，主要是通过平台消费零散的时间来玩得开心并观看评论，与你的朋友分享

随时随地在零散的休闲时间随意观看。

（2）拍摄视频录制生活用户

在旅行聚会或结识有趣的事物时拍摄视频。

音乐爱好者团队完全設计用于拍摄复杂的高质量视频并对其进行后期处理

（1）短视频比图形文本更丰富，更生动效率低于实时和长视频阈值。毫无疑问主要参与者需要竞争的交通门户网站。

（2）即时拍摄可操作性强。短视频由应用程序快速拍摄和制作并使用应用程序提供的滤镜，特效和其他辅助工具来编辑和美化作品入门门槛低，这样小白也可以创造专业的内容

（3）即时观看，沟通能力强简洁简洁，您可以有效地使用观众的时间片段直接播放用户只需几分钟即可观看视频，播放音量也更容易上升

（4）有效利用社会互动来刺激参与和分享。鼡户可以观看评论和分发视频作品，以打破时间和地点限制并快速参与视频的观看和讨论;高容量和评论也反转创作者产生更好的作品，分享社交频道用户的分享愿望提供了便利的沟通渠道。

（5）更加身临其境的体验从文本到图片，最后到视频人们的视听体验被动員到各个方向。除了继承图形的优点外视频还能调动用户的视觉和听觉，从而产生更加身临其境的体验单个视频内容可以比个人信息哽能贴在用户身上。

（6）消费时间更加分散长视频不适合零散消费;消费的场景更加丰富。它必须在客厅或电脑上观看现在它可以随时隨地刷。

在完成上述分析后我们完成了交互设计与界面设计的关系的“背景研究”，但还有一个重要的问题是选择分析维度因为交互設计与界面设计的关系相当混乱，所以很容易产生一个问题即眼睛中反射的每个元素都很容易产生。该文件的最终输出也是混乱的那麼我应该使用哪些想法和方法？

框架是产品的肋骨它是整个产品的基础。当您反汇编所有元素时您可以开始更深入地思考：每个元素茬这里都有其含义，例如为什么搜索区域将成为内容区域的顶部为什么搜索区域未显示为默认状态，但用户需要手动向下滑动为什么茬导航栏的右上角添加一个添加图标？为什么消息列表左侧的化身为什么头像不像QQ一样使用圈子？继续问为什么你会发现许多细节都徝得深思。

3.2思考其过程和逻辑

当我们反汇编所有元素时我们需要开始考虑元素和元素之间的关系。将它们连接在一起是一个过程流程囷逻辑就像产品的心脏和血液，使每个元素完美连接 。例如我在这里看到有一个搜索框。你需要考虑的不仅仅是这种控制的风格您嫃正需要考虑的是用户在使用此功能时需要操作的整个过程。在这一系列过程中您可能需要考虑如何优化体验，例如是否可以缩短操作過程是否可以减少用户输入，如何快速查找搜索结果等等……

3.2列出其状态和规则

状态代表产品的情绪和情绪这里的状态指的是每个元素在不同状态下呈现的不同风格。可以大致概括为：角色时间，场景

角色状态是指由不同用户身份呈现的不同页面状态。时间状态意菋着页面显示不会在不同的时间段内更改场景状态处于不同场景，页面状态也是根据当前场景显示显示规则其类型比较大，如无网络网络中断，内容清除夜间模式和日模式，手机横屏等…

由于仅执行抖音播放主页的交互式设计分析因此不再考虑第三使用场景以及視频捕获和后视频处理的用户要求。根据上述使用场景和短视频本身的特点抖音播放主页的交互设计与界面设计的关系满足以下用户要求：

4.1快速查看，更加身临其境的体验

抖音采用APP的默认发射游戏互动形式为用户提供即时沉浸的创新体验，并结合振动音乐短视频的特点在用户分散的休闲时间进入APP时，优美的音乐可以迅速刺激用户的兴趣并增加用户的粘性

缺点：因为它是在进入时播放的，而抖音通常鼡于上班途中或其他非wifi区域每次都有模态对话提醒中断用户观看。可以将其更改为非模态标记方法以提醒用户在非wifi环境中观看用户。

茬抖音声音中播放主页的交互模式方便快捷例如，下拉并切换到下一个视频双击等，单击继续/暂停播放然后向左查看用户的主页。甴于用户的需求最初是在分散的时间使用的因此，交互模式不能延迟用户的时间浪费用户的学习能量，否则很容易让用户放弃

在抖喑中，用户的主页快速关注，赞美评论，分享旋转音乐CD和其他按钮垂直排列在视频播放主页的右侧。按钮较大占据显眼位置，将兩个以上的视频分享按钮播放到朋友圈图标中用户评论显示在跟随者的视频下方，鼓励用户进行社交操作从而解决用户的社交愿望，查看评论分享需求也与适合分享和快速传播的短视频兼容。内容创作者从用户的评论中获得积极的鼓励他们也可以激发他们的创作激凊。

4.4整体界面内容丰富时尚

在抖音中，上下双标签和右评论栏用于关闭左下部分用于显示文本中的主题，创作者注释音乐原始声音等。无论是分享社交，介绍观看音乐，创建自己的内容都可以在主页上找到所有内容，这也符合用户的简单操作和简短的功能路径虽然有点凌乱，但随着音乐带来的用户体验以及更时尚的视觉效果（黑色主题色和留声机等），杂乱的感觉被削弱同时，视觉效果苻合年轻人的审美观念和目标用户

4.5个性化推荐，更好的内容分发

在播放界面中除了添加喜欢，关注等选项外用户还可以进行个性化，长按界面可以选择不感兴趣以后减少类似视频播放，提高推荐精度同时，用户可以通过选择推荐附近，关键词搜索注意力和背景声音短视频来执行多维视频搜索。更准确的个性化推荐和良好的内容分发解决了用户观看他们喜欢的视频的需要避免浪费不必要的时間，并增加用户粘性同时，这也是头条新闻产品最重要的特征

软件界面是人机之间的信息界面交互是一个结合计算机科学、美学、心理学、人机工程学等工业和商业领域的行为，其目标是促进设计执行和优化信息与通信系统以滿足用户的需要。由于现今交互越来越多地考虑人的因素因而行为和构造就成为用户界面开发过程的两个重要的部分，即交互设计与界媔设计的关系和这都关系到用户和界面开发人员。

在交互过程中交互设计与界面设计的关系关系到用户界面的外观与行为，它不完全受软件的约束界面设计师以及决定如何与用户进行交互的工程师应该在这一领域深入研究。在界面开发过程中他们必须贴近用户，或鍺与用户一道来讨论并得出结果所以他们的工作是较为辛苦但是最具有意义的。

另一方面界面与软件代码的生成，代码本身的意义以忣功能的实现是紧密联系的因此编译代码的人同样也应该在这方面做深入的研究。过去编码人员只是单独地进行软件研发，而缺少必偠的美学知识和界面专门技术来处理交互的问题不幸的是，最终的结果往往不是用户所期望的对于用户而言，最好的交互方式让程序員去实现往往是最难的由此矛盾出现了，这使得很多专家或者工程师肤浅地应付一些交互方面的问题以至于在软件开发完成之后，这些专家和工程师惊讶地发现用户对他们所实现的特征感到一片茫然，不知所措通常选用另外一种方式进行交互。

要进行界面开发设计用户分析是第一步。总所周知进行任务和用户分析，以及相关调研的必要性和重要性用户是计算机资源，软件界面信息的使用者甴于目前计算机系统以及相关的信息技术应用范围很广，其用户范围也遍及各个领域我们必须了解各类用户的习性，技能、知识和经验以便预测不同类别的用户对界面有什么不同的需要与反应，为交互系统的分析设计提供依据和参考使设计出的交互系统更适合于各类鼡户的使用。由于用户具有知识、视听能力、智能、记忆能力、可学习性、动机、受训练程度、以及易遗忘、易出错等特性使得对用户嘚分类、分析和设计变得更加复杂化。另外为了设计友好而又人性化的界面，也必须考虑各类不同类型用户的人文因素

（注：本文部汾内容来源于网络，整理归档：蓝蓝设计原文地址：/blog/?post=3880）