自主製作アプリ 導入事例

先日、私が自主製作したアプリの一つである「飽和水蒸気量の教材アプリ」（UWP）を使用したいとのご依頼を頂きました。依頼者様は秋田県外在住の教育学部の大学生で、数週間後に行われる教育実習にて、中学理科の飽和水蒸気量の授業を控えていました。

（参考）
・飽和水蒸気量の教材アプリに関する記事は、こちらをご参照下さい。
・飽和水蒸気量の単元に関する記事は、こちらをご参照下さい。

県外在住のため、現地に訪問することはできない状況でした。そこで、アプリのパッケージファイル一式とインストールマニュアルをメールでお渡しし、依頼者様のWindows10端末にインストールして頂く、という方法を採用しました。インストールが正常に行われなかったときは、そのときのディスプレイの様子を写真で送付して頂き、その状況に応じて適切な操作手順をお伝え致しました。

１０月上旬に教育実習が行われ、その後日に、「生徒の皆さんの反応が非常に良く、理解が進んだ。授業する我々も、マウス１つでアプリを動かすことができたので、スムーズな授業を行うことができた。」とのご報告を頂きました。依頼者様による授業は大好評で、その中でアプリがお役に立てたことは大変嬉しく思います。

今回の件は、自主製作アプリを提供した初の事例となります。この度はアプリをご利用下さり、誠にありがとうございました。依頼者様の今後のご活躍を、心よりお祈り申し上げます。
（※ 依頼者様の許可を得て記事を掲載しております。）

産業には様々な分野があります。
土木や建築の分野は、資材を現地に運び、作業員も現地に移動して工事を行います。食品やアパレルの分野は、これらを作るための場所はある程度自由が利くものの、原材料や製品を運送する際の人手が必要になります。いずれも、製作者と利用者が遠く離れているほど、作業工数や運送コストなどに影響を及ぼします。
小規模なアプリであれば、今回のように、製作者が利用者に一度も立ち会うことなく（さらに言うと自宅から一歩も外に出なくても良い）、運送時の人手がいなくても、アプリを配信することができます。（もちろん、利用者に立ち会う方がより丁寧な説明ができますし、効率的にアプリをインストールできます。）製作者は、パソコン（開発環境）とインターネット環境があれば、場所を問わずアプリの製作や配信を行うことができます。これらは、アプリ特有の大きな特長であり、魅力的な点であると思います。

これからも、依頼者様の心に残るアプリを製作できるように取り組んで参ります。



＜お問い合わせ＞
このブログの管理者へのお問い合わせは、こちらからお願い致します。

タブレットアプリ 飽和水蒸気量の表示 作成

前回の記事で、中学理科に湿度のグラフを用いた問題が登場することを紹介致しました。湿度のグラフの見方を学ぶための教材アプリを作成しましたので、画像や動画で紹介致します。





変化を動的に見ることにより、下記の事柄について分かりやすく学べる効果が期待できます。

・その１
気温が変化すると、その気温での飽和水蒸気量が変わりますが、これに伴い、まだ空気中に含むことができる水蒸気量や、空気中の水蒸気が水滴となって現れる量が変化する様子が分かります。


・その２
湿度が１００％に満たない空気が冷えると、ある気温に達したときに水蒸気が凝結し始めますが、その気温（露点）は空気中に含まれている水蒸気量により決まる様子が分かります。


・その３
湿度を計算する際に、どの値を用いればよいか分かります。


・その４
中学理科では、水溶液についても学習します。100gの水に溶かすことができる溶質（水に溶かす物質のこと。食塩やミョウバンなど。）の最大量は、水温によって異なる性質があります。溶質の量がこの最大量以下ならば全て溶かすことができますが、最大量を超えるとその超過分は溶け残ります。これらの性質は、空気中の水蒸気と凝結した水滴の関係に似ています。性質が似ているということは、水溶液と湿度の単元のうちどちらか一方を理解していれば、他方も同じ理屈で習得できることを、このアプリを通して実感できます。


お湯にミョウバンを溶かし、徐々に冷やしていくと、このようなミョウバンの結晶ができます。学校の自由研究などで作った方もいらっしゃるかと思います。お湯が冷えると、溶けていたミョウバンが結晶となって現れるのは、この性質によるものです。


このアプリは、学習指導する際の補助ツールとして使用する予定です。

飽和水蒸気量 教材アプリの作成へ

上段：スマイルプリキュア！　（左から順に）
キュアビューティ
キュアピース
キュアハッピー
キュアサニー
キュアマーチ
下段：スター☆トゥインクルプリキュア
左：キュアミルキー
右：キュアスター

中学校で履修する理科の第２分野に「湿度」の単元があります。日常生活の中では「湿度８０％」のように空気の湿り具合を表しますが、中学理科では、このパーセントで表される湿度（相対湿度，以下、「湿度」と表記）を学習します。

１．湿度の求め方
湿度は次式で与えられます。


２．飽和水蒸気量（ｇ/ｍ³）とは？
「飽和」という語句の意味を調べると、「含みもつことのできる最大限度に達して、それ以上余地のないこと。」とあります（goo辞書より）。空気中に含むことのできる水蒸気量には限度があり、１ｍ³の空気中に、水蒸気として含むことのできる最大量（空気中の水蒸気が「飽和」状態になる量）のことを「飽和水蒸気量」といいます。
気温が高いほど飽和水蒸気量が多くなること、水蒸気は目に見えないもの（無色透明）で水滴は目に見えるものであることも、この単元の重要なポイントです。
上記の湿度の式を見ると難しいイメージを抱くかもしれませんが、以下のように例えると理解しやすくなると思います。

３．湿度の考え方
飽和水蒸気量（式の分母）を椅子、水蒸気量（式の分子）を椅子に座れた人数に例えることができます。（１つの椅子には１人だけが座れるものとします。）ここでは、人間が７人いるとします。

椅子が１０脚あるとき、７人全員が座ることができ、３つの空席ができます。


このときの湿度は、

のように計算し、７０％となります。「３つの空席」は、この空気中にまだ含むことのできる水蒸気量に相当します。

次に、椅子の数量を７脚に減らしたとします。７人全員が座ることができ、空席はありません。


このときの湿度は、

のように計算し、１００％となります。この「座席が飽和している（空席がない）状態」が飽和水蒸気に相当します。

このように、湿度は「全体」に対する「部分」を求める「割合」と同じ手法で求めることができます。

さらに、椅子の数量を５脚に減らしたとします。５人は座ることができますが、残りの２人は座ることができません。


水蒸気量（７人）が飽和水蒸気量（５脚）を超過した場合は、その超過分（２人）の水蒸気は空気中に含むことができなくなり、水滴となって現れます。コップに冷たい飲み物を注ぎ、その周辺の空気が冷やされる（気温が低下すると飽和水蒸気量が減少する）とコップの外側に水滴が現れる現象は、これによるものです。


水滴は水蒸気とは異なり目に見えるため、「空気中の水蒸気が水滴になった」と認識することができます。この現象のことを「凝結」といいます。

４．教材アプリの作成へ
理科の問題では、このようなグラフを用いた問題が登場します。


問題例としては、「１ｍ³の空気Ａを２０℃まで冷やしたとき、湿度はおよそ何％になるか？」「１ｍ³の空気Ａを１０℃まで冷やしたとき、この空気からおよそ何ｇの水滴が現れるか？」などがあります。気温が変化すると飽和水蒸気量が変わるため、湿度も変わり、凝結が発生する場合もあります。これらが刻々と変化する様子を視覚的に捉えたり、このグラフの見方を学び理解を深められる教材アプリを作成しております。作成したものは、このブログに掲載する予定です。

iOSアプリ テストアプリ作成 その２

過去の記事に記載したように、Microsoft Visual Studioにて、Windows上でiOSのアプリを作成することができます。シミュレーターが搭載されているため、Windows上でもアプリの動作確認ができます。
（クリックで拡大）




それでも、シミュレーターと実機の操作性には相違があることから、作成したアプリを実際にiPadなどの実機にインストールして、実機上で動作確認したい場合もあります。iOSアプリをインストールする際はプロビジョニングプロファイルというものが必要になります。これは、信頼のおけるアプリのみをインストールする（不正なアプリをインストールしない）ためのファイルで、開発者の証明書等を内包しています。アプリをインストールする際に、このファイルも実機に取り込まれます。言い換えると、このファイルが無いと、アプリを使用（インストール）することができません。
ここでは、無償版のプロビジョニングプロファイルを作成し、iOSのアプリを実機にインストールする方法を記載致します。

Windows側の操作には
Mac側の操作には
iPad側の操作には
というアイコンを付加して記述します。

事前に、パソコン等を下図のように接続しておきます。



Microsoft Visual Studioにて、iOSのアプリを作成していきます。
（クリックで拡大）



プロビジョニングプロファイルを作成するために、Xcodeを起動します。
メニューバーの［Xcode］－［Preferences...］を選択します。


［Accounts］を選択し、画面右下の［＋］ボタンをクリックします。


小画面上で［Apple ID］を選択し、［Continue］ボタンをクリックします。


この画面で、プロビジョニングプロファイル作成時に必要なApple IDを登録します。
Apple ID（★１）とそのパスワードを入力し、［Sign in］ボタンをクリックします。
Apple IDを持っていない場合は、［Create Apple ID］から新規のApple IDを作成します。


元の画面に戻ると、登録したApple IDが画面上に表示されます。
画面左側のApple IDをクリック（選択状態に）してから、［Manage Certificates...］ボタンをクリックします。


画面左下の［＋］ボタンをクリックすると、作成する証明書の種類一覧が表示さます。


［iOS Development］を選択し、［Done］ボタンをクリックします。


XCodeの画面に戻り、プロビジョニングプロファイルを作成するためにダミーのプロジェクトを作成します。［Create a new Xcode project］を選択します。


［iOS］－［Single View App］を選択し、［Next］ボタンをクリックします。


［Product Name］，［Organization Identifier］に、任意の名称をそれぞれ入力します。
［Bundle Identifier］には、［Organization Identifier］と［Product Name］を組み合わせた名称が自動的に表示されます。他の項目は、初期値のままで良いです。
入力後、［Next］ボタンをクリックします。


プロジェクトの保存先を指定して、［Create］ ボタンをクリックします。


各種情報が掲載された画面が表示されます。
［Bundle Identifier］の値を確認しておきます。（★２）
（クリックで拡大）


尚、［Provisioning Profile］－［Xcode Managed Profile］の右にある i をクリックすると、「Expires in 6 days」である（6日で期限が切れる）ことが分かります。ここまでの手順によりプロビジョニングプロファイルは作成されますが、有効期間は6日しかありません。



Microsoft Visual Studioにて、プロジェクト一覧より Info.plist （図中①）を選択すると、下図のように表示されます。アプリケーションタブ（図中②）を選択し、バンドル識別子の入力欄（図中③）に、Xcodeで確認した（★２）のバンドル識別子を入力します。画面上部にて、図中④の欄で「iPhone」，図中⑤の欄でアプリをインストールしたい実機を選択します。
（クリックで拡大）


画面上部のツールバーより、［デバッグ］－［デバッグなしで開始］を実行すると、アプリが図中⑤で指定した実機にインストールされます。
（クリックで拡大）



Mac側でパスワードの入力を求められた場合は、Macにログインする際に必要なパスワードを入力し、［許可］ボタンをクリックします。



iPadへのアプリのインストールが成功すると、そのアプリのアイコンが画面上に表示されます。


しかし、インストール後にアプリを実行しようとしても、このようなエラーメッセージが表示され、実行できません。


これは、iPadは信頼したデベロッパ（開発者）のアプリしか起動できないためです。
下記の手順により信頼を確立する必要があります。設定画面を起動します。


［一般］－［デバイス管理］を選択します。


デベロッパAPPを選択します。
この箇所には、（★１）のApple IDが表示されます。


［～を信頼］を選択します。


［信頼］を選択します。


これにより、実機上でアプリを実行することができるようになります。


次回起動時は、信頼を確立する操作を行わなくてもアプリを実行できます。

注意点としては、プロビジョニングプロファイルの有効期限が6日であるため、それを過ぎるとアプリを使用できなくなる点です。期限切れのアプリを起動すると、起動直後に勝手に終了してしまいます。再度Microsoft Visual Studioよりインストールすれば、その時点からまた6日間使用することはできます。実運用には適していませんが、動作確認用，体験版用としては使用できます。

iOSアプリ テストアプリ作成 その１

Visual Studio 2017 Xamarinを用いて、iOSアプリの作成からインストールまでの一連の手順を把握するために、簡単なiOSアプリを作成してみました。

はじめに
開発に使用するパソコン等を下図のように接続しておきます。


LANケーブル等を正しく接続すると、WindowsとMacのネットワークが確立します。　

以下、Mac側の操作には
Windows側の操作には
というアイコンを付加して記述します。

ネットワーク確立の確認方法

メニューバー左端の［アップルメニュー］－［システム環境設定］－［ネットワーク］を開きます。




状況が「接続済み」となっており、ネットワークに接続できています。
このときのIPアドレス「192.168.0.3」（★１）を確認しておきます。



デスクトップ左下の検索入力欄に「cmd」と入力します。
検索結果一覧より「cmd デスクトップアプリ」を起動します。


これは「コマンドプロンプト」というWindowsに搭載されているツールで、ネットワークの状態を調べたり、ファイル操作を行うことができます。


Macの電源をONにしておきます。MacのIPアドレスは「192.168.0.3」（★１）より「ping 192.168.0.3」と入力し、Enterキーを押します。


このように「0% の損失」と表示された場合は、WindowsとMacのネットワークが確立していることを意味します。


そうでない場合は、LANケーブルの接続や電源などを確認し、WindowsとMacのネットワークが確立するようにして下さい。


リモートログイン設定
開発作業はWindows側で行っていきますが、その過程でWindowsからMacにログインする必要があるため、Macでリモートログイン（特定のコンピューターに別のコンピューターからログインする）設定を行います。


メニューバー左端の［アップルメニュー］－［システム環境設定］－［共有］を開きます。




画面左側の［リモートログイン］にチェックを入れます。
［アクセスを許可］を［次のユーザのみ］にしておき、下部の［＋］ボタンをクリックしてリモートログインに使用するユーザーを追加します。




ユーザーが追加されました。これにより、外部（今回はWindows）から指定ユーザー（★２）でMacにログインできるようになります。


Visual Studio 2017

Visual Studio 2017を起動し、新しいプロジェクトを作成します。
画面上部のツールバーより、［ファイル］－［新規作成］－［プロジェクト］を開きます。


今回は［インストール済］－［Visual C#］－［iOS］－［Universal］－［単一ビュー アプリ(iOS)］を選択し、名前を「TestiOS」としておきます。


Macに接続します。
画面上部のツールバーより、［ツール］－［iOS］－［Pair to Mac］を開きます。


この画面では、ネットワーク圏内にあるMacを自動的に検知して一覧表示します。
接続先のMac選択し、［接続］ボタンを押します。


Macのリモートログイン設定で追加したユーザー（★２）のユーザー名とパスワードを入力し、［Login］ボタンを押します。


接続に少し時間を要しますが、このような画面が表示されると接続成功です。


接続に失敗した場合は、ユーザー名とパスワードの入力文字列やWindowsとMacのネットワーク状態を確認して下さい。

この状態で、iOSアプリの開発を進めていきます。