2013/12/21(土)に行われた[Apps for Office サミット！]の資料です。 @kinuasa

1. Office 用アプリでできること
― 非開発者のためのOffice 用アプリ概要紹介
Microsoft MVP(Office System)
@kinuasa

2. 注意事項
今日お話しする内容は・・・
時点の内容です。
にしています。SharePoint 用アプリは対象にし
ていません。

3. 本日の内容
1.
2.
3.
4.
5.
6.
7.
8.
Office 用アプリってなに？
Office 用アプリの仕組み・構成
Office 用アプリでできること
Office 用アプリの良いところ
Word向けアプリでできること
アプリ紹介
本日のまとめ
参考資料

4. 1.Office 用アプリってなに？

5. … まずはデモ

6. WordやExcelといったOfficeドキュメント上、
Outlook上で動作するまったく新しい形のアドイン
(のようなもの)

7. 作業ウィンドウ アプリ
http://technet.microsoft.com/ja-jp/library/jj219429.aspx より

8. コンテンツ アプリ
http://technet.microsoft.com/ja-jp/library/jj219429.aspx より

9. メール アプリ
http://technet.microsoft.com/ja-jp/library/jj219429.aspx より

10. Office 用アプリの種類
作業ウィンドウ アプリ
コンテンツ アプリ
メール アプリ
種類
Word
作業ウィンドウ アプリ
○
コンテンツ アプリ
メール アプリ
Excel ,
Outlook ,
Project
PowerPoint Outlook Web App Professional
Excel Web App
○
○
○
○
○

11. 2. Office 用アプリの仕組み・構成

12. HTML + JavaScript
JavaScript API for Office ライブラリを通して
ドキュメントの読み書き等を行う。
JavaScript

13. ３
実行
Office 用アプリ
１
読込
２
Office 製品
(Word,Excel,…)
取得
マニフェストファイル
(XML)
アプリ本体
(Webページ)
カタログ サーバー
Web サーバー
(IIS, Apache,…)
(Office ストア,共有フォルダ,
SharePoint)

14. アプリの情報が書かれている
マニフェストファイル(XML)
＋
アプリの実体となる
＝
Webページ
Office 用アプリ

15. (例)マニフェストファイル
アプリの種類
対象アプリケーション
実体となるWebページの場所

16. (例)Webページ

17. 3. Office 用アプリでできること

18. Office 用アプリで・・・
ファイルを開いて操作する。
アプリケーションを開始・終了する。
基本的にできません。
コマンドバーやリボンの機能を呼び出す。
できると思いますか？

19. じゃあ今度は・・・
赤い色の文字列を挿入する。
大きいフォントサイズの文字列を挿入する。
一部のアプリを除いてできません。
選択文字列を装飾する。
できると思いますか？

20. ・・・なら何ができるの？
基本的に
です。
（・・・現時点では）

21. じゃあ、どうしたら良いの？
1. 最初にドキュメントを装飾しておく。
2. そのドキュメントにOffice 用アプリを挿入す
る。
3. Office 用アプリを挿入した状態のファイルを
配布する。
例）Movie list app
http://office.microsoft.com/enus/templates/movie-list-app-TC104005416.aspx

22. 4. Office 用アプリの良いところ

23. 1. Web標準技術である。
2. マルチプラットフォーム。
3. 更新・配布が楽。
4. Office上で動く。
5. ストア公開で海外で勝負できる！

24. 5. Word向けアプリでできること

25. Office 用アプリでできること

26. データを書き込むメソッドの説明
http://msdn.microsoft.com/ja-jp/library/fp142145.aspx より

27. Office.context.document.setSelectedDataAsync(
"
",
{coercionType:"
"}
);

28. var xmlCode = $('#xmlcode').val();
Office.context.document.setSelectedDataAsync(
xmlCode,
{coercionType:"
"}
);
<textarea id="xmlcode" style="display:none;”>
</textarea>

29. 6. アプリ紹介

30. IMG Effector
http://office.Microsoft.com/ja-jp/store/WA104070070.aspx

32. 1. getSelectedDataAsyncメソッド(OOXML)で画像取得。
2. Base64エンコードされた画像をdata URI schemeで
アプリ上に表示。
3. CamanJSライブラリーで画像にエフェクトをかける。
4. setSelectedDataAsyncメソッド(OOXML)で画像を
Officeドキュメントに書き込み。

35. 7. 本日のまとめ

36. 1. Office 用アプリの
2. できることは基本的に
3. 文字の装飾等を行いたい場合は、
4. Word向けアプリの場合は、
できる

37. Office 用アプリで出来ることは限られている。
でも、工夫次第でいろいろ出来る。

38. 8. 参考資料

39. Office 用アプリによるソリューションの開発と展開
(XPS/PDF/Word)
http://technet.microsoft.com/ja-jp/office/jj149945
※ これ1つでOffice 用アプリの概要 ～ 開発方法まで一通り把握できる。

40. JavaScript API for Office (wall poster)
http://www.microsoft.com/enus/download/details.aspx?id=36850
※ JavaScript API for Officeのオブジェクト、メソッド、プロパティ、イベントが一
目でわかる。

41. 公式フォーラム（英語）
http://social.msdn.microsoft.com/Forums/offi
ce/en-US/home?forum=appsforoffice

42. マイクロソフト Office 用アプリ開発スタートアップガイド
※ 専用の開発ツール「Napa」の使い方を中心に解説。

43. Excel 2013 VBA and Macros
Beginning SharePoint 2013 Development

44. http://www.ka-net.org/blog/
※ Office用アプリ以外にもリボンのカスタマイズ等、
IT Pro向けのOffice開発情報を中心に取り扱っています。