ライブ タイルとトースト通知を使用したユーザーとの関係構築 (Windows 10 by 10)


※本ブログは Building Apps for Windows “Engaging customers with Live Tiles and toast notifications (10 by 10)” の抄訳です。

前回は Windows 10 ユーザーによる 注目度を上げてインストール頻度を増やす (Windows 10 by 10) について解説しました。今回は、Windows アプリで広く愛用されている機能であるライブタイルとトースト通知を利用して、ユーザーとの関係を促進する方法について解説します。

Windows アプリの開発経験がある場合は、おそらくライブ タイルとトースト通知についてよくご存じでしょう。Windows アプリの開発経験がなくても、Windows 10 のユーザー数の増加がライブ タイルとトースト通知の実装を始める十分な動機付けになることは間違いありません。新機能は次のとおりです。

  • ユニバーサル アクション センター: 受信したトースト通知は、アクション センターと呼ばれるシステム領域に移動されるようになりました。Windows 10 では、以前から利用可能だったスマートフォンはもちろん、Windows デスクトップ、Windows ノート PC、およびタブレットでもアクション センターが利用できるようになりました。つまり、ユーザーは、最初のトースト通知の表示時間が短くて見逃した可能性のある通知をあらためて確認でき、新しい方法で通知を操作できます。
    1_win10FullDesktop
    2_win10mobileNotificationCenter
  • 適応型および対話型トースト通知: 各 Windows デバイスのトースト通知に対話型 UI を表示できるようになりました。そのため、ユーザーはすぐ入力して通知に対応できます。つまり、ユーザーを現在のコンテキストから移動させることなく、入力をキャプチャして、アプリ コードも実行できます。トースト通知は、テキスト以外に画像で装飾することも可能です。
  • 適応型ライブ タイル テンプレート: 単純なマークアップ言語を使用してライブ タイルのコンテンツが記述できるようになりました。その結果、ライブタイルでコンテンツを表示する方法について完全な柔軟性が提供されています。適応型ライブ タイルは、画面密度が異なるデバイスにも適応するため、どのデバイスでもライブタイルが適切に表示されることが保証されます
    3_breakdown
  • 改良したセカンダリ タイルのピン留め動作: セカンダリタイルをピン留めするリクエストが、ユーザーやシステムによる操作なしで完了するようになりました。そのため、タイルがピン留めされたらすぐに追加コードを実行できます。この仕様により、一度に複数のタイルをピン留めし、ピン留めした直後にタイル通知をタイルに送ることも可能になりました。
    4_AdvancedTile
  • ライブ タイルとトースト通知の同期 – ToastNotificationHistoryChangedTrigger という名前の新しい種類のバックグラウンド タスク トリガーを利用することで、アプリの通知コレクションがアプリ以外によって変更されたときにバックグラウンド タスクをトリガーできるようになりました。つまり、アクション センターでユーザーが通知を無視したとき、通知が期限切れになったとき、または新しい通知が Windows プッシュ通知サービス (WNS) を通じてプッシュされたときにコードを実行できるということです。この機能を利用すれば、ライブ タイルを簡単に最新の状態に保つことができます。
  • バッジの統一: 最後に大切なこととして、ライブ タイルのバッジがすべてのデバイスで統一されるようになりました。そのため、以前は Windows でしか利用できなかったグリフが Windows 10 Mobile を実行するデバイスでも利用できます。バッジが統一されることで、どのデバイスでもライブタイルが同じように表示されることも保証されます。

では、新しい通知とライブ タイルを使用してユーザーとの関係を構築する方法を確認し、開発するアプリが適切な用途で確実に使用されるようにしましょう。

順応型および対話型トースト通知の配信

Windows 10 では、トースト通知をカスタマイズして、テキスト、画像、およびカスタム操作を表示することができます。以前、トースト通知を配信するには、トースト テンプレート カタログから選択する必要がありました。このカタログで提供されるトースト通知では外観に関する柔軟性が限られており、ユーザーの入力を受け付けるオプションはありませんでした。Windows 10 では、通知が表示されるときに流れる音も簡単にカスタマイズできます。トースト通知の例を以下に示します。

<toast>
  <visual>
    <binding template="ToastGeneric">
      <text>Sample</text>
      <text>This is a simple toast notification example</text>
      <image placement="AppLogoOverride" src="oneAlarm.png" />
    </binding>
  </visual>
  <actions>
    <action content="check" arguments="check" imageUri="check.png" />
    <action content="cancel" arguments="cancel" />
  </actions>
  <audio src="ms-winsoundevent:Notification.Reminder"/>
</toast>

5_breakdownOfToast

既に述べたとおり、これらの対話型の要素を使用することで、アプリのバックグラウンドタスクを通じてコードを実行できます。つまり、ユーザーは現在の画面から移動することなく、あなたのアプリを操作できます。まず Package.appxmanifest で、新しいプッシュ通知の種類を使用して、新しいバックグラウンド タスクを宣言します。

6_visualStudio

バックグラウンド タスク自体においては、以下のように定義済みの引数とユーザー入力が使用できようになりました。

namespace Tasks
{
    public sealed class ToastHandlerTask : IBackgroundTask
    {
        public void Run(IBackgroundTaskInstance taskInstance)
        {
            // 事前に定義した引数とユーザー入力を
            // ここで取得して使用します。
            var details = taskInstance.TriggerDetails as NotificationActionTriggerDetails;
            var arguments = details.Arguments;
            var input = details.Input.Lookup("1");
            // ...
        }
    }
}

適応型および対話型トースト通知の詳細については、こちらの詳しいブログ記事 (英語) をご覧ください。

適応型ライブ タイルの実装

トースト通知と同様に、Windows 10 のライブ タイルにもマークアップ言語を使用してタイルを視覚化できる柔軟性が備わりました。以前のバージョンの Windows では、タイルを視覚化するにはタイル テンプレート カタログからタイル テンプレートを選択する必要がありました。Windows 10 のライブ タイルの適応性により、コンテンツをグループ化することが可能になり、Windows はライブ タイルに表示する情報量を使用中のデバイスの画面に自動的に合わせることができます。

たとえば、ライブ タイルに電子メールを表示するアプリの場合、画面が小さなスマートフォンでは電子メール メッセージのプレビューは 1 つしか表示できませんが、画面が大きなスマートフォンでは電子メール メッセージのプレビューを 2 つ表示できます。そのために必要な処理は、次のようにタイル マークアップで電子メールをグループ分けするだけです。

...
<binding template="TileWide" branding="nameAndLogo">
  <group>
    <subgroup>
      <text hint-style="subtitle">Jennifer Parker</text>
      <text hint-style="captionSubtle">Photos from our trip</text>
      <text hint-style="captionSubtle">Check out these awesome photos I took while in New Zealand!</text>
    </subgroup>
  </group>
 
  <text />
 
  <group>
    <subgroup>
      <text hint-style="subtitle">Steve Bosniak</text>
      <text hint-style="captionSubtle">Build 2015 Dinner</text>
      <text hint-style="captionSubtle">Want to go out for dinner after Build tonight?</text>
    </subgroup>
  </group>
</binding>
...
デスクトップ タブレット 高画面密度のモバイル
7_desktopTile 8_TabletTIle 9_phoneTile

上記の例からわかるとおり、ライブ タイルはマークアップ言語を使用してすべてを定義することが可能になりました。(XAML から) 画像を生成し、それをライブ タイルに送信して表示するという以前に必要だったパターンと決別しています。たとえば、画像を円形にトリミングして、2 つの大きなテキストラベルをその画像の下に表示するライブ タイルが必要な場合は、次のように簡単に定義できます。

...
<binding template="TileLarge" hint-textStacking="center">
  <group>
    <subgroup hint-weight="1"/>
    <subgroup hint-weight="2">
      <image src="Assets/Apps/Hipstame/hipster.jpg" hint-crop="circle"/>
    </subgroup>
    <subgroup hint-weight="1"/>
  </group>
 
  <text hint-style="title" hint-align="center">Hi,</text>
  <text hint-style="subtitleSubtle" hint-align="center">MasterHip</text>
</binding>
...

10_mattHidinger

適応型ライブ タイルと新しいマークアップ言語の詳細については、こちらの詳細なブログ記事 (英語) をご覧ください。

今週はユーザーを楽しませることを目的にアプリのライブ タイルに時間を使いましょう

開発者の皆さんとユーザーとの関係構築を後押しするためにマイクロソフトが Windows 10 のライブ タイルと通知に対して行った一部の改良について、簡潔ながらも包括的な情報を提供できていればさいわいです。今週のアドバイスは次のとおりです。

  1. 新しいライブ タイル マークアップ言語をアプリで使用して、ユーザーを楽しませるために、美しいライブ タイルを作成する方法を考えましょう。
  2. グループ化できる情報をライブ タイルに表示する場合は、必ず適応型ライブ タイルを活用して、画面密度が高いデバイスを使用するユーザーのニーズに応えましょう。
  3. 新しい対話型トースト通知機能を活用して現在の通知を拡張し、追加情報を提供しながら、ユーザーによる操作をサポートしましょう。

ぜひ DVLUP にアクセスして「It’s ALIVE!!!!!!」(英語) の課題を確認してください。そうすれば、ユーザーとの関係を促進するだけではなく、アプリの更新に対してポイントと XP が獲得できます。また、Windows 10 by 10 開発シリーズのスケジュールで、このシリーズで取り上げる 10 個のトピックもご確認ください。

最後に、以下に今週のトピックをさらに詳しく知るための追加リソースを紹介します。皆さんが開発するアプリについての情報をお待ちしております。@WindowsDev 宛てに ハッシュタグ #Win10x10 を付けて英語でお送りください。

Comments (0)

Skip to main content