Windows開発最前線

Windows開発最前線

UWPアプリとは? ― 全(=ユニバーサル)Windowsプラットフォーム向けアプリの開発

2016年4月6日 改訂 (初版:2016/02/19)

Build 2016を受けて改訂。最新のWindows開発について概説。開発者向けにWindows 10向けUWPアプリの概要と特徴をできるだけ分かりやすくコンパクトにまとめる。

BluewaterSoft/Microsoft MVP for Windows Development 山本 康彦
  • このエントリーをはてなブックマークに追加

UWPアプリとは?

 UWPアプリとは、ユニバーサルWindowsプラットフォーム(UWP)で動くアプリのことだ(図1)。

図1 UWPアプリの例(左:デスクトップ、右:スマートフォン)

Windows 10に標準の「ニュース」アプリである。さまざまなデバイスで動作し、マウスでもタッチでも操作できる。デスクトップ(左)では従来のアプリと同じようにウィンドウ表示になり、タブレットやスマートフォン(右)では全画面表示となる。

 では、UWPとは何かというと、マイクロソフトの新しいOSだと思ってほしい。開発者視点では、そう考えておくとスッキリ分かるのだ。

 UWPとはWindows 10のコアであり、そこにデバイスごとの機能を追加したものが、デバイスに応じたWindows 10の各製品だと考えられる。例えば、デスクトップPC用のWindows 10は、「UWPに、従来のデスクトップ用Windowsの機能を付加したもの」だと考えるのである。主客転倒のように思えるが、次の表を見てほしい。Windows 10を特徴づける要素、つまり、「何があればWindows 10と呼べるか?」という特徴的な部分はUWPなのである。

デバイスファミリー Desktop Mobile IoT Xbox Team Holographic
製品形態 デスクトップPC/ノートPC/タブレットPC スマートフォン/タブレット 組み込み Xbox One Surface Hub HoloLens
UWP搭載
(●はUWPのみ)
付加機能 従来のWindowsデスクトップ Windows Phone 8.x用アプリ Xboxゲーム
表1 UWPはWindows 10のコア

最上段の「デバイスファミリー」とは、Windows 10のエディションの分類である。例えば、「Desktop」ファミリーにはHome/Pro/Enterprise/Educationといった複数のエディションが含まれる。
UWPにデバイスファミリー特有の機能を追加したものが、Windows 10だといえる。Windows 10全体から見ると、従来のデスクトップ用Windowsの機能はごく狭い範囲のものなのだ。
ただし、例えばDesktopファミリーのWindows 10は、実際にはWindows 8.xを進化させたOSの上にUWPを載せた構成になっている。UWPを新しいOSだと捉えるのは、あくまでも便宜的な話である。

 UWPアプリとは、新しいOS用のアプリである。そう認識していただければ、その開発も従来のデスクトップ用のアプリとは大きく異なるところがあると想像していただけるだろう。本稿では、その全体像を簡潔に紹介していく。

Metroアプリ/ストアアプリ/UWPアプリ…、ええと、何が何だか!?

 UWPアプリは、MetroスタイルアプリとWindows Phoneアプリの系譜を引くものだ。その進化に伴って、呼び名も変化してきた。また、二つの系譜が徐々に統合されたこともあって、いわば「何が何だか分からない」状況になっている。

 その変遷をまとめると、おおむね次の表のような経過をたどってきた。厳密な話をしたいときには、どのバージョンのWindowsで動くものなのかを明確にした方がよいだろう。

OSのバージョン Desktopファミリー Mobileファミリー 備考
7.x (なし) 「Windows Phone アプリ」、「Windows Phone Silverlightアプリ」 Silverlightベース。
そのUIは「Metroデザイン」と呼ばれた
8.0 「Metroスタイルアプリ」(開発時)

「Windowsストアアプリ」(正式リリース時に改名)
「Windowsストアアプリ」、「Windows Phoneストアアプリ」 Desktopでは、Windowsランタイムベース。
Mobileでは、従来のSilverlightベースと、Windows Phoneランタイムが併存
8.1 「Windowsストアアプリ」 (同上) WindowsランタイムとWindows Phoneランタイムの互換性が向上
「ユニバーサルWindowsアプリ」 Windowsストア上で、両方のアプリを一つのアプリに見せる仕組み
10 「ユニバーサルWindowsプラットフォームアプリ」(UWPアプリ) WindowsランタイムとWindows Phoneランタイムの統一
表2 UWP系アプリの呼称の変遷

表中に出てくる「Windowsランタイム」と「Windows Phoneランタイム」が、UWPの「先祖」である。この二つを統合し、さらに大幅に拡張したものがUWPだ。
なお、このほか8.x時代には、Silverlightベースのアプリと区別する意味で「Windowsランタイムアプリ」/「Windows Phoneランタイムアプリ」という呼び方もあった。また、UWPアプリを「ユニバーサルWindowsアプリ(UWA)」と呼ぶこともある(正式リリース前には「Windowsユニバーサルアプリプラットフォーム」という呼称もあった)。あるいは、UWPアプリを「Windowsアプリ」と呼ぶ例すらある。呼称にとらわれることなく、どのプラットフォームで動作するアプリのことなのかを文脈から読み取ってほしい。

 上のような経過でUWPアプリは誕生した。しかしこれで終わりではない。Windows 10は、(Windows 10という名前のままで)継続的にバージョンアップしていく。それに伴い、UWPも進化していくだろう(実際、2015年11月のアップデートではかなりの機能追加があったし、2016年夏に予定されている「Windows 10 Anniversary Update」でも大幅な機能追加が計画されている)。

 また、UWPの進化の形態として、他のプラットフォーム用のアプリを取り込むという方向もある。それがUWPブリッジだ。WebやiOS、あるいは従来のデスクトップ用のアプリなどを、UWPアプリに直接変換したり、UWPへの移植をサポートしたりするものである(後述)。

UWPアプリの見分け方

 UWPアプリとはどんなものか? 実際に自分で使ってみると勉強になる。

 デスクトップでは、UWPアプリも従来のアプリと同様にウィンドウとして表示されるので、どれがUWPアプリなのか分かりにくい。ウィンドウ左上のアイコンを左クリックすると出てくるメニュー(=システムメニュー)で識別できる(図2)。いろいろなUWPアプリを試して、どんなアプリがあるか、どのようにUIを設計しているか、その傾向を確かめてみてほしい。Windows 8.x用のストアアプリとUWPアプリでは、画面のスクロール方向(横方向主体から縦方向主体に変わった)など、UIの設計方針が大きく変化している*1

  • *1 UWPアプリのUI設計方針はMSDNで示されている。MSDN「Windows アプリ UX デザイン ガイドライン」からダウンロードできる「ユニバーサル Windows プラットフォーム ユーザー エクスペリエンス ガイドライン」だ(PDFファイル)。ただし600ページ近いボリュームがある。
図2 デスクトップでのアプリの見分け方(従来のアプリ)
図2 デスクトップでのアプリの見分け方(Windows 8.x用のストアアプリ)
図2 デスクトップでのアプリの見分け方(UWPアプリ)
図2 デスクトップでのアプリの見分け方

上:従来のアプリ。システムメニューに[閉じる]がある
中:Windows 8.x用のストアアプリ。システムメニューが横三本線のアイコンで、そのメニューには[閉じる]がない。また、右側の[-](最小化)ボタンの左に全画面化ボタンがある(赤丸内)
下:UWPアプリ。システムメニューがない

 また、Windowsストアでは、UWPアプリには[Windows 10 用に構築](Built for Windows 10)と表示されている(図3)。

図3 Windowsストア上のUWPアプリの例
図3 Windowsストア上のUWPアプリの例

UWPアプリには[Windows 10用に構築]と表示されている(水色の枠内)。この表記がないものは、Windows 8.1/Windows Phone 8.1(あるいはそれ以前)向けに作られたアプリである。
MobileファミリーでUWPアプリを見分けるにはこの表示が頼りだ。

UWPアプリの気になる特徴

 UWPアプリには、複数デバイスで動くという以外にも多くの特徴がある。その中から開発者視点で気になる特徴を選ぶと、次の3点が挙げられる。

  • セキュア
  • ストア
  • Continuum

 従来のOSと比べたとき、UWPの最大の特徴はセキュアなことだ。セキュリティやユーザーのプライバシーを侵害するようなアプリの作成を、プラットフォームのレベルで非常に難しくしているのだ。UWPアプリは個別のサンドボックス内で実行されるだけでなく、UWPが提供するAPIもセキュリティに配慮したものになっている。例えば、ファイルやプリンターなどのローカルリソースへのアクセスは原則としてエンドユーザーの許可が必要だったり、DBサーバーへ直接アクセスするAPIが提供されていなかったりする。「モバイルファースト、クラウドファースト」の観点から、重要なデータや処理はWebサービス側に配置すればよいという考え方だ。

 UWPアプリは原則としてWindowsストアからインストールするというのも、大きな特徴だ。ストアでの徹底的な自動テストでセキュリティを侵害するアプリが排除されることもあるが、開発者にとってはアプリの配布やマネタイズのインフラを個別に構築/維持する必要がないという大きなメリットがある。また、インストール/アンインストールプログラムを作成しなくてよいのも、開発者にとってうれしいところだ。なお、サイドローディングビジネス向けWindowsストアなど、通常のWindowsストアを介さずにUWPアプリを配布する方法も提供されている。

 Continuumは接続されているデバイスが変更されたとき、OSが自動的にUIを切り替える機能だ。Desktopファミリーでは、キーボードを取り外すと全画面のタッチ対応モードに切り替わる。MobileファミリーのContinuumは、さらに魅力的だ。スマートフォンをつないだモニターにUWPアプリが表示され、まるでデスクトップPCのように使えるのだ(図4)。このようなアプリを作るにはWebのレスポンシブデザインの考え方を取り入れる必要があり、そのためUWPには「アダプティブなトリガー(表示状態トリガー)」などレスポンシブデザインをサポートする仕組みが用意されている。

図4 MobileファミリーのContinuum

Continuum対応のスマートフォンをモニターに接続すると、UWPアプリはモニターに表示され、Bluetoothなどで接続したマウスやキーボードで操作できる。
MobileファミリーのCPUとメモリではデスクトップPCと同等に作業をこなせるとはいかないだろうが、WebブラウジングやOfficeを使うくらいの用途ならば十分だ。出先で行う作業によっては、スマートフォンだけを持って出掛けられるのだ。
この画像は、マイクロソフトの「Continuum」のページより。

【コラム】Mobileファミリーの普及

 Windows 10のMobileファミリーには、コンシューマー向けの「Mobile」/ビジネス用途の「Mobile Enterprise」/組み込み用の「IoT Mobile Enterprise」の3エディションがある。それらをまとめて「Windows 10 Mobile」と呼ぶことが多い。

 日本ではWindows Phone 8.x搭載のスマートフォンは(2015年まで)発売されなかったため、長らく「Windows Phone不在」の時期が続いていた。Windows 10 Mobileの国内販売も危惧されるようなありさまであったが、ふたを開けてみるといくつもの国産メーカーからWindows 10 Mobileデバイスのリリースが相次ぐこととなった。

 2016年初頭では2万円未満の入門機とその上の中級機が日本市場に投入されており、今後は上位機種も登場してくるだろう。Continuumが利用できる中~上級機のラインアップが広がることも期待できそうだ。

 また、Mobileファミリーを搭載したタブレットも、海外では発表されている。こちらも国内販売を期待したい。x86版のDesktopファミリーを搭載したタブレットに比べると、より低価格で消費電力が少ないというだけでなく、ARM版のMobileファミリーならウイルスの心配もしなくてよいからだ。

 日本市場におけるWindows 10 Mobileは、選択できるその価格帯の広さと、他の多くのスマフォや小型タブレットとは一線を画すセキュアさによって、十分な普及が期待できるだろう。

UWPアプリ開発の特徴

 UWPアプリの開発は、従来のWindowsデスクトップ用のアプリ開発と比べてみると、ずいぶん異なる特徴がある。開発へのアプローチ面の特徴と、実際の開発における特徴を分けて述べよう。

多言語、マルチプラットフォーム

 従来のWindowsデスクトップ用のアプリ開発では、開発言語やプラットフォームでそれほど迷うことはなかったはずだ。プラットフォームの選択はWindowsのどのバージョンなのかであっただろうし、言語は.NETならC#かVisual Basic(VB)かの選択だったろう。

 UWPアプリでは、開発に使える言語は主に次のようなものがある。UIの構築法と、主に利用するAPIも併記する。

  • C#Visual Basic: XAML、Windows ランタイムと.NET Frameworkの一部
  • C++: XAMLまたはDirect X、Windows ランタイム/.NET Frameworkの一部/Win32 APIの一部
  • JavaScriptTypeScript: HTMLとCSS、WinJS

 このほかに、iOSからの移植(Windows Bridge for iOS)においてはObjective-Cも利用できる。

 そして、開発ターゲットとなるプラットフォームはUWP(Windows 10)だけでなく、サードパーティとの協力によってクロスプラットフォーム開発にも力が入れられている。主なものを、開発言語と主な対象プラットフォームと共に次に挙げる。

 開発言語も開発ターゲットも、その選択肢は迷うほど用意されている。どのようなUWPアプリを、どのプラットフォーム向けに開発するのか、よく調査して選んでほしい。

実際の開発

 UWPアプリを実際に開発するとき、特に重要だと筆者が考える特徴を三つ紹介しよう。

1. レスポンシブデザイン

 さまざまなデバイスに対応させるには、UIのレスポンシブデザイン(=画面サイズに反応して変化するUI設計)が求められる*2。アプリをさまざまなデバイスに対応させるには、以下のような点を考慮しなければならない。

  • 操作: マウス/タッチ
  • 画面の向き: ランドスケープ(横長)/ポートレイト(縦長)
  • 画面の仮想ピクセルサイズ: 画面内に表示できる情報量に適したUI
  • 画面の実サイズ: サイズに適したタッチ操作のUI

 補足しておくと、画面の実サイズはタッチ操作のしやすさに影響する。片手持ちのスマートフォンでは、メニュー操作などのUIは下端にあると親指で操作しやすい。同じ片手持ちでも、8インチクラスのタブレットになると、親指で操作するのは難しくなり、空いている方の手で上端部のメニューを操作する方が楽になる。20インチを超えるようなテーブルトップ(ほぼ水平に横たえた状態)では上端まで手を伸ばすのはおっくうだし、逆にデスクトップやノートでほぼ垂直に立てたモニターでは下端を触るのが難しい。壁面固定のSurface Hubでは、背の低い人は上端に手が届かないこともあるだろう。とても難しい課題なので、想定する用途を絞って割り切った設計にするのも一案だ。

 レスポンシブデザインのために、次のような機能が提供されている*3

  • 柔軟な配置ができるパネルコントロール
  • 表示状態と状態トリガー
  • カスタマイズされたレイアウト
2. 非同期プログラミング

 アプリの応答性を保つ(=UIをフリーズさせない)ことは重要だ。特にタッチ操作では、マウスやキーボードを操作するときのような物理的なフィードバックがないので、常に画面が応答するような作り方が要求される。すなわち、UIの応答性に影響するほどの時間が掛かる処理には非同期プログラミングが求められるのだ。

 そのため、Windowsランタイムで提供されるAPIには非同期で動作するものが多い。ファイルやネットワークのAPIはほぼ100%が非同期だといっていいだろう。

 そのような非同期APIを利用するためにVisual Studio 2012で導入されたC#/VBの構文がasyncawait*4。また、自前で非同期の処理を実装するには、.NET Framework 4で導入されたタスクベースの非同期パターン(TAP)を使うと簡単だ*5

3. クラウドファースト

 アプリ全体のアーキテクチャとしては、重要な処理やデータはクラウドに置くという「クラウドファースト」の設計が望ましい。その理由の一つはセキュリティだ。多数のクライアント(その利用者のセキュリティに関するスキルもさまざま)を全てガードするより、1台だけのサーバーを守る方が簡単だからだ。

 UWPアプリをクラウドファーストにすべきもう一つの、そして最大の理由は、ローミングである。UWPアプリはさまざまなデバイスで動く。エンドユーザーも複数のデバイスを使うだろう。デバイスを持ち替えたとき、さっきまでやっていた作業やゲームを再開できなければ、きっとエンドユーザーはがっかりしてしまうに違いない。

 ローミングは、ゲームや作業を継続するために必要なデータをクラウドに置く(図5)。少量のデータであれば、UWPがサポートしてくれる*6。多い場合は、独自にWebサービスを立ち上げることになる。

図5 ローミング

アプリは、ゲームや作業の継続に必要なデータをクラウドに保存する。アプリは、起動/再開されたときにクラウドからデータを取得して状態を復元する。

UWPブリッジ

 UWPプリッジ(あるいはWindowsブリッジ)は、既存のアプリからUWPアプリへの移植をサポートするツール群だ。主なものを簡単に紹介しよう。

  • Windows Bridge for iOS(開発コード名:“Project Islandwood”):  iOSアプリ用のXcodeプロジェクトをVisual Studioにインポートする。Visual Studio側でObjective-Cの編集が可能。GitHubで公開されている
  • Windows Bridge for Web アプリ(“Project Westminster”): 「hosted web apps for UWP」ともいう。既存のWebアプリをUWPアプリに変換する(図6)。UWPのAPI(JavaScript版)も利用可能。Windows 10 SDKをインストールしたVisual Studio 2015に標準で組み込まれている
  • Desktop App Converter(“Project Centennial”): 既存のデスクトップ向けアプリをUWP上で動くパッケージに変換し、Windowsストアで配布できるようにする。Desktopファミリーでのみ動作。2016年夏の「Windows 10 Anniversary Update」に含まれるもようだ
  • Silverlight Bridge to UWP: Windows Phone 8.x用のSilverlightアプリのソースコードをUWPアプリ用に変換する。サードパーティのツール
図6 WebページをWindows Bridge for Web アプリで変換して作ったUWPアプリ

既存のWebページを、Windows Bridge for Web アプリで簡単にUWPアプリに変換できる。
この画像のものは普通のWebページをUWPアプリ化しただけのものなのであまり実用性はないだろうが、Webアプリとして完結しているサイトを変換すれば十分実用的なものになる。
UWPアプリ化するメリットは、UWPアプリAPIを利用した機能追加ができることだ。また、Webサイト側を変更すればUWPアプリに反映されるわけで、頻繁にコンテンツをアップデートするアプリではストアへの申請が省けるというメリットもある。

【コラム】Windows Bridge for Web アプリを使ってみよう

 UWPアプリ開発ができるようにセットアップされたVisual Studio 2015には、標準でWindows Bridge for Webアプリの機能が備わっている。

 Webアプリを変換する手順は「Windows Bridge for Hosted Web Apps - Hosted Web Apps」(英語)に掲載されている。簡単に紹介すると、次の手順のようになる。

  1. 変換したいWebページのURLを決める。上の画像の例では、http://www.buildinsider.net/を使った
  2. Visual StudioでUWPアプリのプロジェクトを作る。JavaScriptで空白のアプリを選ぶ
  3. プロジェクトからcssjsWinJSフォルダーとdefault.htmlファイルを削除する。
  4. パッケージマニフェストを開き、[アプリケーション]タブの[スタート ページ]欄を1のURLに変更する
  5. パッケージマニフェストの[コンテンツ URI]タブで、必要なURLへのアクセスを許可する。上の画像の例ではhttp://*.buildinsider.net/というURLを指定した

 以上で完了だ。F5キーを押してデバッグ実行してみよう。

開発情報リソース

 最後に、UWPアプリ開発に有用な情報源を紹介しておこう。まずはマイクロソフトが提供しているものから。

 フォーラムや一般のブログなどは、全て紹介しきれないが次のようなものがある。

 また、筆者も次のような記事を執筆している。

まとめ

 UWPアプリ開発は、従来のデスクトップ向けアプリ開発とはずいぶん異なる。むしろ、スマートフォンやWebのアプリ開発者の方が取り組みやすいかもしれない。

 本稿を参考にして自分に合ったアプローチを見つけてほしい。そして、まずは簡単なUWPアプリを作ってみることだ。

 本稿では述べなかったが、UWPアプリはWindows 10の新機能を存分に利用できる。ライブタイルや通知センターへの表示、あるいはCortana(=Windows 10に標準搭載されているデジタル・パーソナル・アシスタント)との連携といったことも可能だ。さらに、「Windows 10 Anniversary Update」で追加されるWindows Ink APIなどの新機能も、UWPアプリではいち早く利用が可能になる。次のステップとしては、Windows 10の機能を生かしたアプリを考えてみるのもいいだろう。

UWP/最新Windows 10アプリ開発を扱う大規模カンファレンスのご紹介

 5月24日(火)~5月25日(水)、マイクロソフトの最新技術情報(例えば本稿で解説したような内容)を日本語で日本人向けに提供するカンファレンス「de:code」が日本マイクロソフト主催で開催される。このカンファレンスは、米国時間で3月30日~4月1日に開催された「Build 2016」の内容をベースに、さらに日本向けのプラスアルファを含めたものになる。詳しい内容は、リンク先を参照されたい

GrapeCity Garage 記事内容の紹介

Azure Central の記事内容の紹介

Twitterでつぶやこう!


Build Insider賛同企業・団体

Build Insiderは、以下の企業・団体の支援を受けて活動しています(募集概要)。

ゴールドレベル

  • 日本マイクロソフト株式会社
  • グレープシティ株式会社