我经常遇到一些以前负责PC端产品的设计师，但是他们突然变成了移动终端。他们会在不知不觉中将PC端的某些设计概念“移植”到移动终端，并且他们将变得习以为常。当一位经验丰富的设计师查看您设计的移动页面时，他会知道您之前所做的一切都在PC端。这是一件非常令人尴尬的事情。就像您说“很高兴见到您”一样，其他人也会知道您的家乡在哪里。那么，移动终端和PC终端有什么区别？
大屏幕到小屏幕
直截了当，移动终端和PC终端之间最根本的区别在于屏幕的尺寸。屏幕的大小直接决定了界面上的信息量。 PC端的一页可以显示完整的信息，而移动端可能需要几页才能携带该信息。
一些设计师可能会认为屏幕大小不一样，无法自适应，但是移动页面应该更长一些，并让用户滑动。这是一个非常简单的解决方案，但它忽略了一个重要前提：用户愿意刷卡吗？根据嵌入的数据，大多数超过一个屏幕的移动页面的曝光率和点击量将急剧下降，这表明用户很少滑动即可查看一个屏幕以外的内容。对于移动产品，必须确保一些重要的内容，以使用户可以在一个屏幕上看到它。
1）信息架构重建
因此，如果要为PC站点制作移动应用程序，那么要做的第一件事就是重建信息体系结构。 PC终端上有足够的空间来直接向用户显示所有功能，而移动终端只能显示一些主要功能，而一些次要功能则需要放在下一级。
例如，应用商店中的用户可以评估此评论是否对他们有帮助。 PC端的处理方法非常简单，可以直接显示给用户。移动终端要求用户长按此注释以弹出评估列表。也许许多用户今天阅读了这篇文章，发现此功能仍然存在。没关系，尽管我以前不知道，但它不会影响您的正常使用。适当降低辅助功能的信息级别是移动设计人员必须考虑的事情。
2）一页，一项任务
某些人可能不同意以上的信息架构重建观点。对于某些表单页面，例如想要借钱或转账的用户，该用户必须填写一些信息。在这些情况下，我们不必担心使用用户不滑动，因为用户不滑动就无法完成操作。因此，在这种情况下，PC的布局样式可以继续吗？
以上述传输过程为例，PC终端直接显示在一页上，而移动终端分为两页。为什么会这样呢？将备注/付款说明放在首页上可以吗？
因为移动用户环境更加复杂和多变，并且更容易受到干扰，所以有必要确保界面信息简单直观。如果页面上显示的信息太多，很容易使用户感到困惑。这里提到的信息量不是绝对信息量。更准确的陈述应该是用户主观感觉到的信息量。在PC端，相同的输入框可能只占据页面的1/4，而在移动端，则占据整个页面的整个页面，从而为用户提供完全不同的外观和感觉。页面被塞满了，很容易使用户感到焦虑。
现在，可以在一页上完成的任务必须跳到几页，并且已添加了操作步骤。用户害怕“内容太多”，不是害怕“步骤太多”吗？不用担心，因为用户可以一目了然地看到页面的内容，并且用户无法立即感知到任务有多少步骤。因为无知，所以无所畏惧。当用户知道此任务中的步骤数时，整个任务已完成。
在此借阅的修订版中，用户必须首先输入借贷金额以借钱，然后将向用户显示其余的借贷期，还款方式和利息信息。此信息都与用户的贷款金额有关。用户尚未输入贷款金额，并且该信息对用户没有意义。最好将其隐藏起来，以使用户的注意力可以集中在完成贷款金额的输入上。
没有一种适合所有人的设计原则，并且无论实际应用场景如何，所有设计理论都无法机械地应用。如果先前步骤和后续步骤之间存在很强的相关性，建议不要在页面中显示它们。例如，许多当前的SMS验证码选择将“输入手机号码”和“输入SMS验证码”放在两页上。我个人对此有保留。想象一个场景。如果用户很长时间未收到SMS验证码，则需要确定电话号码错误，网络故障或其他原因。用户需要返回到上一页进行查看。如果将手机号码和SMS验证码放在同一页上，则非常容易。
3）突出重要信息

我们前面提到的主要是控制移动页面上的信息量。页面上的信息较少好的？当然不是。让我们看一下火车转乘场景。如果您想从南京前往新疆的阿克苏，则没有直达火车，因此只能从西安转乘。让我们看一下以下两种产品的处理方法，左边是12306，右边是Fliggy。 12306仍然是PC端样式的流行，问题出在哪里？ 12306上显示的信息量与Fliggy相似。唯一的区别是12306显示两次旅程的开始和结束时间，而Fliggy仅告诉用户整个旅程的开始和结束时间。
显然，问题不在于信息量，而在于信息呈现的形式。用户应更加注意的信息应使用户更容易发现。对于旅行，用户会更加注意出发/到达站，出发/到达时间和票价。在Fliggy界面上执行高斯模糊，发现用户的视觉焦点落在这些关键信息上。
12306的所有信息都属于同一级别，因此人们无法掌握主要和次要信息。并且界面中的颜色太多，这增加了用户的信息获取成本。
鼠标到手指
PC用户依靠鼠标与界面进行交互，而移动用户则依靠手指。鼠标的操作更加精确，因此移动界面中元素的大小和间距大于PC上的元素。以下图为例，左侧为pc终端，右侧为移动终端。移动终端的输入框仍采用PC终端风格，利率和手续费的详细图标太小，用手指点击时容易误操作。







减去您的界面

先前我们主要强调移动产品应尽量减少界面中的信息量。是否可以通过更改交互设计来实现目标，而无需更改产品信息体系结构？我将向您介绍两种方法：上下文关联和相关性。



1）场景

在页面中，尽管内容很多，但用户真正感兴趣并会与之交互的内容却很少。如果我们可以知道用户在特定情况下对特定内容有很高的要求，则可以突出显示它；否则，如果需求低，我们可以将其隐藏。

对于前面提到的示例，Zhuhuzhong，当用户在搜索结果页面上滑动约3个屏幕后，将出现“问一个Zhiyou”按钮。由于用户轻扫3个屏幕，因此表明用户可能对当前的搜索结果不满意。此时，引导用户提出问题，并且用户的意愿更高。如果我我们始终显示此按钮来提问，但这会减少用户的实际浏览范围并造成干扰。



如上所述，相同的过程需要根据不同的用户场景提供不同的功能。实际上，即使功能相同，我们也必须根据用户的不同使用场景选择不同的显示格式。



仍然知道，为了方便用户快速查看下一个答案，为用户提供了一个浮动按钮。但是，当用户开始滑动页面时，此浮动按钮将更改其样式。这很容易理解。当用户仅进入此页面时，为了降低用户的学习成本，我们需要直接告诉用户此按钮的作用。当用户开始滑入阅读答案的状态时，请减少按钮的形状，以避免模糊界面信息。



2）协会

我们需要整理信息的相关性，将相关信息整合在一起，然后减少页面上的信息量。支付宝账单的每月过滤功能已修改。在用户不得不单击日历图标之前，现在用户可以直接单击月份。这是用户要过滤的月份，因此直接使用月份作为输入更为合适。