ノーコード開発における設計をどう教えるか

2024 PC CONFERENCE（2024.08.18） ノーコード開発における 設計をどう教えるか 角南 北斗（Sunami Hokuto） [email protected]

発表者について

発表者について 専門はウェブデザイン・ICT教材開発 ✴ 大学・大学院では日本語教育学を専攻 ✴ 教師からフリーの開発者へ軸足をシフトして教育現場を支援 大学では情報系の授業を担当 ✴ Office・デザイン・プレゼン・知財など ✴ 今回はこの立場における授業実践の発表です

本発表で扱う授業実践の背景（2022年度）

授業の概要 大学の初級者向けの情報（Excelメイン）の授業で、 ノーコードによるアプリ開発を扱っている（2022年度〜）。 目的は、アプリを作れるようになることではなく、 データ処理やデータベースへの理解を深めてもらうため。 この教育実践の詳細は、2023PCC分科会で発表。 今回はその続きにあたる（背景や授業環境などは同じ）。

ノーコードとは コードを書くことなく（＝NoCode） アプリやサイトなどを開発できるツールの総称 ✴ 2019年あたりから、さまざまなツールがリリースされている ✴ 多くはブラウザ上だけで開発できる（特別なソフト等の導入が不要） ✴ 素人には「プログラミング知識ゼロでもOK」の意味に見えるが…、 コードを書く代わりに設定をGUIで行うアプローチなので、 開発の概念や用語の理解、ツールのお作法への慣れは求められる。

実践を行った２授業 音楽学部１年生向け・外国語学部２年生向け Excelなどを使ったデータ処理を基本から学ぶ授業 ✴ 「Excel使ったこないです」な受講生も対象に含まれる ✴ 学科の専門分野に直接つながるものではなく、基礎的なリテラシー科目 授業後半（Excelの基礎を終えた段階）でノーコード編に

授業で採用したノーコード（2022年度） Google AppSheet ✴ 指定のデータソースから自動でアプリを作ってくれる ✴ Googleスプレッドシートをデータソースに指定できる ✴ カスタマイズ要素少なめ・自動調整要素多めで、学習コストが低い

なぜデータベースの理解に焦点を当てたのか そもそもExcelの有用性を伝えるのは大変 ✴ 受講生は「計算結果を手入力」や「セル参照を使わない」などしがち ✴ WordやPowerPointと違って利用場面がイメージしにくい？ データベースはもっと「ピンとこない受講生」が多い印象 ✴ 教科書などは「社員名簿」や「５教科の試験結果」などのデータを 例に解説されていて、それを使って説明してきたが…

アプリを通してデータベースの役割を学ぶのは？ 以前は「Wordの差し込み印刷による宛名作成」を例に ✴ Excelで住所録を作り、Wordで案内状のフォーマットを作る ✴ 年賀状など、そもそも郵送文書が受講生にとって身近でなくなった 2022年度はスマホアプリを作ってみようと考えた ✴ 受講生に身近なスマホ用のアプリを題材にすれば、 アプリにおけるデータベースの役割を少しは実感できるのではないか？

受講生・環境・担当のスキルについて 受講生は、プログラムやアプリ開発に関する 特段の知識・関心は持っていない（という前提）。 開発向けのアプリは何も入っていない端末（教室のPC） 担当教師（発表者）もプログラムは得意ではない ✴ プログラムのスキルがなくても、ウェブサービスなどの活用で、 高度なことが実現できる・自分の可能性が広がる体験をしてもらいたい。

実践内容と結果 メモ帳アプリ・ToDo管理アプリの作成と改善 ✴ AppSheetの基本部分を押さえながら、アプリ開発の概念と流れを知る ✴ アプリとデータベースどう連動しているかを体感する 受講生（多いクラスは30名超）のほぼ全員が 配布資料に沿って各自最後まで進められた。 ✴ 個別のトラブルシューティングの声がけは、さほど多くはなかった

2023年度の追加・変更分

授業で採用したノーコード（2023年度） Google AppSheet（2022年度から継続・前半３週程度） Glide（2023年度に追加・後半５週程度） ✴ glideapps.com ✴ AppSheetより画面遷移やUIパーツの自由度が高い（手作業が多い） ✴ 入力データをリアルタイムに処理し表示するので、計算機なども作れる 配布資料で受講生が各自進める形は同じ

AppSheetに加えGlideを扱った理由 受講生にとってより「アプリらしい」作例を扱うには AppSheetよりGlideの方が適している、と判断したから

AppSheetの強みは受講生と相性が悪い AppSheetは扱いたいデータや業務フローがあると強い ✴ 指定のデータソースから手間なく標準的なアプリにしてくれる ✴ 外部フォーム連携など、業務フローに組み込む系の資料が豊富 ✴ 例：社員名簿＋ タスク / 問い合わせ対応 / 有給申請 などの管理アプリ 大学生はデータの手持ちがなく馴染みが薄い ✴ データベース活用としてはよくある例でも、関心が向かないと厳しい

Glideは１画面アプリが作りやすい AppSheetより画面設計が自由（手動で手間はかかる） １レコードのデータでもアプリ設計がしやすい データ入力をリアルタイムに監視して、 関連カラムの再計算・再表示を実行してくれる ✴ 入力すると下に処理結果がすぐ出る１画面のアプリが作りやすい ✴ 電子レンジ温め時間計算機 / BMI計算機 / クイズアプリ など

実践の結果：画面設計の難易度認識に差

受講生の反応は予想外だった 予想『Glideは複雑すぎて意味がわからないよ』 ✴ データのカラム１つ追加するたびに、入出力のUIパーツの配置も手動、 UIパーツごとの表示設定も手動、と非常に多くの手間がかかる ✴ Glideの操作体系がわかりにくく、ガイドとなるものが少ない 結果『GlideはAppSheetより（面倒だが）わかりやすい』 ✴ AppSheetの方がシンプルで自動設定も多いのに、なぜ？

AppSheetの何が難しいと感じるのか？ カテゴリー分類ができるメモアプリに苦戦する ✴ トップページ → カテゴリーの一覧 → 選択したカテゴリーに属するメモの一覧 → 選択したメモのページ 各カテゴリー用の情報がある場合は特に混乱しやすい ✴ カテゴリーの名前、説明文、画像など ✴ カテゴリー情報は別テーブルとして設計するので難しくはなるが…

AppSheetの問題、ではなさそう AppSheetというツールでの実現方法ではなく、 カテゴリー選択の画面遷移のイメージが描けていない。 階層型カテゴリーで情報を分類するようなアプリは、 いまや受講生に身近なものではないのかもしれない。 ✴ キーワード検索、ハッシュタグ、おすすめリストのほうが身近 ✴ ブログでいうと…という例えは通じない

AppSheetで作るアプリの基本仕様 AppSheetの自動生成 View（画面パターン） ✴ 一覧：レコードのリストを表示する画面 ✴ 詳細：任意のレコードを表示する画面 ✴ フォーム：レコードの作成/編集をする画面 処理を行うと画面遷移が発生する仕様のアプリなので、 仕組みをシンプルに説明しやすい ✴ … 画面A → 入力 → 処理 → 画面B …

Glideで作れるアプリの仕様 AppSheetのような仕様のアプリも作れるが… データ入力 → 保存 → 反映 を画面遷移なく行う仕様も可能 スマートで今風なインターフェースが作れて楽しいが、 担当教師としては体系的な説明がしづらい ✴ 最近のアプリはそうなっているし、考えてみればExcelもそう ✴ 受講生は「そういうUIパーツ」だと理解してどんどん使っていく

Glideで作れるアプリの仕様 AppSheetのような仕様のアプリも作れるが… データ入力 → 保存 → 反映 を画面遷移なく行う仕様も可能 スマートで今風なインターフェースが作れて楽しいが、 担当教師としては体系的な説明がしづらい ✴ 最近のアプリはそうなっているし、考えてみればExcelもそう ✴ 受講生は「そういうUIパーツ」だと理解してどんどん使っていく

躓きやすいポイントは見えたけれど 同じ「開発経験ゼロ」でも、データ処理と画面遷移の理解や、 インターフェースに対する認識は、受講生ごとに差が出る。 ✴ 感覚的理解でも構わないが、それゆえ受講生個人に依存しやすい要素 体系的に教師から説明したほうがスムーズだろうが、 授業が「アプリ開発講座」に寄ってしまうのは不本意。 シンプルな仕様のアプリは作例として説明しやすいが、 受講生に関心を持たれにくいものになりがち。

2024年度（後期）はどうする？

開発がスムーズにするサポートを増やす 受講生がアプリを楽しく作れるようになるには、 一定の「設計スキル」が必要で、そこは支援が必要。 ✴ ピンとこない受講生には、既存アプリの具体例を示すなどの工夫 アプリ設計の支援に注力しすぎるのは良くないが、 意欲的に取り組むようなアプリでないと得るものは小さい。 ✴ 予想外にとんでもないアプリを作ってくる受講生も一定数いる

授業目的と内容のバランス AppSheetとGlideの二本立ては今年度も継続予定 ✴ 先にAppSheetを経験しないとGlideは難しすぎる ✴ Glideはデータベースというよりデータ加工系のアプリになりがちだが… プログラム自体が主目的でない情報処理の授業って、 どのあたりを落とし所としてやっているんだろう…? ✴ ツールの操作の習熟や、それ以前の個人差のフォローに時間が必要で、 限られた時間のなか本質的な部分まで行くのが大変。

実践を通して、いま考えていること 汎用性の高いExcelをまず学ぶのは前提として、 ノーコードのような今風のツールの活用例を通して データ処理への理解を深めるのも１つの方法ではないか。 ✴ エンジニア志望などでない学生、あるいは教員や職員などにとっても、 いま体験しておく価値のあるツールではないか、と考える。 教育現場でツールを扱うためのリソースが足りないので、 今後は情報収集だけでなく、発信・共有をしていきたい。

https://zenn.dev/shokuto/books/appsheet-tutorial

• https://zenn.dev/shokuto/books/appsheet-tutorial

Sunami Hokuto Blog: withcomputer.jp Site: sunamihokuto.com X = 旧Twitter: @shokuto