Ionicを使用している
プロダクト事例集
Ionic Meetup #11 Tokyo
@scrpgil
自己紹介
榊原宏祐 @scrpgil
-
組み込みエンジニアだったがIonic使い始めてWeb系にジョブチェンジ
-
株式会社キネカでエンタメマッチングアプリpatoの開発
- 趣味も仕事もIonicよく使う
今日話すこと
-
Ionicを使ってるプロダクト事例を紹介
-
プロダクトの探し方を紹介
-
Ionic使ってるアプリの特徴を紹介
登壇駆動でIonicの
ケーススタディを
読みたかった
プロダクト開発の
参考になると幸いです
プロダクト事例集
シートにまとめるのは前もやった
Webサイトにしました
プロダクトを分類
海外勢のIonicアプリ
・Ionic v1時代からの見慣れたアプリ
・公式ブログに選定理由とか情報多数
・Untappd
ビールのSNS
・Sworkit
筋トレアプリ
・JustWatch
動画配信サービスの検索
・Pacifica
瞑想アプリ
海外勢のIonicアプリ(new)
・最近Ionic Resourceでよく見る政府系や社内利用アプリ
・Ionic Enterprise Supportのユーザーで事例が手に入りやすい?
・MRAeasy
モーシャリス共和国の納税アプリ
・数十億ドル規模のゲーム会社の
社内向けデバッグアプリ
・他Airbus、NHSなどなど...
日本勢のIonicアプリ
・Ionic Meetupではお馴染みのアプリ多数
・日本のアプリの流行かSNS、メディアアプリが多いかも?
・tipsys
女友達を作るSNS
・TechFeed
テック系ニュースアプリ
・ゲーマガ
ゲームアプリ
個人開発者
・4万ダウンロードのアプリもある。
・Go Ranger
ポケモンGoのサポートアプリ
・ホウビンゴ
ビンゴ型タスク管理アプリ
・イイコトイウネエ
名言シェアアプリ
・アイテマス
日程調整アプリ
アプリじゃない系
・公式サイトとかだけどIonic使ってる
おすすめアプリ紹介
Sworkit
- ワークアウトビデオアプリ
-
MAU250万人
- ダウンロード数10000万/月
とにかくUIが綺麗
マルチプラットフォームで
Ionic4対応済み
実装の参考におすすめ
少数精鋭の開発チーム
・元々はRyan Hanna氏が一人で開発
・現在は全員で6人チーム
・コア開発者は3名
選定理由
- RyanHanna氏がWeb系技術に詳しかったのでCordova使いたい
- 時間とお金を節約したい
- デザインとカスタマイズ性を重視
Ionicを使ってよかったこと
-
1つのコードベースでiOS、Android両方を開発でき、開発期間を半分に短縮できた
- およそ年間20万ドルの短縮になった
Untappd
- ビール共有・発見SNSアプリ
- IonicチームのMike Hartingtonがファン&ユーザー
- バーコードで自分の飲んだビールの記録ができるのが便利
・バーコードでビールの検索&レビュー
・過去飲んだビールのログ
・気に入ったビールを提供している店を検索できる
・似たビールを探せる
かなり実用性高いアプリ
ビール好きにおすすめ
Ionic選定理由
最初Cordovaで開発⇦スパゲッティ化
シンプルなUIであるIonicを採用
特にModalが素晴らしかったらしい
GoRanger
概要
- ポケモンGoのコンパニオンアプリGo RangerをIonicで作成
- 2週間で作っていきなり4万ダウンロード
- 作者はIonicチームの人
- DAUは約9000人(2018年8月時点)
Matt Kremer
リリースまでの2週間
1日目: Firebase Hostingにベータ版(PWA)をデプロイ
Redditにベータ版を投稿
9日目: フィードバックを元に改善&ユーザーテストを実施
13日目: iOS、Androidアプリをリリース
14日目: Redditにアプリを投稿
16日目: 全世界で4万回以上ダウンロード
17日目: ストアの評価は4.9
最初のユーザーの見つけ方
アプリ成功の重要な要素はアクティブなユーザーベースを見つけること。GoRangerを使用したいと思っている他のトレーナーを見つける方法は次の通り
1. アクティブなコミュニティを見つける
2. そのコミュニティの仲間になる
3. コミュニティのフィードバックでベータ版を改善する
4. リリース!
5. 改善を繰り返す
1. アクティブなコミュニティを見つける
ポケモンGoはコミュニティを見つけるのが非常に簡単
Redditにたくさんのコミュニティができている。ポケモンGoは最大のコミュニティであり、約100万人のメンバーがいて、そのうちの5000人以上がいつでもアクティブになっています。
2. そのコミュニティの一員になる
すぐにコミュニティに商品を売り込むのは悪い考え。自分が痛みを感じるならばコミュニティも関係があるはず。
これを行う最も簡単な方法は、自分の問題を解決するアプリケーションを構築することです。
あなたが目標の人口統計の一部であるとき、あなたは痛みにもっと簡単に関連付けることができます。
3. コミュニティと一緒に改善する
自分のアプリのアイデアは素晴らしいと感じられますが、
しかし、できるだけ早くコミュニティに共感を得てもらう必要があります。
そのために、コミュニティに対して質問をしましょう
What do you look up frequently?
私は、ここでコミュニティが感じている問題にGoRangerがうってつけであることを確認できました。
その後、FirebaseでWeb版バージョンを公開して本番リリースまえに痛みの解決策として間違いないことを確認しました。
4. リリース!
なぜIonicか?
迅速に立ち上げ、成功への道を繰り返すなら車輪の再発明に時間を費やすべきではありません。
より早くなりたい場所に移動するためにはすでに経験しているフレームワークを利用するべきです
IonicのUI & UXはGoRangerに必要な物をすべて提供していた。そして、GoRangerのUIは非常に滑らかであるとコメントを得ています。
痛みへの集中が成功の要因
アプリの成功に最も重要な側面はユーザーの痛みを解決すること。
ポケモンGoは1ヶ月に3時間の「コミュニティデー」がまさにそう。私はイベントの存在を知ったらサンダルのままその場所に走らなければいけません(まさに痛み)
GoRangerの最初の機能は、進行中のイベントと予定されているイベントの両方を日付とカウントダウンに変換してリスト化した
仕事はここで終わらない
リリースは最もエキサイティングな体験の一つです。
しかし、実際の仕事は痛みを解決し続けることです。
世界中のポケモントレーナーはより良い体験をまっています。
Keep Solving more pain, better!
Ionicアプリの探し方
Ionic Blog&Resource
- Built with Ionicで検索
- Ionic ResourceのCaseStudyを読む
Slackの #product
Ionic界隈のTwitterアカウント
@ionicframework
Ionic公式
@getcapacitor
Capacitor公式
@stenciljs
StencilJS公式
@maxlynch
IonicのCEO
@rdlabo
IonicJapanUG
フォローするとIonic使ってるプロダクトは大体追える
@ionic_japan
IonicJP公式
Ionicの特徴
Pull To Refresh
指を離さなくても自動的にリフレッシュが走る
・ゲーマガ、Meily、Smatch、Untappd、tipsysなどなど
Alert
- RadioButton付きのAlert(Dialog)はiOS標準で用意されていない
- Androidにはある
- Smatch、Meilyなどなど
Ionicを使ってる
プロダクト増やそう
We're Hiring!
Twitterで @scrpgil でお声かけいただければ!
Ionicを使用している プロダクト事例集
By scrpgil
Ionicを使用している プロダクト事例集
- 1,590