本次的设计任务是为用户提供更好的搜索体验。
01
设计背景
一年前（2019年年中），我在从事Wunderflats设计工作。我的任务是为移动用户创造更好的搜索体验。它更像是一个网站的响应式版本，但采用了更人性化的方法，为用户通过移动设备浏览带家具的公寓时提供了更大的灵活性和便利性。
| Wunderflats是一个在线租用带家具的公寓的平台。Wunderflats将租户、房东和公司集中在一个平台上，使租用尽可能方便。 |
注意：当前网站（响应版本）可能有更新，因为此任务是2019年年中的。
设计挑战
我们如何为移动设备用户提供更好的租房搜索体验？
用户画像
用户反馈
“网站看起来很整洁，易于浏览。”
“在我要求的数百套公寓中，只能找到一间。”“我不想为了在柏林找到一套合适的公寓而翻阅6页，每页有30条信息。”“我只想在手机上浏览一些公寓，以了解带家具的公寓的价格，然后再做出有关搬迁的决定。”“我想搬到波茨坦，因为它靠近柏林，但交通并不那么繁忙。但遗憾的是，这里似乎没有公寓可供选择。”
用户信息
- 大多数租户都来自德国之外。
- 30％的用户清楚地知道他们要搬到新城市中的什么地方，其余则不清楚。
- 大多数用户是为公司工作的员工（无论是新入职员工还是由于公司搬迁的员工）。
- 对于大多数人来说，到达工作地的时间，以及可以进行高效的远程工作的公寓非常重要。
- 大多数用户并非一个人搬家，而是与伴侣、孩子、同事或同学一起。
- 用户希望找到满足他们不同需求的完美公寓。
- 对于租客来说，最大的挫败感发生在他们被申请的公寓拒绝的时候。这通常是因为房东很挑剔。
- 如果租客是吸烟者，有孩子和/或宠物，可能无法和房东达成共识。
用户行为
- 对于大多数用户而言，最重要的因素是公寓的位置。
- 不到25％的用户在移动设备上会筛选搜索结果（往往害怕，筛选后，信息不全面）。
- 如果能够与“地图”进行交互，则有70％的用户更喜欢使用我们的当前列表。
- 图片形式对用户发现合适的房子很重要。平均来看，用户在离开网站或单击列表以获取更多信息之前，会在搜索结果页面上点击4.5张图片。
02
竞品调研
我做的第一件事是完成预订Wunderflats的完整过程。这样我才能与初次使用的用户一起了解网站的不同方面及其与用户的交互行为，以及如何搭建桥梁以使整个流程人性化，并使流程更加便捷、易于理解。 搜索模块是W
underflats中最重要的部分。因此了解如何使搜索变得更加动态和直观是非常重要的。所以需要详细了解竞争对手的运作方式。
我浏览了Airbnb.com、booking.com、9flats.com、homeaway.com等等，以了解它们的运作方式、遵循的流程，以及如何使预订公寓更加轻松。关于如何使搜索模块更有目的性和更有意义，我看到了很多不同的想法。尤其是Airbnb的流程和清晰度是我所能看到的最佳体验。
我在网上浏览有关租用带家具的公寓时，得到了很多启发。因此，在了解了这些公司如何操作其搜索模块之后， 我开始绘制粗略的线框，并将我的想法写在纸上，看看如何为用户提供更多的个人和交互体验。最好的办法就是站在用户的立场上，看看他们在预订公寓时会遇到什么样的障碍和难关。渐渐地，我发现了一种不仅是作为设计师，而且是作为用户能够满意的方法。该解决方案使过程更加轻松，并为用户带来真正的享受体验。
其他网站的痛点
1.网站没有“评分或评论”部分2.用户没有任何关于附近地方的信息，例如购物中心、旅游景点、餐馆等3.在浏览网站时，我注意到用户只能预订1个月或以上的公寓4.列表中没有更少持续时间或使用期的公寓5.无法在响应版本中选择主页上的日期6.响应式版本的设计不是很好，无法在主页上选择日期7.我需要去到列表页面选择我想要的日期8.无法区分不同类别的人群（学生、上班族等）9.没有分配适当的筛选器10.外观和感觉显示出过时的设计11.没有给用户建议或推荐
优化后
我进行了一些优化，从按钮到曲线、渐变、图标和插图、字体粗细，使它在拥有wunderflats的核心价值的同时，看起来更有吸引力，更生动。
接下来我将带你看看其中一些优化，以使你更容易理解变化。
线框图
从不同的平台和当前机制的痛点获得想法之后，我制定了一种交互式体验，该体验将集中在平台的功能和可用性上，目标是创建一个直观的体验，以减少摩擦而尽可能租用公寓。
下图是页面的一些主要线框。在制作这些数字线框之前，我喜欢用纸和铅笔进行手工绘制。这样我就可以在纸上快速迭代我的想法，然后再进行数字化。这也让我自己想象出针对不同问题集的不同情况。
插图
我使用Adobe illustrator来创建这些插图。我画了一些粗略的初始草图，然后将其数字化。我尝试使用颜色、阴影、笔触来寻找最适的风格，并平衡整个系统。
设计页面第一版：
该版本与Wunderflats网站的外观非常相似。我进行了一些小小的更新，但核心价值属于已经存在的网站。以下是Wunderflats旧网站，我从中进行了参考。
设计页面第二版：
我设计的第二个版本，外观和感觉更现代化。希望令用户使用的过程是轻松和愉悦的。以下是此版本的页面：
03
结论
我希望我能够制定一种交互式体验， 将重点放在平台的功能和可用性上，目标是创造一种尽可能减少用户行为的直观体验。我试图将一些重要的信息放在屏幕上，使用户可以直接点入。
参考文章：
作者：Prakhar Neel Sharma
译者：设计小菌
原文请戳【阅读原文】
为尊重版权和译者
转载请联系我们
相关阅读
你有想过为你的“校园APP"重新Redesign下用户体验吗？
我 们
服务.体验.交互设计传道者
公众号
「yizhizhaojun」
一只朝菌设计学园
联络微信
平菇老师
「zhaojundesign」
「一只朝菌设计学园」由毕业于清华大学人机交互专业的学长创办，致力于创造卓越的设计知识学习课堂，专注交互设计、用户体验设计、服务设计领域的专业知识教育。
教师团队来自于清华大学、同济大学、上海交大、北京理工大学、北京邮电大学、中山大学、华南理工、江南大学、香港大学、香港理工、台湾科技大学、Imperial、POLIMI、Delft、Oslo、Goldsmiths、Edin、Glas、Manc、Lancaster、Loughborough、Leeds、Arts London、BCU等国内外高校，以及Microsoft、阿里巴巴、腾讯、网易、华为、央视、百度、美团点评等企业集团。
清华大学有训曰：行胜于言。「一只朝菌」谨承母校百年教诲，时刻铭记师者之责，为好学者传道授业，为有志者掌灯引行。