最近我看到我的微信群聊中出现了这样一句话“像这些信息列表 排好就行不需要花里胡哨”所以我就想来聊聊APP中的这个页面；（由于群里的内容不便放到这里）所以我想到了之前的作品中有涉及到这类界面；

然后我对【之前做的作品集中的作品】与【现在我觉得不错的页面】，简直不忍直视,顺便自黑一下；（如下图）

既然拿出来了，我就先来谈谈在现在我对于这个页面的理解（谈谈之前的错误）：

1．  顶部导航栏与内容区没有明显的分隔符；

（与下方的信息融合在一起，会使用户感觉不到层次感，）

2．  头像的显示区域不够清晰，字体的选择过于草率，昵称的字间距过大，附属内容虽然进行了颜色对比但依然不能与上方的昵称进行有效的区分；

3．  按钮的区域过大（虽然是整个页面的核心功能）使用户看着很笨重；

4．  上方内容与下方板块的过度符显示的太重，（并不是尺寸过高，颜色过重的原因）就不应该选取矩形

5.下方的导航栏就是icon的问题了，具体不再多说

虽然说下方的图标没有犯下过大的错误，但是也少了最重要的层次感；

我发现下边这个页面就基本上解决了这些问题还加入了特别的点：

1.      对于顶部导航栏的主要内容进行了加粗，icon则使用了浅灰色进行衬托，提示使用了主色的蓝点进行提醒；顶部导航栏与内容区有明显的分隔符（层次1）；

2.      头像的选图方面进行了选择（人脸的方向朝右会引导用户进行昵称和附属信息的阅读），昵称文字的大小与颜色与顶部导航栏的主要信息一致又与附属信息的字体颜色进行了区分（值得一提的一点是大部分不会审美的甲方会对于附属信息增加要求，以此造成设计的困扰）；

3.      按钮分成了两个，使得上部的信息更加的平衡不会感觉“头重脚轻”

4.      上方信息与内容区域的背景变化使得整体页面的层次在加一层，也能使后面的信息更为凸出（有趣的是有些甲方并不会喜欢这种做法，或者一些背景颜色的调节不恰当也会会了整个页面）；

5.      Icon与信息的左对齐则反到给页面增加了留白（增加了呼吸感），小icon淡色圆背景则是为了不抢夺页面主体内容的视觉显示；而下方内容区则和上部进行了对比变化。

两个页面都是对信息再整理，所以甲方说的"简单排版一下”并不是把信息罗列上去而已，多想想产品的调性加入合适的板块才是设计之前要做的。(ง •_•)ง

微信公众号：HOLD FUTURE