Windows開発最前線【2017年版】
UWP（ユニバーサルWindowsプラットフォーム)とは？ UWPアプリ開発の特徴
2017年6月改訂。最新のWindows開発について概説。開発者向けにWindows 10向けUWPアプリの概要と特徴をできるだけ分かりやすくコンパクトにまとめる。
UWPアプリとは？
UWPアプリとは、ユニバーサルWindowsプラットフォーム（UWP）で動くアプリのことだ（図1）。
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ゲーム | ― | ― |
最上段の「デバイスファミリー」とは、Windows 10のエディションの分類である。例えば、「Desktop」ファミリーにはHome／Pro／Enterprise／Educationといった複数のエディションが含まれる。
UWPにデバイスファミリー特有の機能を追加したものが、Windows 10だといえる。Windows 10全体から見ると、従来のデスクトップ用Windowsの機能はごく狭い範囲のものなのだ。
ただし、例えばDesktopファミリーのWindows 10は、実際にはWindows 8.xを進化させたOSの上にUWPを載せた構成になっている。UWPを新しいOSだと捉えるのは、あくまでも便宜的な話である。
UWPアプリとは、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ランタイムの統一 | |
表中に出てくる「Windowsランタイム」と「Windows Phoneランタイム」が、UWPの「先祖」である。この二つを統合し、さらに大幅に拡張したものがUWPだ。
なお、このほか8.x時代には、Silverlightベースのアプリと区別する意味で「Windowsランタイムアプリ」／「Windows Phoneランタイムアプリ」という呼び方もあった。また、UWPアプリを「ユニバーサルWindowsアプリ（UWA）」と呼ぶこともある（正式リリース前には「Windowsユニバーサルアプリプラットフォーム」という呼称もあった）。あるいは、UWPアプリを「Windowsアプリ」と呼ぶ例すらある。呼称にとらわれることなく、どのプラットフォームで動作するアプリのことなのかを文脈から読み取ってほしい。
上のような経過でUWPアプリは誕生した。しかしこれで終わりではない。Windows 10は、（Windows 10という名前のままで）継続的にバージョンアップしていく。それに伴い、UWPも進化していくだろう。実際、Windows 10の主要なアップデートに合わせてUWP用のSDKも10240（1507）／10586（1511）／14393（1607）／15063（1703）とバージョンアップを重ね、機能を強化してきた（数字はWindows 10のビルド番号、かっこ内はそのビルドのリリース年月）。さらに機能だけでなく、2017年春から導入が始まった「Fluent Design System」によってUIのデザインルールも進化していく。
また、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ファイル、Webページ上の表記は「Windows 10 アプリ UX デザイン ガイド」）。600ページ近いボリュームがある力作である。
上：従来のアプリ。システムメニューに［閉じる］がある
中：Windows 8.x用のストアアプリ。システムメニューが横三本線のアイコンで、そのメニューには［閉じる］がない。また、右側の［－］（最小化）ボタンの左に全画面化ボタンがある（赤丸内）
下：UWPアプリ。システムメニューがない
ただし、Windowsデスクトップアプリ（Win32アプリ、Windowsフォーム／WPFのアプリなど）をデスクトップ・ブリッジ（後述）で変換して作ったUWPアプリは、その外観や上記の手順では区別できない。これを区別したい場合には、タスクマネージャーで一覧表の［イメージ パス名］列（実行ファイルが存在するフォルダー）を見ると判断できる（図3）。
［イメージ パス名］列はデフォルトで表示されないので、この例ではタスクマネージャーの［詳細］タブの一覧表のヘッダー部分を右クリックすると表示されるメニューから［イメージ パス名］列を追加して表示していることに注意してほしい。
2つ表示されている「Hidemaru.exe」（秀丸エディタ）のうち、上は通常のデスクトップアプリ版（C:\Program Files\Hidemaruフォルダーにある）、下はUWPアプリ版である（C:\Program Files\WindowsApps配下のフォルダーにある）。
UWPアプリの気になる特徴
UWPアプリには、さまざまなデバイスで動くという以外にも多くの特徴がある。その中から開発者視点で気になる特徴を選ぶと、次の3点が挙げられる。
- セキュア
- ストア
- Continuum
従来のOSと比べたとき、UWPの最大の特徴はセキュアなことだ。セキュリティやユーザーのプライバシーを侵害するようなアプリの作成を、プラットフォームのレベルで非常に難しくしているのだ。UWPアプリは個別のサンドボックス内で実行されるだけでなく、UWPが提供するAPIもセキュリティに配慮したものになっている*2。例えば、ファイルやプリンターなどのローカルリソースへのアクセスは原則としてエンドユーザーの許可が必要だったり、DBサーバーへ直接アクセスするAPIが提供されていなかったりする。「モバイルファースト、クラウドファースト」*3の観点から、重要なデータや処理はWebサービス側に配置すればよいという考え方だ。
- *2 C#／VB／JavaScriptから利用する（UWPが提供している）Windowsランタイムの話である。C++でコーディングすれば、従来からのAPI（Win32 APIなど）にアクセスするコードを書くことは可能だ。ただし、一般のUWPアプリとして利用が認められていないAPIを呼び出していると、ストアの審査の際に自動テストで不合格になる（筆者もそれで不合格になった経験がある）。ストアも含めて「プラットフォーム」なのである（ストアを通さないサイドローディングならば何でもできる）。ストアが認めれば何でもできるというのは、例えば「ストア」アプリを見ると分かるだろう。「ストア」アプリもUWPアプリであるが、アプリのインストールや起動といった一般のUWPアプリには不可能な機能を実装している。デスクトップ・ブリッジは従来APIのほぼ全てを自由に使えるため異質なものに思えるかもしれないが、ストアの審査基準が違うということなのだ。
- *3 「モバイルファースト、クラウドファースト」（Mobile first ＆ Cloud first）は、2016年時点でマイクロソフトが提唱したアプリ開発のコンセプトで、モバイル中心かつクラウド中心に開発を進めることの重要性を示している。2017年の本稿執筆時点ではこのコンセプトがさらに進化して、具体的にはクラウドファーストにAI要素（＝機械学習や人工知能のこと）などが、モバイルファースト要素にエッジ要素（＝OSなどのプラットフォームを限定しないあらゆるエッジデバイスのこと）などが加えられて、「インテリジェントクラウド、インテリジェントエッジ」（Intelligent Cloud ＆ Intelligent Edge）という表現に進化・発展している。よって、本稿でキーワードとして何度か登場する「クラウドファースト」は、最新コンセプトである「インテリジェントクラウド」にも含有されている最重要概念といえる。
UWPアプリは原則としてMicrosoftストアの「Windowsアプリ」カテゴリ（以下、Windowsストア）からインストールするというのも、大きな特徴だ。ストアでの徹底的な自動テストでセキュリティを侵害するアプリが排除されることもあるが、開発者にとってはアプリの配布やマネタイズのインフラを個別に構築／維持する必要がないという大きなメリットがある。また、インストール／アンインストールプログラムを作成しなくてよいのも、開発者にとってうれしいところだ。なお、サイドローディングやビジネス向けMicrosoftストアなど、通常のWindowsストアを介さずにUWPアプリを配布する方法も提供されている。
Continuumは接続されているデバイスが変更されたとき、OSが自動的にUIを切り替える機能だ。Desktopファミリーでは、キーボードを取り外すと全画面のタッチ対応モードに切り替わる。MobileファミリーのContinuumは、さらに魅力的だ。スマートフォンをつないだモニターにUWPアプリが表示され、まるでデスクトップPCのように使えるのだ（図4）。このようなアプリを作るにはWebのレスポンシブデザインの考え方を取り入れる必要があり、そのためUWPには「アダプティブなトリガー（表示状態トリガー）」などレスポンシブデザインをサポートする仕組みが用意されている。
Continuum対応のスマートフォンをモニターに接続すると、UWPアプリはモニターに表示され、Bluetoothなどで接続したマウスやキーボードで操作できる。
MobileファミリーのCPUとメモリではデスクトップPCと同等に作業をこなせるとはいかないだろうが、WebブラウジングやOfficeを使うくらいの用途ならば十分だ。出先で行う作業によっては、スマートフォンだけを持って出掛けられるのだ。
この画像は、マイクロソフトの「Continuum」のページより。
UWPアプリ開発の特徴
UWPアプリの開発は、従来のWindowsデスクトップ用のアプリ開発と比べてみると、ずいぶん異なる特徴がある。開発へのアプローチ面の特徴と、実際の開発における特徴を分けて述べよう。
多言語、マルチプラットフォーム
従来のWindowsデスクトップ用のアプリ開発では、開発言語やプラットフォームでそれほど迷うことはなかったはずだ。プラットフォームの選択はWindowsのどのバージョンなのかであっただろうし、言語は.NETならC#かVisual Basic（VB）かの選択だったろう。
UWPアプリでは、開発に使える言語は主に次のようなものがある。UIの構築法と、主に利用するAPIも併記する。
- C#／Visual Basic： XAML、Windowsランタイムと.NET Core
- C#： XamarinのコンポーネントをXAMLまたはC#で記述、Windows ランタイムと.NET Coreを使う（XamarinではiOS／Androidなどとのクロスプラットフォーム開発ができる）
- C++： XAMLまたはDirect X、Windows ランタイム／.NET Core／Win32 APIの一部
- JavaScript／TypeScript： HTMLとCSS、WinJS
このほかに、iOSからの移植（Windows Bridge for iOS）においてはObjective-Cも利用できる。
そして、開発ターゲットとなるプラットフォームはUWP（Windows 10）だけでなく、サードパーティとの協力によってクロスプラットフォーム開発にも力が入れられている。主なものを、開発言語と主な対象プラットフォームと共に次に挙げる（この他、前述のXamarinもクロスプラットフォーム対応だ）。
- Apache Cordova： JavaScript、Android／iOS／UWP
- Unity： C#、Android／iOS／UWP／Mac／Linux／Xbox／PlayStation（また、HoloLens用3Dアプリも開発できる）
- Visual C++ for Cross-Platform Mobile Development： C++、Android／iOS／UWP
開発言語も開発ターゲットも、その選択肢は迷うほど用意されている。どのようなUWPアプリを、どのプラットフォーム向けに開発するのか、よく調査して選んでほしい。
実際の開発
UWPアプリを実際に開発するとき、特に重要だと筆者が考える特徴を3つ紹介しよう。
1. レスポンシブデザイン
さまざまなデバイスに対応させるには、UIのレスポンシブデザイン（＝画面サイズや解像度に反応して変化するUI設計）が求められる*3。アプリをさまざまなデバイスに対応させるには、以下のような点を考慮しなければならない。
- 操作： マウス／タッチ
- 画面の向き： ランドスケープ（横長）／ポートレイト（縦長）
- 画面の仮想ピクセルサイズ： 画面内に表示できる情報量に適したUI
- 画面の実サイズ： サイズに適したタッチ操作のUI
補足しておくと、画面の実サイズはタッチ操作のしやすさに影響する。片手持ちのスマートフォンでは、メニュー操作などのUIは下端にあると親指で操作しやすい。同じ片手持ちでも、8インチクラスのタブレットになると、親指で操作するのは難しくなり、空いている方の手で上端部のメニューを操作する方が楽になる。20インチを超えるようなテーブルトップ（ほぼ水平に横たえた状態）では上端まで手を伸ばすのはおっくうだし、逆にデスクトップやノートでほぼ垂直に立てたモニターでは下端を触るのが難しい。壁面固定のSurface Hubでは、背の低い人は上端に手が届かないこともあるだろう。とても難しい課題なので、想定する用途を絞って割り切った設計にするのも一案だ。
レスポンシブデザイン*4のために、次のような機能*5が提供されている。
- 柔軟な配置ができるパネルコントロール
- 表示状態と状態トリガー
- カスタマイズされたレイアウト
- *4 UWPアプリのレスポンシブデザインについて、詳しくは次を参照。「Windows デベロッパー センター： UWP アプリ設計の概要」
- *5 レスポンシブデザインのための機能について、詳しくは次を参照。「Windows デベロッパー センター： XAML を使ったページレイアウトの定義」
2. 非同期プログラミング
アプリの応答性を保つ（＝UIをフリーズさせない）ことは重要だ。特にタッチ操作では、マウスやキーボードを操作するときのような物理的なフィードバックがないので、常に画面が応答するような作り方が要求される。すなわち、UIの応答性に影響するほどの時間が掛かる処理には非同期プログラミングが求められるのだ。
そのため、Windowsランタイムで提供されるAPIには非同期で動作するものが多い。ファイルやネットワークのAPIはほぼ100％が非同期だといっていいだろう。
そのような非同期APIを利用するためにVisual Studio 2012で導入されたC#／VBの構文がasync／awaitだ*6。また、自前で非同期の処理を実装するには、.NET Framework 4で導入されたタスクベースの非同期パターン（TAP）を使うと簡単だ*7。
- *6 非同期APIの呼び出し方について、詳しくは次を参照。「Windows デベロッパー センター：非同期プログラミング」
- *7 タスクベースの非同期パターンについて、詳しくは次を参照。「MSDN： Task-based Asynchronous Pattern (TAP)」
3. クラウドファースト
アプリ全体のアーキテクチャとしては、重要な処理やデータはクラウドに置くという「クラウドファースト」（前述の*2を参照）の設計が望ましい。その理由の一つはセキュリティだ。多数のクライアント（その利用者のセキュリティに関するスキルもさまざま）を全てガードするより、1台だけのサーバーを守る方が簡単だからだ。
UWPアプリをクラウドファーストにすべきもう一つの、そして最大の理由は、ローミングである。UWPアプリはさまざまなデバイスで動く。エンドユーザーも複数のデバイスを使うだろう。デバイスを持ち替えたとき、さっきまでやっていた作業やゲームを再開できなければ、きっとエンドユーザーはがっかりしてしまうに違いない。
ローミングは、ゲームや作業を継続するために必要なデータをクラウドに置く（図5）。少量のデータであれば、UWPがサポートしてくれる*8。多い場合は、独自にWebサービスを立ち上げることになる。
アプリは、ゲームや作業の継続に必要なデータをクラウドに保存する。アプリは、起動／再開されたときにクラウドからデータを取得して状態を復元する。
- *8 データのローミングについて、詳しくは次を参照。「Windows デベロッパー センター： 設定と他のアプリ データを保存して取得する ～ ローミング データ」
UWPブリッジ
UWPプリッジ（あるいはWindowsブリッジ）は、既存のアプリからUWPアプリへの移植をサポートするツール群だ。主なものを簡単に紹介しよう。
- Windows Bridge for iOS： iOSアプリ用のXcodeプロジェクトをVisual Studioにインポートする。Visual Studio側でObjective-Cコードの編集が可能。GitHubで公開されている
- Hosted Web Apps： 「ホストされたWebアプリ」ともいう。既存のWebアプリをUWPアプリに変換する（図6）。UWPのAPI（JavaScript版）も利用可能
- デスクトップ・ブリッジ： 既存のデスクトップ向けアプリ（詳細前述）をUWP上で動くパッケージに変換し、Windowsストアで配布できるようにする*9。DesktopファミリーのWindows 10でのみ動作。2016年夏にリリースされた「Windows 10 Anniversary Update」以降で利用できる
- Silverlight Bridge to UWP： Windows Phone 8.x用のSilverlightアプリのソースコードをUWPアプリ用に変換する。サードパーティのツール
- *9 デスクトップ・ブリッジで変換して作ったアプリも、UWP上で動くアプリということで、UWPアプリ扱いになっている。マイクロソフトのエヴァンジェリスト高橋忍氏のブログ記事「Bridge for Desktop についての詳細」を参照。
実際、従来のデスクトップアプリとは、パッケージもインストール方法もインストールされる場所も異なっている。起動方法も異なっているし（実行ファイルはユーザー権限や管理者権限ではアクセスできない＝起動できない）、実行時のレジストリアクセスや一部のファイルアクセスは「システム」によってリダイレクトされる。デスクトップ・ブリッジで変換して作ったアプリを管理する以上のような「システム」も、UWPの一部だというのである。
なお、一般のUWPアプリでも、Windowsストアに出さないのであれば従来のAPIを使えることは脚注*2で述べた。
既存のWebページを、Hosted Web Appsで簡単にUWPアプリに変換できる。
この画像のものは普通のWebページをUWPアプリ化しただけのものなのであまり実用性はないだろうが、Webアプリとして完結しているサイトを変換すれば十分実用的なものになる。
UWPアプリ化するメリットは、UWPアプリAPIを利用した機能追加ができることだ。また、Webサイト側を変更すればUWPアプリに反映されるわけで、頻繁にコンテンツをアップデートするアプリではストアへの申請が省けるというメリットもある。
【コラム】Hosted Web Appsを使ってみよう
UWPアプリ開発ができるようにセットアップされたVisual Studio 2017には、標準でHosted Web Appsの開発機能が備わっている。
Webアプリを変換する手順は「Web アプリケーションをユニバーサル Windows プラットフォーム (UWP) アプリに変換する」に掲載されている。簡単に紹介すると、次の手順のようになる。
- 1 変換したいWebページのURLを決める。上の画像の例では、
https://www.buildinsider.net/を使った - 2 Visual StudioでUWPアプリのプロジェクトを作る。「JavaScript」で「空白のアプリ (ユニバーサル Windows)」を選ぶ
- 3 プロジェクトから
css／jsフォルダーとindex.htmlファイルを削除する - 4 パッケージマニフェストを開き、［アプリケーション］タブの［スタート ページ］欄を1のURLに変更する
- 5 パッケージマニフェストの［コンテンツ URI］タブで、必要なURLへのアクセスを許可する。上の画像の例では
http://*.buildinsider.net/というURI（と、［ルール］＝「含む」、［WinRT アクセス］＝「すべて」）を指定した
以上で完了だ。F5キーを押してデバッグ実行してみよう。
開発情報リソース
最後に、UWPアプリ開発に有用な情報源を紹介しておこう。まずはマイクロソフトが提供しているものから。
- Windows デベロッパー センター： Microsoftの公式ドキュメントのポータル。開発者アカウントの開設方法やアプリをストアへ提出する手順、審査基準（Windowsストアポリシー）なども載っている
- Universal Windows Platform (UWP) app samples： GitHub上で公開されているMicrosoft公式サンプル（英語）
- Building Apps for Windows： Microsoftの公式ブログ。UWPの新機能などは、まずここで紹介されることが多い（英語）
- Channel 9： Microsoftの動画サイト。「//Build」「de:code」などのイベントで発表された情報は、まずここで紹介されることが多い（英語）
フォーラムや一般のブログなどは、全て紹介しきれないが次のようなものがある。
- MSDNフォーラム： 日本語／英語（情報量は英語の方が圧倒的に多い。また英語の方にはマイクロソフト社員からのレスが付くこともある）
- Stack Overflow： 日本語／英語
- 個人のブログ： 眠るシーラカンスと水底のプログラマー／かずきのBlog@hatena／熊小屋日誌／DDLG／しっぽを追いかけて、その他多数（順不同）
また、筆者も主に次のような記事や電子書籍を執筆している。
- ＠IT： Windowsフォーム開発者のためのWindows 10 UWPアプリ開発入門（前編）
- ＠IT： Visual Studio＋Apache Cordovaで始めるiOS／Androidアプリ開発
- ＠IT： WinRT／Metro TIPS
- Windowsストア： UWPアプリ開発101～Windows Forms開発者のためのC#／XAMLによるUWPアプリ開発入門
まとめ
UWPアプリ開発は、従来のデスクトップ向けアプリ開発とはずいぶん異なる。むしろ、スマートフォンやWebのアプリ開発者の方が取り組みやすいかもしれない。
本稿を参考にして自分に合ったアプローチを見つけてほしい。そして、まずは簡単なUWPアプリを作ってみることだ。
本稿では述べなかったが、UWPアプリはWindows 10の機能を存分に利用できる。ライブタイルや通知センターへの表示、あるいはCortana（＝Windows 10に標準搭載されているデジタル・パーソナル・アシスタント）との連携といったことも可能だ。さらに、Windows 10にこれから追加されていく新機能も、UWPアプリではいち早く利用が可能になる。次のステップとしては、Windows 10の機能を生かしたアプリを考えてみるのもいいだろう。
