对于像 Zillow 这样以客户为中心的公司而言,设计比以往任何时候都更重要。但 每月 2 亿访客 是一个需要服务的庞大受众群体。随着 Zillow 持续发展,其设计团队所解决的问题也在不断演变。
当越来越多复杂项目摆到面前时,Zillow 设计团队知道他们需要一款能够帮助他们快速、轻松创建交互原型的工具。这次寻找将他们带到了 ProtoPie。
最近,我们与 Zillow 的三位 UX 设计师进行了交流,他们分享了使用 ProtoPie 的经验,以及它如何帮助他们打造面向未来的房地产用户体验:
Rom Impas,高级首席 UX 设计师
Priya Sheth,首席 UX 设计师
Priya Gupta,高级 UX 设计师
认识 Zillow UX 设计团队
Zillow 的体验设计团队由 100 多位 UX 设计师、研究员、项目经理、UX 工程师等组成,旨在“打造创新体验,让 Zillow 成为买房、卖房、融资或租房最受喜爱的地方”。

ProtoPie 是该团队进行复杂端到端原型设计的首选工具。
Zillow 发现 ProtoPie 的历程
2019 年夏天,当 Rom Impas 加入 Zillow 时,团队正在使用另一个平台来创建静态设计和小规模原型。
然而,他们意识到静态设计稿和模型只能让他们的设计走到一定程度。
Rom 表示:“在静态屏幕之间可能发生很多事情,而这些只能通过原型设计来传达,并使其可见且具有说服力。”
他们需要的是一款无需编写代码、又能帮助他们快速轻松创建交互原型的工具。
Rom 说:“到 2019 年 10 月,我正在积极寻找解决方案,一位同事提到听说过一款名为 ProtoPie 的新原型工具。”

IMX 原型 - 房屋照片。
由于觉得 ProtoPie 很有前景,Rom 开始边做边学这款工具。他说:“我用了五天时间就为我正在进行的项目做出了第一个端到端设计原型,并将其展示给同事和高级领导。”
Rom 继续说道:“反馈非常积极,这推动了该项目一系列设计原型的迭代。ProtoPie 让我能够同时进行设计和原型制作。”
没过多久,Rom 就说服了设计主管,批准为 ProtoPie 购买企业许可证,并且他们自 2020 年 2 月起一直在使用。
为什么 Zillow 有更多设计师决定采用 ProtoPie
2021 年加入 Zillow 的 Priya Gupta 告诉我们,她对使用 ProtoPie 可以创建的强大原型印象深刻,尤其是因为这款工具不需要编写任何代码。
Gupta 说:“我在一个小项目中试了一下,不到两分钟就创建了一个基础交互。这就是让我兴奋并促使我进一步尝试这款工具的‘啊哈时刻’。”

交互式平面图。
为了从简单交互创建到更复杂、细腻行为的设计原型,Zillow 设计师发现他们需要一款高保真原型工具,并且该工具应当具备:
足够强大,可测试细节交互或流程。
足够灵活,可用于实时用户测试。
主要基于 Web 技术运行,并且几乎可在任何设备上访问。
搭建迅速,且即使原型复杂度增长也易于管理。
不受限于特定平台,并且可展示移动原生、移动网页、桌面网页、竖屏与横屏模式、平板及不同尺寸下的产品体验。
幸运的是,ProtoPie 不仅满足了所有这些要求,甚至更多。
ProtoPie 如何为 Zillow 的 UX 设计流程创造价值
当被问及如何衡量 ProtoPie 为其设计流程带来的价值时,Rom 强调了四个关键方面。
1. 按照设计细节创建完整高保真原型,无需编写代码
真正让 Rom 和团队成员认可 ProtoPie 的,是它能够通过真实感原型来探索并验证设计,而且无需编写代码。

3D 房屋视图。
Priya Sheth 说:“对我而言,关键在于能够高效地把想法转化为原型,以回应团队对体验提出的问题。ProtoPie 让我在无需陡峭学习曲线、也无需学习如何为交互编写代码的情况下做到这一点。”
2. 展示设计,并让同事和领导同时试用原型
Rom 说:“我最喜欢 ProtoPie 的,是能够把脑海中的设计变成可操作、可随时调整的数字现实,然后分享给团队成员获取反馈。”
在设计师展示原型时,Zillow 的同事和领导还可以通过 ProtoPie Player. 在自己的设备上轻松体验设计,从而获得更直观的感受。
3. 让内部和外部用户测试原型
Rom 说:“我们的设计师和研究员能够在设计流程的任何阶段使用 ProtoPie,从低保真到高保真原型,并进行测试。”
4. 设想未来可能的迭代
Sheth 说:“ProtoPie 原型帮助我们回答有关功能可用性的关键问题,以及哪些地方可以改进。这些测试反馈让我们能够继续推进并发布给客户。”
Zillow 如何将 ProtoPie 用于 App 和 Web 原型的示例
1. 房源详情页
团队使用 ProtoPie 来开发房源详情页功能,这是用户访问 Zillow 时看到的主要 UX 界面之一。

*Zillow 的房源详情页。*
2. 搜索结果地图页
Sheth 说:“我使用 ProtoPie 来优化我们原生应用体验中的搜索结果地图页。”
许多 Zillow 客户都希望在地图视图中的房源卡片里滚动浏览照片。团队希望保留房源卡片滚动功能,同时新增照片轮播以满足客户需求,因此他们使用 ProtoPie 进行原型制作与测试,以验证在相近区域内同时进行两种横向滚动操作是否会给客户带来负面体验。
这之所以可行,得益于 ProtoPie 能够模拟真实地图交互的能力,正如下方由 ProtoPie 团队创建的演示所示。
3. 多个尚未发布的功能
Gupta 说:“我们的团队一起创建了一个大型原型,用于展示 6-7 个即将推出的功能。我们分别测试了单个功能,但也希望确保它们能够协同工作,并且彼此不干扰。”
Gupta 解释说,这“涉及使用 ProtoPie 最先进的能力,例如跨多个场景使用变量和复杂条件逻辑。”
尽管存在一些困难,例如模拟地图缩放,整体体验仍然很流畅。
Gupta 补充道:“地图是 Zillow.com 和 Zillow 移动应用的重要组成部分。如果能有一种方式集成我们使用的地图平台,或者无需用静态图片‘曲线救国’就能实现地图放大缩小功能,那就太棒了。”
Rom 说:“ProtoPie 虽然很出色,但也并不完美,仍有很大的改进和成长空间。我希望 ProtoPie 能变得更简单,并让更多设计师都能轻松使用。”
用无代码高保真原型赋能你的设计团队
ProtoPie 让 Zillow 及其他 15,000 家公司的设计师都能轻松进行真实、可交互的原型制作。立即亲自试用吧!




