需求之页面设计及布局

一、页面设计

参考京东、百度、高德地图等各应用系统，页面大致分为三类：首页、定位页、工作页。

（一）首页

首页：一般包含大家最关心的宏观信息以及系统主要功能的入口，方便用户一进入系统就可以看到自己关心的内容。

可以分为主要功能入口、主要信息推荐；

1、首页设计要求：依据岗位和频度定首页

岗位不同，呈现的信息不同；

岗位不同，入口不同；

首页应包含高频功能；

高频功能应往前放；

（二）定位页

定位页：通过和用户的交互录入一些信息，然后定位到工作的页面。

定位页的作用是快速找到具体的工作页，系统应该有快捷入口，而不是每次都要返回首页重新找功能入口。

注意事项：多入口找工作页，便捷入口找工作页。

（三）工作页

工作页：完成一项功能的工作页面，用户一般在这个页面停留很长时间，像购物的具体页面、地图导航页面等，例如京东的具体商品页面。

1、设计工作页注意事项

设计工作页时要充分考虑用户需求，工作页要设置一键返回功能；

思考用户做这件事的同时还可能看什么？可以设置快捷入口，看到所需信息；

做完这件事还可能看什么？设置推荐功能入口。

二、页面布局

常见的页面布局有三种：上下布局、左右布局、T字布局。

（一）上下布局

1、BS、CS系统、软件首页；2、层级关系较简单或仅有一级菜单的系统；3、网页中的布局；

上下布局多用于展示类的页面，上部分是Logo和系统名称（以及菜单），下部分是展示（操作）内部，层级关系简单。

例如：360桌面端操作页面

（二）左右布局

左右布局常用于各行业管理系统、部分CS系统\软件。这种布局模式的优点是左右功能分区非常清楚，菜单在左侧，操作或展示内容在右侧。

例如：常用社交软件微信：

（三）T字布局

T字布局常用于多种管理系统页面、适用多层级菜单系统、部分BS系统\软件、网页子页面中。

它的主要特点：有的系统在Top区域有一级菜单，有的系统Top位置无菜单；左侧区域多为树形菜单；右侧是操作（展示）区域。T字布局是最传统的系统布局模式，也是大家日常工作中接触最多的布局模式。

例如：学习网站菜鸟教程