面试官会针对这块来问你几个问题：
1，这个页面为什么这样布局？
2，这个模块放到这里是什么原因？
3，你手机上有多少个应用App？交互方面有什么不一样？
看看我下面的思维导图吧！
移动端界面中的版式设计原理
思维导图的内容来自以下这2篇文章，我只是负责将这些知识点写到导图里面，方便直接查看学习！
《About Face 3 交互设计精髓》读书笔记---思维导图
《About Face 3 交互设计精髓》读书笔记
移动端版式设计我们要遵从信息架构来做，除了考虑到视觉风格之外就是根据信息架构来做版面布局，如下：
信息架构
整个产品最离不开的就是以下的5要素，关乎到产品的架构设计：
用户体验要素
任务流即功能型App在框架层以界面设计和信息设计为主，结构层以交互设计为主，范围层以功能规格为主；
信息流即内容型App在框架层以导航设计和信息设计为主，结构层以信息架构为主，范围层以内容需要为主；
表现层是相同的以视觉设计为主；战略层也是相同的以用户需求和产品商业目标为主。
我们设计产品先以产品定位方向为准；然后再逐步设计界面和功能需求。
首页
1，功能型App以组合的方式来做导航设计，最简单是就底部栏目（最好是3-4个），这样可以展示多个功能给用户做多个选择，但也会给用户产生迷惑和困扰，因为选择多了，不知道怎么做好了。(从现在的国民生活水平来讲，信息发达程度已经超过我们父母辈的时代了，所以用户会有选择困难症)。
2，内容型App则以抽屉式导航来给用户阅读效果会更好，因为我们要的是就是让用户沉迷下去，不间断的继续阅读新内容。侧栏一般就是个人中心，设置等跟内容无关的功能界面。内容型的产品肯定也要做信息分类，这样可以让用户关注自己最感兴趣的地方，那么在首页我们可以做成类似微博的顶部，让用户选择不同的分类栏目来关注信息。
搜索
1，搜索功能在产品中的比重相对比较重要，是需要重点突出的，比如：放到头部上面，或者底部栏单独一个模块。
2，移动端的搜索往往都是跳转至单独的搜索页面，根据时间顺序可以分为三个阶段：搜索前、搜索输入中、搜索完成后。
搜索结果页面主要包含以下要素或行为：
重新返回搜索界面的按钮；
搜索输入框，且输入框内容就是搜索的关键字；
删除搜索框内容的删除按钮；
输入焦点放入输入框的时候，搜索页面重新回到第二步的界面；
页面下滑时，搜索输入框往往固定顶部，或者有快速呈现的方式（比如向上滑动立刻成型）；
搜索前大致分为2种情况：
1、直接告诉用户，目前站内搜索得最多的标签或分类是哪个？将列表的形式展示出来。
搜索列表
2、分类搜索：将分类栏目展示出来，减少用户思考的时间！
分类搜索
我推荐的是使用第一种！
2、搜索输入中，有些产品会计划采用“联想搜索”，输入一个关键词，下面直接抽取由数据出来的关键词，我觉得不是特别好，最好的方式始终是直接让你的用户明确自己要搜索什么，要看什么内容？
3、搜索后出来的结果：一般来讲，搜索后的结果都是以tab标签栏的方式展示出来。（1）、出来的结果是有3-4个顶部栏，然后让用户继续选择查看.
（2）、列表式，移动端一般是2列比较合适，所以有可能是瀑布流或等宽高的列表。
个人中心
我们见到最多的个人中心往往是下面2种：
个人中心
将有关于用户的一切信息都以tab标签栏的方式分类展示出来！
但国内很少会见到以下这些页面设计：
个人中心
这个是使用时间轴的方式展示用户在某个时间段操作的反馈信息。
下面这个是比较有新意的个人中心：
个人中心
在首页如果使用抽屉式导航，也没有使用底部栏目来做的话，最好的抽屉式导航设计就是这个，侧栏内容是引导用户进行除站内内容外的其他操作。该页面设计简单的将个人中心完美展示出来是非常不错的做好，我们应该学习这个。
设置中心
设置中心
设置页面是所有产品中都离不开的，必须页面。
这里要给用户展示的就是引导用户进行一些必须的设置：清理缓存，关于我们，反馈意见。我们可以以色块的方式展示出来，突出不同的类别或者是列表的方式展示出来。这个设置页面是给用户一个了解我们产品，反馈意见信息的入口。
当然，所有的页面版式设计都应该以自有产品的定位来做，这里只是整理和介绍产品中4个必须的页面，仅供参考。
请记得点“喜欢”! 请加QQ群:产品圈--247485909.本群讨论产品工作为主!
网友评论