Zillow のような顧客中心の企業にとって、デザインの重要性はこれまで以上に高まっています。しかし、月間 2 億人の訪問者に対応するのは大きな課題です。そして Zillow が進化を続けるにつれ、同社のデザインチームが解決している課題もまた進化してきました。
より複雑なプロジェクトが次々と舞い込むようになると、Zillow のデザインチームは、インタラクティブなプロトタイプをすばやく簡単に作成できるツールが必要だと悟りました。その検索の結果、ProtoPie にたどり着いたのです。
最近、私たちは Zillow の 3 人の 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 は言います。
必要だったのは、コーディングを必要とせず、インタラクティブなプロトタイプをすばやく簡単に作成できるツールでした。
「2019 年 10 月までに、私は解決策を積極的に探していました。そんなとき同僚が、ProtoPie という新しいプロトタイピングツールの話を耳にしたと教えてくれたのです」と Rom は言います。
IMX プロトタイプ - ホーム写真。
ProtoPie は有望そうだと感じた Rom は、移動しながらツールを学び始めました。彼によると、「取り組んでいたプロジェクトの最初のエンドツーエンドのデザインプロトタイプを作成し、同僚やシニアリーダーに提示するまでに 5 日しかかかりませんでした」とのことです。
「フィードバックは非常に好意的で、それがこのプロジェクトのデザインプロトタイプの反復を重ねる原動力になりました」と Rom は続けます。「ProtoPie によって、私はデザインとプロトタイピングを同時に行えるようになりました。」
Rom がデザイン責任者たちを説得し、ProtoPie のエンタープライズライセンスの承認を得るまでに、それほど時間はかかりませんでした。これらは 2020 年 2 月から導入されています。
Zillow のより多くのデザイナーが ProtoPie の導入を決めた理由
2021 年に Zillow に加わった Priya Gupta は、ProtoPie を使って作成できる強力なプロトタイプに感銘を受けたと話します。特に、このツールにはコードを書く必要がない点が印象的だったそうです。
Gupta は、「小さなプロジェクトで試してみたところ、基本的なインタラクションを作成するのに 2 分もかかりませんでした。これが私にとっての『aha』の瞬間で、ワクワクして、このツールをさらに試したいと思うきっかけになりました」と語ります。
インタラクティブな間取り図。
シンプルなインタラクションから、より複雑で繊細な挙動まで備えたデザインプロトタイプを作成するには、Zillow のデザイナーたちは、高精細プロトタイピングツールが必要だと考えました。それは次のようなものです。
詳細なインタラクションやフローをテストできるほど強力であること。
ライブのユーザーテストにも十分柔軟であること。
主に Web 技術で動作し、事実上あらゆるデバイスからアクセスできること。
セットアップが速く、プロトタイプが複雑になっても簡単に管理できること。
特定のプラットフォームに限定されず、モバイルネイティブ、モバイル Web、デスクトップ Web、縦向き・横向きモード、タブレット、さまざまなサイズで製品体験を表示できること。
幸いにも、ProtoPie はそれらすべての条件を満たし、さらにそれ以上の価値を提供しました。
ProtoPie が Zillow の UX デザインプロセスにもたらす価値
ProtoPie がデザインプロセスにもたらす価値をどのように測っているかを尋ねると、Rom は 4 つの重要な側面を挙げました。
1. コードを書く必要なく、デザインの細部に忠実なプロトタイプを作成すること
Rom とチームメンバーが ProtoPie に惹かれた最大の理由は、コードを書く必要なく、リアルなプロトタイピングを通じてデザインを検討し検証できることでした。
3D ホームビュー。
「私にとって重要なのは、チームが体験について抱く疑問に応える形で、アイデアを効率よくプロトタイプに変えられることです」と Priya Sheth は言います。「ProtoPie なら、急な学習曲線なしに、またインタラクションのコーディング方法を学ぶ必要もなく、それを実現できます。」
2. デザインを提示しながら、同僚やリーダーにも同時にプロトタイプを試してもらうこと
「頭の中にあるデザインを、自由に触ってその場で調整できるデジタルな現実に変え、その後チームメンバーと共有してフィードバックをもらえること。それが ProtoPie の一番気に入っている点です」と Rom は言います。
デザイナーがプロトタイプを提示している間、Zillow の同僚や上層部は ProtoPie Player を使うことで、自分のデバイス上で簡単にデザインを試し、より直感的に体験できます。
3. 社内外のユーザーにプロトタイプをテストしてもらうこと
「私たちのデザイナーとリサーチャーは、ローファイから高精細プロトタイプまで、デザインプロセスのあらゆる段階で ProtoPie を使い、テストにかけることができます」と Rom は言います。
4. 将来の反復の可能性を描くこと
「ProtoPie のプロトタイプは、機能の使いやすさや改善できる点に関する私たちの重要な疑問に答える助けになります」と Sheth は言います。「このテストから得られるフィードバックによって、顧客へのリリースに向けて前進できます。」
Zillow がアプリや Web プロトタイプに ProtoPie を活用した例
1. ホーム詳細ページ
チームは ProtoPie を使って Home Details ページの機能に取り組んでいます。これは、ユーザーが Zillow を訪れたときに目にする主要な UX 面の 1 つです。
*Zillow の Home Details ページ。*
2. 検索結果マップページ
「ネイティブアプリ体験の中にある Search Results Map ページの作業で ProtoPie を使いました」と Sheth は言います。
多くの Zillow 顧客は、地図表示内の物件カード上で写真をスクロールできる機能を求めていました。チームは、物件カードのスクロール機能を維持しつつ、顧客の要望に応えるために写真カルーセルも追加したいと考えました。そこで、同じ領域で 2 つの横スクロール操作を行ったときに、顧客にとって不快な体験にならないかを ProtoPie でプロトタイプ化し、テストしたのです。
これは、ProtoPie が実際の地図のインタラクションをシミュレートできるおかげで可能になりました。ProtoPie チームが作成した次のデモをご覧ください。
3. 未公開の複数機能
「私たちのチームは集まって、今後登場する 6～7 個の機能を紹介する大規模なプロトタイプを作成しました」と Gupta は言います。「個々の機能はユーザーとテストしましたが、それらがすべて一体感を持って連携し、互いに干渉しないことを確認したかったのです。」
Gupta は、これには複数のシーンにまたがる変数の使用や、複雑な条件ロジックなど、ProtoPie の最も高度な機能の活用が含まれていたと説明します。
地図の拡大・縮小をシミュレートするなど、いくつか難しい点はありましたが、全体的な体験はスムーズでした。
「地図は Zillow.com と Zillow モバイルアプリのどちらにとっても重要な要素です」と Gupta は付け加えます。「私たちが使っている地図プラットフォームを統合したり、静止画像を使って回り道をすることなく地図のズームイン・ズームアウト機能を作成できる方法があれば素晴らしいのですが。」
「ProtoPie は素晴らしいですが、完璧ではなく、改善と成長の余地が大いにあります」と Rom は言います。「ProtoPie がもっとシンプルになり、より多くのデザイナーにとって使いやすいものになることを願っています。」
コード不要の高精細プロトタイピングでデザインチームを力強くサポート
ProtoPie は、Zillow をはじめ 15,000 社のデザイナーが、リアルでインタラクティブなプロトタイピングを利用できるようにします。今すぐご自身でお試しください！
