如果该页面设计质量不足，或是展示的效果不佳，那么观看者对项目的评价就会直线下滑。所以做好首页的必要性是毋庸置疑的，而下面就是我们本次改版的对象：
首页优化说明
这次的优化的目标，是在原有的基础上做简单的调试实现效果的提升，让你们可以借鉴用极少的时间优化自己的项目首页，而不是把它们推翻重做。
所以我们先简单分析一遍原图当中存在的问题，包含下面这些要点：
全局问题：
整体配图非常复杂、凌乱，拉低页面整体视觉效果 使用的字体规格类型过多，信息的浏览不顺畅 主色出现的场景权重过低导致色彩呈现没有主次 页面视觉重心整体靠下，强弱对比失衡
细节问题：
1.顶部背景色“青黄不接”，过于朦胧的颜色和文字、组件无法很好的分隔，且搜索栏的轮廓比较奇怪，顶部栏整体内容太多太拥挤。
2.强推和推荐模块内容字段都很分散，很难看清里面的内容。
3.月排行太拥挤，前三名书籍很难看清缺乏吸引力，下方文字也过小。
4.底部导航的大黑描边图标和上方的整体风格不搭，非常突兀。
而要解决这些问题，先不急着想推倒重做，而是先了解什么样的综合信息型页面是合适的，适合作为项目第一个页面展示。
我给出的建议包含下面几点：
色彩鲜艳明亮，品牌主色突出易于识别 文字信息主次分明，尤其标题信息易于辨识 组件设计工整（异形轮廓少），视觉效果平衡 配图精挑细选，要拉高页面视觉的档次水平 适当控制整体字段和信息量，提供喘息空间 统一圆角、投影、字号等小细节参数 没有把握的部分使用常规主流的布局方案（不出错）
基于上面的思路，我们开始对原设计做个简单的优化：
第一步，优化顶部设计，将搜索栏独立出来增加悬浮效果，强化分页器标题文字增加识别度。
第二步，优化顶部推荐组件，移除背景色使用彩色标签，增加封面和标题的尺寸。
第三步，优化精选推荐组件，强化标题，把标签换成常规设计样式，再优化下方书籍信息，增加空间大小。
第四步，优质排行组件，简单调整1、2、3名的排版方向，节约纵向空间，再加大封面的尺寸。
第五步，优化底部导航，使用灰色实心图标，弱化图标的突出性，和上方设计能更好结合。
最后，在看看和原图之间的对比，是否有了清晰的提升：
最后强调一点，就是作品集里首页和项目里展示的首页是 “不一样” 的，如果实际项目里有很多限制导致视觉效果奇差无比（比如书籍封面就是乱），那么作为面试者是不会考虑你背后原因的，这项目就是通不过，连到面试的机会也没有。
所以要放进项目中肯定要优化，而优化也不能改太离谱，确保你改动的结果全是经得起解释的，而不是做非常激进（还做不好）的改版，导致界面充斥大量不成熟、无法解释的设计。
结尾
如果没有足够信息就不要追求过度复杂的设计，简化后控制好细节远远比塞满内容的方案效果更好，看起来视觉观感更佳。项目展示的界面要注重“展示”效果，而不只是孤立在你设计区域中央的画布。
如果有同学自己也回去优化，可以把优化发到评论区或到社群里交流。
还有，我的新课即将开课！想要高效提升产品和体验设计能力，可以扫码咨询我们下期的正式课程。
我们下篇再贱！
優(yōu)網(wǎng)科技秉承"專業(yè)團(tuán)隊(duì)、品質(zhì)服務(wù)" 的經(jīng)營理念，誠信務(wù)實(shí)的服務(wù)了近萬家客戶，成為眾多世界500強(qiáng)、集團(tuán)和上市公司的長(zhǎng)期合作伙伴！
優(yōu)網(wǎng)科技成立于2001年，擅長(zhǎng)網(wǎng)站建設(shè)、網(wǎng)站與各類業(yè)務(wù)系統(tǒng)深度整合，致力于提供完善的企業(yè)互聯(lián)網(wǎng)解決方案。優(yōu)網(wǎng)科技提供PC端網(wǎng)站建設(shè)（品牌展示型、官方門戶型、營銷商務(wù)型、電子商務(wù)型、信息門戶型、微信小程序定制開發(fā)、移動(dòng)端應(yīng)用（手機(jī)站、APP開發(fā)）、微信定制開發(fā)（微信官網(wǎng)、微信商城、企業(yè)微信）等一系列互聯(lián)網(wǎng)應(yīng)用服務(wù)。
公安局備案號(hào)：
專屬顧問
