マイマイザー学習モバイルアプリ開発
1 目的
モバイルアプリの開発方法を学ぶためのモバイルアプリを開発します。この基本設計も教材として利用します。
2 用語説明
No | 用語 | 説明 |
01 | モバイルアプリ | Android, iOS上で動作するアプリケーション |
3 基本設計方針
アプリが持つ本来の基本的な機能と教材となる機能をコンテンツとして合わせアプリの機能として設計します。
4 システム概要
4.1 対応OS
Android:11 〜 13
iOS :13 〜15
iPad:15〜17
4.2 画面サイズ
一般的に販売されているサイズ、アスペクト比に対応し、縦横それぞれ操作できるようにします。
4.3 外部連携
1 GitHub
全機能のソースコードをGitHubで参照できます。
5 ユーザーストーリー
5.1 モバイルアプリの作り方を身に付けたい人
5.2 モバイルアプリ開発に携わっている人
6 ユーザーフロー
7 機能概要
7.1 画面遷移図
7.2 画面一覧
7.2.1 オープニング
WebViewで広告用のURLを開きかつそのページからアプリに必要な設定値を取得する。アプリ実行中はそのURLから設定値を更新する。
7.2.2 一覧
教材が一覧で表示されタップしてその詳細に遷移します。
7.2.3 詳細
教材を実行し動作を確認できます。また、そのコードを確認できます。
7.2.4 コード
教材のコードを閲覧するため外部ブラウザを開きます。
7.2.5 メニュー
アプリのその他の設定等の機能を一覧で表示しタップしてその機能に遷移します。
7.2.6 問い合わせ
問い合わせWebページを外部ブラウザーで表示します。
7.2.7 使い方
使い方Webページを外部ブラウザーで表示します。
7.2.8 ライセンス
アプリが使用しているオープンソースライセンスを表示します。
8 機能設計
8.1 オープニング
(1)初期処理
アプリ内に定義した固定のURLをWebViewで開きアプリの設定情報を取得する。
(2)Advertisement
WebView内に広告を表示する。
(3)Next
一覧画面へ遷移する。
8.2 一覧
(1)Advertisement
広告を表示します。
(2)Menu
メニュー画面に遷移します。
(3)Scroll1
縦方向にスクロールします。
項目をタップすると詳細に遷移します。
(4)Title
教材のタイトルを表示します。
(5)Description
教材の説明を表示します。
(6)Scroll2
横方向にスクロールします。
項目をタップすると拡大表示します。
(7)ScreenShot
教材のスクリーンショットをいくつか表示します。
8.3 詳細
(1)Advertisement
広告を表示します。
(2)Learning Content
教材の機能を実行します。
8.4 コード
(1)External Browser
Githubの教材のソースコードを端末のブラウザで開きます。
8.5 メニュー
(1)Advertisement
広告を表示します。
(2)Contact
問い合わせページを端末のブラウザで開きます。
(3)Usage
使い方ページを端末のブラウザで開きます。
(4)License
オープンソースソフトウェアライセンスの画面を開きます。
8.6 問い合わせ
予め用意された問い合わせページを端末のブラウザで開きます。
8.7 使い方
予め用意された使い方ページを端末のブラウザで開きます。
8.8 ライセンス
使用しているオープンソースソフトウェアのライセンスを表示します。
9 非機能設計
1 広告表示
各アプリ内画面にGoogle Adsenseの広告を表示します。
外部ブラウザで表示するページにも予めその広告を表示するようにします。
2 テーマ
各アプリの画面はライトモード、ダークモードに対応します。モードの切り替えは端末の設定に依存します。
3 多言語対応
日本語、英語、スペイン語、フランス語、ドイツ語に対応し端末の設定に依存します。
対応していない言語の端末の時は英語に切り替わります。
目次