Top Banner
Mobile Center を使って、 モバイルアプリ開発/運用を いい感じにやろう! ちょまど(千代田まどか)Microsoft # SendaiITFes
46

Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

Jan 21, 2018

Download

Technology

Madoka Chiyoda
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

Mobile Center を使って、モバイルアプリ開発/運用を

いい感じにやろう!

ちょまど(千代田まどか)Microsoft

#SendaiITFes

Page 2: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

#SendaiITFes

(このハッシュタグはスライドの右下に常に表示)

このセッションは:

Page 3: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

ベロッパー

Microsoft

マンガ家

登壇者紹介(千代田まどか)

Page 4: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

私が描いている漫画「はしれ!コード学園」

Page 5: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

Page 6: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

今日話すこと

Page 7: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

アプリ完成がゴールではない

Page 8: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

スマホアプリを作ってみたいなあ。

作ったらストアに公開して皆に使ってもらいたい!

Page 9: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

つまりこういうことがしたい

Page 10: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

マルチプラットフォーム対応

Page 11: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

マルチプラットフォーム対応

Page 12: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

多くの機種で自動UIテスト

Page 13: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

テスターにテストビルド

配布

Page 14: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

各ストアで展開(リリース)

Page 15: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

ユーザの使用状況確認/分析

Page 16: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

ユーザの使用状況確認/分析

Page 17: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

Page 18: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

Page 19: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

Page 20: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

Page 21: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

A/B Testing

Live Update

Push Notifications

Crash Reporting

Remote Config.

実現するには、たくさんのツールが必要!

Page 22: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

Visual Studio Mobile Center

https://mobile.azure.com

Page 23: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

Page 24: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

Page 25: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

Page 26: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

3D Touch

iPhone 6s /7

series only

Apple pencil

iPad Pro only

Multi Tasking

Only select iPads

iPads

iPod

touchiPhones

Form factors iOS 9+ feature

s

Page 27: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes25% 50% 75% 90%Market Share

Nu

mb

er

of D

evic

es

13

45

134

288

0

U.S. Device Market Coverage Data

Page 28: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

自動UIテスト - Mobile Center

Page 29: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

2,000台以上の実機でUIテストが出来る、クラウド上のテスト環境

コード化された UI Test とパッケージを投入すると指定したデバイスに展開してテストを実行して結果を返してくれる!!

自動UIテスト - Mobile Center

Page 30: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

UIinteracts with your app just like your users do

Xamarin.UITest

Page 31: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

Page 32: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

Tap Scroll Swipe Pinch Multi Finger

Text Entry Rotation GPS

Page 33: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

• GitHub に草を生やし続けるための

アラートアプリ「keep.grass」

+ Mobile Center の自動UIテスト

Page 34: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

Page 35: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

Page 36: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

1. アプリ「新規作成」

2. Mobile Center のパッケージ追加

3. 初期化コード

4. Event 送信

Page 37: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

Page 38: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

昨日の深夜、Twitter で

Page 39: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

どんな感じで使ってるか見てみたらわりとガチだった

Page 40: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes

無茶振りした

Page 41: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

Mobile Center を使って、モバイルアプリ開発/運用を

いい感じにやろう!

ちょまど(千代田まどか)Microsoft

#SendaiITFes

Page 42: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

Mobile Center を使って、モバイルアプリ開発/運用を

いい感じにやろう!

ちょまど(千代田まどか)Microsoft

ちゅうこ(山田祐介)Microsoft Student Partners

#SendaiITFes

Page 43: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

Visual Studio Mobile Center

Page 44: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

Lifecycle:

Monitoring:

Mobile Backend:

Page 45: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

mobile.azure.com

Page 46: Microsoft の MBaaS(Mobile Backend as a Service)である「Mobile Center」を使い、モバイルアプリ開発/運用を良い感じにやろう!

#SendaiITFes