模块|项目总结：以目标为导向的设计，房源管理体系改版重构( 二 ) 楼市|一线城市

case3: 租后，房源下架后，管理页更多侧重在状态展示，将房源整个生命周期的记录显露出来。

如何选择更合理的方式引导用户将每个页面做到“合而不同”？
对每种状态下的页面逐个分析，我们将每个页面中所有任务模块按优先级排序：主线内容>辅线内容>附加值内容。
如租前，主线任务是提醒房东此时最需要做的事情是认证房源，在头部状态上，不仅有与租中/租后相同的房源当前状态提示，还增加了任务节点，让房东明确的知晓当前所处位置，加强对于整体房源上架流程透传，明确当前主线任务的重要性。

租前页面管理页面设计上，默认“确认个人信息”模块展开，做认证前最后的信息确认工作，同时也保证了在首屏内容足够简洁清晰，保证主线任务顺利进行。

提升页面精致感
提升页面精致感，可以在用户的潜意识中留下更优质的体验印象，也是视觉设计师提升设计稿质量的有效方式。优雅舒适的色彩和插图、恰到好处的模块修饰、增加微动效等都可以提升页面的精致感。
优雅舒适的色彩和配图：色彩可以简单直接的传达感受，不同色彩传达的内容不同。可以根据房东对于出租各阶段的感知不同，选取不同的色彩搭配传达信息。
我们结合58app的主色橙色进行合适的颜色搭配，最终选取了橙色、绿色、灰色、金色分别表现租前、普通房东的租中、金牌房东的租中、租后管理页面。沉浸式的无标题栏设计，通顶的颜色中增加表现对应阶段的小插图，辅助传达信息，使页面更加活泼。

恰到好处的模块修饰
对不同功能模块选取恰到好处的修饰，可以对模块增加视觉吸引力，增强内容表现力。
在租中房源数据模块，在模块背景增加了曲线图，用以表现此处的数据效果；在加速出租模块，右上角增加了向上箭头，用以表现此处所内容均可带来加速效果；房源转委托模块，用了真实专业的中介形象，且中介形象超出模块区域，打破了布局约束，让页面更灵动透气。

增加微动效
过渡内容增加微动效，可以使页面更柔和；重点内容增加微动效，可提升信息层级，提高销量。微动效能够给页面带来活力。在房源管理详情页的设计中，也分别在不同的地方使用了微动效。
在沉浸式无标题栏上滑时，增加微动效，使内容和顶部的插画元素过渡不突兀；打开租中页面时，对每日房源数据数字用滚动效果呈现，增加视觉吸引力；若当前房源有预约看房订单时，在icon上方增加数字提醒的同时，对icon增加缩放+流光效果。

04 最后此次房源管理详情页是从管理的架构出发，进行管理概念和页面重构的改版，未来我们会对改版效果进行一系列测试，有结论会继续和大家分享，如有任何问题，欢迎在留言区互动～
作者：邵秀芬，UI设计师
本文来源于人人都是产品经理合作媒体@58用户体验设计中心
题图来自Unsplash，基于CC0协议