変換設計：ユーザーが本当に愛するオンラインサービスの作成

「変換」という用語は、長年にわたって防衛産業企業の民間製品に関連付けられてきました。 しかし、ITプロフェッショナルは、まったく異なる団体を持っている可能性が高くなります。 ただし、ここでは、変換設計などの概念について説明します。 Webサイト開発に対する一般的に受け入れられているアプローチは、次のようなものです。Webデザインのブロック、レイアウト、開発などのブロックがあります。 しかし、過去2〜3年にわたって、すべてが急速に変化し始めています。 「Webデザイン」という用語自体は徐々に消滅しつつあります。なぜなら、ブラウザに加えて、適応性のあるデザインがあるからです。 概して、Webデザインはそのような明確な方法で存在しなくなりました。 サービス設計-データ駆動型設計など、あらゆる種類の追加用語が登場しました。これは、とりわけ変換です。 この現象は、1C-Bitrix Kiev パートナー会議 、 AICマネージングパートナーSergey PopkovおよびAIC製品分析部門長Vitaliy Cheremisinovでのスピーチに捧げられました。

まず、現在の傾向を見てみましょう。 一般的に、今日の状況は2015年とそれほど変わりません。 しかし、私たちの意見では、2016年に何が関係するのかという興味深い例がいくつか見つかりました。

現在の傾向

最初の例は「チャペル」です。 スマートウォッチはすべてのプラットフォームで利用可能になりました。 絶対的に言えば、ユーザーはまだ少ないですが、それでも増加傾向にあります。 多くの設計者は、これらの顕微鏡ディスプレイとアプリケーションの相互作用の概念を実験し始めています。



2番目の例は、製品自体と特にWebページの設計を集中的に簡素化し、不要なものをすべて取り除きます。 場合によっては、一般的にアイコンが回避され、きれいな活版印刷が残されます。 言い換えれば、誇りに思う製品がある場合は、あらゆる種類のWebページ装飾よりも、製品自体に可能な限り焦点を合わせることをお勧めします。

3番目の傾向は、ビッグデータの視覚化です。 統合されたインターフェイスは、さまざまなデータスライスがカードに重ねられ、インタラクティブなインフォグラフィックなどの非常に興味深いものが得られるときに作成されます。



4番目の傾向は、アニメーションの普及です。 グラフィックのミニマリズムを補うように設計されており、「過剰」を取り除きます。 現在、マイクロインタラクションアニメーションはあらゆる場所で使用されており、開発者はJavascriptとHTML5でより多くの作業を行い、インターフェイスをアニメーション化してそれらをより面白く見せています。

そこで、もう1つ-5番目-の傾向が現れました。サイトが再起動せずに動作を開始するときの空間インターフェイスです。 すべてがバックグラウンドで読み込まれます：ビデオ、グラフィックス、写真、すべてが飛ぶ、ジャンプ...アナリストにとって、これは頭痛の種です。単一の物理的なURLではなく、すべてが停滞しています。 追加の統合は、設定が必ずしも便利ではありません。 たとえば、大規模な製造会社Acmeの新しいサイト：



企業のWebサイトの設計の観点から見ると、これは完全なミニマリズムに基づいて空間インターフェイスが構築されている場合の非常に珍しいソリューションです。 そして、ここで質問に近づきます：なぜ今日設計が必要なのでしょうか？

デザインの本質

あるアプローチによれば、デザインには感情とサービスの2つの形式があります。 私たちの実践では、顧客が最初のフォームに集中しているという事実にしばしば遭遇します。



どちらの写真が好きですか？ それはとても美しいからです。 しかし、誰もが車の本当の目的を忘れています。 多くはカーディーラーに来て、好きなモデルを選択します。 そして、自分自身に質問する人はほとんどいません。この車はどうなるのでしょうか？ 多くの場合、テストドライブを使用しなくても購入します。

今日、サービス設計はますます一般的になっています。 彼にとって、まず第一に、「インターフェースはどのように機能するのか？」、「ユーザーはどのように彼と対話するのか？」という質問に対する答えが重要です。 感情的な要素の役割はかつてないほど小さく、オンラインサービスは、すべてがどのように設計されていても関係なく、主なものはその仕組みです。 ユーザーがエントリポイントから出口ポイント、最初の請求書、支払いなどに行く方法。

ウィキペディアによると、「デザイン」の定義は次のとおりです。

「広い意味では、デザインは芸術的なデザインだけでなく、生産、消費、対象環境における人々の存在の機能に関するより広範な社会技術的な問題の解決に参加する必要があります。

ここでは、西洋のアプローチについて説明することをお勧めします。 ロシアでは、デザインはボタンの色、フォントサイズ、美しい写真です。 そして、それらはデザインの概念において、より広く、より深い意味を持ちます。

上記の説明では、サービスと感情的要素の比率がよく反映されています。 理想的なデザインとは、一方ではデザインが好きであり、他方では誰もがそれがどのように機能するかを知っていることです。 それがまさにデザインの美しさです。

Virgin Americaの新しいウェブサイトをご覧ください。 メインページで何らかの感情的なメッセージを完全に放棄した人々。



これは、私たちが持っている驚くほど美しいスチュワーデス、空を舞う美しい飛行機など、誰にもユーザーに告げない最初のサイトです。 これはすべてナンセンスです。 ユーザーはチケットを購入するためにこのサイトにアクセスしますが、他に何も必要ありません。



「デザイン」という言葉の古典的な意味では、デザインはありません。 そのようなレイアウトを見た平均的な顧客は、彼はそれが好きではないと言うでしょう。 ちょっとドライです。 デザインなし。 写真はどこにありますか？ チケット選択プロセスの最後でのみ、ヴァージンアメリカは感情的な要素を使用しました。データを入力するときに、気分アイコンを選択できます。次のユーザーである潜在的な隣人は、気分と顔を見ることができます。 同時に、サイトの残りの部分はサービスタスクのみを解決します。



しかし、比較のために、国内の航空会社のサイト。 ここに、私たちが慣れ親しんだデザインが見えます。









なぜ歴史的に、最初に感情的なデザインがウェブで普及したのですか？ インターネットが最初に登場したとき、サイトは非常にシンプルでした。 それらは静的なページのセットであり、何もできませんでした。 アプリケーションフォームの作成でさえ、かなり重要な作業でした。 そのため、ウェブマスターは感情的なデザインを打ちました。 誰もが自分のサイトが外見で誰もが特に驚いたことが重要でした。 その後、オンライン販売用のサイトが登場し始め、検索エンジンが登場し、引き渡しが登場しました。 より快適なフォームが表示され始めました。 そして最終的に、私たちはグローバルなオンラインサービスになりました。

彼らにとって、デザインの感情は、これらのサービスがどのように機能するかとはほとんど関係ありません。 潜在的な顧客が次のように言った場合でも、「Uberのようなアプリケーションが欲しい。 私はこのデザインが好きです」ということは、ほとんどの場合、インターフェイスのグラフィックデザインではなく、このアプリケーションが機能する使いやすさとロジックを意味します。 右側から顧客にアプローチするには、コミュニケーションプロセスを変更し、顧客が要求を策定できるようにする必要があります。 開発者の大多数は、最初はこれに誤ってアプローチしています。「サイトのデザインを変更する必要があるのはなぜですか？」-「道徳的に時代遅れです。」 つまり、サイトのデザインがあまりにも現代的ではないように思えます。 まあ、彼自身が「私たちのサイトは携帯電話ではうまく表示されない」というような言い回しになったら。 これは、顧客が正しい方向で考えるための前提条件です。

別の興味深い例は、ロシアの郵便のウェブサイトです。 以前は次のようでした。



そして、新しいサイトはすでに純粋なサービス原則に従って機能しています。





メインページで、ユーザーは5つの主要なシナリオから選択できます。 さらに、すべてのシナリオは直線的に実装されます。 「小包を送る」シナリオを選択すると、この時点でユーザーが本当に必要なものから気を散らさないことが非常に重要であるため、サイトの水平ナビゲーションも消えます。 また、これはサービス設計の良い例でもあります。

公共サービスの更新されたサイト。 これは、ユーザーがドキュメントを処理し、罰金を支払うか、税金を支払うために入力する場所です。 視覚的なデザインはもはや存在しません。





ユーザーに続く、きれいで真っ白なインターフェースは、ユーザーを巻き込み、時間内にユーザーを促します。 人が2度目にこのサイトを訪れた場合、負債を自動的にチェックするインタラクティブなウィジェットがすでに形成されています。 つまり、ユーザーはこれらのスクリプトを何度も繰り返す必要はありません。これを1回行うと、次に必要なすべての通知とメッセージをすぐに受信します。

ウェブデザイン

ウェブデザインのパラダイムシフト、カラフルな風景から論理と仕事の原則に焦点を当てることへの移行は、戦略家、アナリスト、デザイナーという新しい予期しない職業の出現をもたらしました。 ビジュアルデザイナーは、グラフィック表示（色、スタイルの特定のライブラリなど）を担当します。

技術とプラットフォームの絶え間ない変化は、多くの問題につながります。 昨日は携帯電話がありましたが、今日は時計があり、明日はある種の神経インターフェースかもしれません。 インターフェイスの美しさがなくなると、誰もがゼロUIを待っています。 これはすべて、Webサイト作成ワークフローに常に変化をもたらします。 また、変換設計の外観は、技術、分析データシステムの開発によるものです。

設計効率は以前どのように決定されましたか？ 顧客がそれを受け入れたことは重要であり、彼がそれを気に入ったかどうかは関係ありません。 まれに、彼らはいくつかの世論調査とテストを行い、親relativeや友人に尋ねました。 「かっこいい、ある種のチップが欠けている。」 その結果、私たちは長い間、フォント、ボタンなどで遊んでいました。

そして今、それは次のように見えるかもしれません：

Var。 A：CTA 4.75％Retention 3w >>>勝利<<<
Var。 B：CTA 4.35％保持3週間

機能性に新機能を導入し、新製品を開発するとき、この考えは必ずしも顧客から得られるとは限りません。 しかし、あなたにとって、開発者として、製品の責任者であり、製品の開発を望んでいる人にとって、主な品質基準はある種の変換要素、アクション後の特定の時間間隔でのユーザーのリターン係数です このような指標は、まずユーザーのビジネスへの関与を評価し、次に製品自体の品質を評価するのに役立ちます。 そして、これはフォントやボタンに関する話よりもはるかに重要です。

デザインは大きく前進し、新しい品質基準が現れました。 製品への忠誠心、そしておそらく、インターフェースの品質、2回目の購入時のコンバージョン、3回目など、ユーザーが特定のアクションを実行する頻度、これらのアクションを実行するシナリオ、コホート分析などを評価します。

ユーザーはどれくらいの頻度で戻ってきますか？ そして、平均して、彼はあなたのサービスにどれくらい時間を費やしていますか？ たとえば、Facebook Messengerの統計によると、ユーザーはほとんどの場合、アプリケーションに5人の友人を追加し、これらの5人の友人が少なくとも10個のメッセージを送信した後に戻ってきます。 つまり、製品の品質に関する非常に具体的で具体的な基準です。 実際、インターフェースはありません。 食物測定基準のみがあります。 ユニットエコノミクスは、財務面での製品の寿命の説明です。新しいユーザーを引き付けるのにどれくらいの費用がかかるか、古いユーザーを返すのにどれくらいの費用がかかるか、ユーザーの平均チェックのサイズはどれくらいかなどなどです。

データ駆動設計

データ駆動型設計とは、いくつかのデータに基づいて設計を作成することです。 多様なメトリクス、分析ツール、テスト手法を使用すればするほど、設計の有効性を示す証拠が増えます。

昔、Webサイトのデザインは通常、1人のWebデザイナーによって作成されていました。 これは普遍的な男であり、彼はまた場所にタイプセットしました。 それから、デザイナーのような神話上の動物がデザイナーにつながりました。 これは条件付きでデザイナーがインタラクティブな黒と白の正方形の形で何らかのインターフェースを開発するのを助ける人です。 時間が経つにつれて、アナリスト、デザイナー、ビジュアルデザイナー、およびインタラクションデザイナーのための場所を作成するサービスデザインが登場しました。 サービス設計者は、戦略と概念に基づいてサービスの開発を決定することを約束します。



このようなグローバルサービスhttps://www.simple.com/があります。これは金融アグリゲーターです。 過去4年間で、サイトデザインを3回変更しました。 ポイントは何ですか？ スタートアップが始まったばかりのとき、彼らは新しいユーザーに最大限の印象を与え、オタクを惹きつけ、目を見張るようなデザインにすることが重要です。 主な安定したオーディエンスが集まったら、ユーザーが製品の品質がすでに十分に高いと感じたら、コンバージョンを促進します。 できるだけ多くの登録が必要です。 そして、サービスの所有者は、登録時の変換を増やす方向にデザインを変更し始めます。このデザインは、多くのアニメーションでそれほど美しくなく、魅力的ではないかもしれません。 新しいデザインは他の問題を解決するはずです。

この段階で、製品とサービスの開発のためのUX戦略の開発の一環として、発売日から今後数年間のサービス設計が決定されます。

サービスデザイナーは、製品、新しいチップの導入、およびそれらのライフサイクルの一部を担当しているため、原則として、製品マネージャーと呼ぶことができます。

サービス設計の開発の簡略化された段階は、次のように表すことができます。



実際、すべては分析から始まり、分析で終わります。 すべての中間段階は、製品について収集したデータを中心に展開します。 明確にするために、私たちの実践からのいくつかのケースの例でそれらを説明します。 それらは非常に単純であり、それらにメガスペシャルはありませんが、私たちにとっては興味深いようです。

平らでボリュームのある

フレンドリーな会社として、iOS、Android、Windows Phoneなどのモバイルプラットフォームの開発について話し合いました。 また、モバイルデバイスと対話するユーザーは、常に何らかのインフラストラクチャに慣れていることに気付きました。 このモバイルアプリケーションまたはそのモバイルアプリケーションを開くと、継承されたテンプレートのフレームワーク内で動作します。 ナビゲーションはどこでも同じですが、UI要素でさえ似ている場合があります。

デスクトップシステムでは、このような統一は見られません。 そして、プラットフォームに応じたインターフェースの変更がユーザーの行動にどのように影響するかを確認することにしました。 これを行うために、小さな個別のテストが実施されました。

バージョン10までのWindowsユーザー向けに、フラットボタンとボリュームボタンの2つのインターフェイスのオプションを示しました。 その結果、体積（凸）ボタンを使用し、一般にそのパターンがOSのデザインに似たデザインのユーザーの間で、コンバージョン（製品注文）が10％増加しました。

商品ショーケース

多くの場合、すべての製品チップまたは製品マトリックス全体を、できるだけ多くのオファーを一度に表示したいと考えています。 非常に美しいインタラクティブなショーケースを作成できます。 すべての製品は非常に美しく配置されます。 しかし、実際には、ユーザーは必ずしもこれを必要としません。 多くの開発者は、問題を完全に理解しているユーザーがページにアクセスし、必要なアクションを正しい順序で実行するという事実に基づいて設計を作成します。

たとえば、新しいインターネットサービスプロバイダーに接続する場合、アドレスを確認し、料金を選択して次に進みます。 現実には、すべてが間違っていることが判明しました。 ユーザーは住所の確認を無視し、すぐに関税を選択し、最後に到達して「住所を選択してください」というメッセージを受け取りました。 これは彼らをやや落胆させ、最初の点を無視したので、彼らはリソースを残しました。 次に、ユーザーに最初に住所を確認させ、その後で関税を選択することを決定しました。 顧客は非常に長い間抵抗していました。 このような美しいショーケースを閉じますか？ 素晴らしい料金があります！」 私たちは彼に私たちの提案に従うよう説得し、常に便利ではないにしても、特定のオブジェクトの選択と集中の制限が特定の製品指標を増やすことが判明しました。 コンバージョンが20％増加しました。

進捗インジケータ

UXキットを開いたり、ページのデザインやフォームに関する推奨事項が記載された西洋のブログを読んだりすると、どこにでも書かれます。 ユーザーにポイントAからポイントBに移動し、中間ステップについて話すように指示します。 どこでも、ユーザーがどこに向かっているかを見ることが重要であると書かれています。

ただし、これは1つの重要な側面を考慮していません。たとえば、いくつかのステップでアンケートを行う場合、もちろん、次のページに記入する必要があるものをユーザーに伝えます。 しかし、あなたはそれが彼にかかる時間を言うことはありません。 あなたはどういうわけか彼に完全に通知しないことがわかります。 そのため、ユーザーはどのくらいの時間を費やすか分からないため、それについても考えません。 現在、進行状況インジケーターが残りのステップ数を示すだけでなく、それがどれだけ時間がかかるかを予測するアプローチをテストしています。

ちなみに、進捗インジケータの普及のもう1つの理由は、その美的魅力です。 ストリップが走っているとき、またはそこに何かが注がれているとき、それは美しいです。 これは、デザインの感情的な要素の現れの1つです。

製品消費ファネル

顧客の1人のために、消費ファネルを開発しました。 これは車の評価サービスです。 あなたはあなたの車のパラメーターを運転します、そして、システムは車がいくらの費用をかけることができるかを言います。 その後、オークションに出品し、実際の参加なしで販売されます。 とても快適です。

彼らはユーザーと議論し始めました。 彼らはすぐに、「評価と連絡先」に大きな問題があると判断しました。なぜなら、この段階のユーザーは最初に費用の見積もりを受け取るからです。 したがって、クライアントはこれまで、問題は価格にあると考えていました。 小規模なA / Bテストを実施しました。1）評価後、自動車のコストが表示され、2）コストが表示されませんでした。 ユーザーに一定のコストが提供されたとき、コンバージョンは増加しましたが、私たちが望むほど劇的ではありませんでした。 つまり、この項目は無視できます。



その後、少し調査を行ったところ、「評価と連絡先」の段階で、ユーザーは価格を受け取るだけでなく、「オークション」という言葉に初めて出会うことがわかりました。 つまり、ここでしか、彼はステップの後、車が何らかのオークションにかけられることを理解していません。 その結果、問題は最初のセッションの作成にありました。 ユーザーは、サービスがどのように機能し、何が起こるかを単に理解していませんでした。 これらの研究を実施していなかったら、無駄な時間を無駄にしていたでしょう。

対象読者

別の有益なストーリーが前述のサービスに関連していました。 クライアントは、ターゲットオーディエンスが1万ドルよりも安い十分な予算の車の所有者であることに基づいて、すべての広告活動を実行しました。 しかし、1万5千ドル以上の高級車の所有者の方がはるかに良い買い物をしていることがわかりました。 つまり、サービスの消費者は、顧客が向けられているまったく異なる視聴者の代表者でした。 この情報は30分で取得できますが、Googleアナリティクスを掘り下げたり、CRMシステムのデータを分析したりしました。

直線性の習慣

そして最後の例、再び消費の漏斗。



しかし、漏斗の問題は何ですか？ 開発者はGoogleアナリティクスにアクセスし、目標到達プロセスを構築し、「製品」から「フォーム」、「ありがとう」に至る過程で大きな損失があることに気付きます。 彼は考えます：「何かが間違っています。 おそらく、製品に何らかのトラブルがあります。」 しかし、実際に何が起こっているのでしょうか？ ユーザーが銀行から融資を受けたいとします。 彼は最初にサイトにアクセスします。 そのような、そのような金利。 そんなに私は過払いします。 他の条件を見に行きます。」 そして葉。

このシナリオにはインターフェースの問題はありません。 そして、開発者はこれに気づかずに、いくつかの神話上の問題を修正するために急ぐかもしれません。

これは、コホートとして機能する漏斗です。 つまり、時間の経過とともにユーザーが特定のページに戻る頻度を確認できます。 ユーザーは最初にログインしてから、1、2、3週間後に戻ってきました。 また、図からわかるように、ユーザーはゼロ週間よりもはるかに積極的に行動を開始するのは3週間目です。

これは、彼らが「成熟」するのに時間が必要であることを示唆しています。 そして、この非常に有用なデータを中心に、「1C-Bitrix」を通じてパーソナライズされたモデルを構築し、トリガーメーリングを起動する、つまりユーザーと個人的に対話することができます。 そして、線形プロセス、つまりここと現在で起こっていることだけを見ると、常に大きな間違いを犯す可能性があります。