--- title: 「Excelの次」としてのノーコード tags: #ノーコード #excel #情報教育 #appsheet author: [Hokuto SUNAMI](https://www.docswell.com/user/shokuto) site: [Docswell](https://www.docswell.com/) thumbnail: https://bcdn.docswell.com/page/4JQ8YZ6Y7P.jpg?width=480 description: 2023PCカンファレンス（2023.08.19 ＠つくば国際会議場）の分科会口頭発表のスライドです。Excelの基礎的な学習の次のステップとして、データベースの理解を深めるためにノーコード（主にAppSheet）を使う、という教育実践について紹介しています。 published: August 22, 23 canonical: https://www.docswell.com/s/shokuto/KW1RWR-NocodeForClass2022 --- # Page. 1 ![Page Image](https://bcdn.docswell.com/page/4JQ8YZ6Y7P.jpg) 2023 PC CONFERENCE（2023.08.19） 「Excelの次」としての ノーコード 角南 北斗（Sunami Hokuto） hello@shokuto.com # Page. 2 ![Page Image](https://bcdn.docswell.com/page/K742W34ZJ1.jpg) 発表者について # Page. 3 ![Page Image](https://bcdn.docswell.com/page/LJ1MY14DEG.jpg) 発表者について 専門はウェブデザイン・ICT教材開発 ✴ 大学・大学院では日本語教育学を専攻 ✴ 教師からフリーの開発者へ軸足をシフトして教育現場を支援 大学で情報系の授業を担当 ✴ Office・デザイン・プレゼン・知財など ✴ 今回はこの立場における発表です # Page. 4 ![Page Image](https://bcdn.docswell.com/page/GJW3G8X8J2.jpg) 発表の概要と目的 # Page. 5 ![Page Image](https://bcdn.docswell.com/page/4EZVL869J3.jpg) 「Excelの次」としての ノーコード # Page. 6 ![Page Image](https://bcdn.docswell.com/page/Y765WP2DEV.jpg) 発表の概要と目的 初級者向けの情報（Excelメイン）の授業で、 データベースへの理解をより深めてもらう目的で、 ノーコードによるアプリ開発を取り上げた。 ✴ 「Excelの次」＝「Excelの次に学ぶものとして」の意 ノーコードを授業で扱う際の（主に）難しさについて、 実践前と実践後に感じたことを、みなさんと共有したい。 # Page. 7 ![Page Image](https://bcdn.docswell.com/page/G75YMK2874.jpg) ノーコード（NoCode）とは どのようなツールなのか？ # Page. 8 ![Page Image](https://bcdn.docswell.com/page/9J2G9W4VJR.jpg) ノーコードとは コードを書くことなく（＝NoCode） アプリやサイトなどを開発できるツールの総称 ✴ 2019年あたりから、さまざまなツールがリリースされている ✴ プログラミングができなくても...という意味に感じるが、 誰でも簡単に…というわけでもない（これはポイントなので後述） # Page. 9 ![Page Image](https://bcdn.docswell.com/page/DEYV4LMQEM.jpg) 本実践で採用したノーコード 本実践ではGoogleの「AppSheet」を主に利用 ✴ 指定したデータベースから自動でスマホアプリを作ってくれる ✴ Googleスプレッドシートをデータベースに指定できる ✴ ブラウザ上だけで開発できる（特別なソフト等の導入が不要） # Page. 10 ![Page Image](https://bcdn.docswell.com/page/VJNMY4W278.jpg) # Page. 11 ![Page Image](https://bcdn.docswell.com/page/YE9NPQXDE3.jpg) 授業内容と、ノーコードを扱った理由 # Page. 12 ![Page Image](https://bcdn.docswell.com/page/GE8KDG257D.jpg) 実践を行った3授業（2022年度後期） 主な受講生は、それぞれ1年生・2年生・4年生（学科は様々） Excelなどを使ったデータ処理を基本から学ぶ授業 ✴ 「Excel使ったこないです」な受講生も対象に含まれる ✴ 学科の専門分野に直接つながるものではなく、基礎的なリテラシー科目 授業終盤（基礎からデータベースまで終えた段階）で、 データベースへの理解を深めるためにノーコードを扱った。 # Page. 13 ![Page Image](https://bcdn.docswell.com/page/LELZMG23JR.jpg) なぜデータベースの理解に焦点を当てたのか そもそもExcelの有用性を伝えるのは大変 ✴ 受講生は「計算結果を手入力」や「セル参照を使わない」などしがち ✴ WordやPowerPointと違って利用場面がイメージしにくい？ データベースはもっと「ピンとこない受講生」が多い印象 ✴ 教科書などは「社員名簿」や「５教科の試験結果」などのデータを 例に解説されていて、それを使って説明してきたが… # Page. 14 ![Page Image](https://bcdn.docswell.com/page/4JMVYQ8MJW.jpg) アプリを通してデータベースの役割を学ぶのは？ 以前は「Wordの差し込み印刷による宛名作成」を例に ✴ Excelで住所録を作り、Wordで案内状のフォーマットを作る ✴ 年賀状など、そもそも郵送文書が受講生にとって身近でなくなった 2022年度はスマホアプリを作ってみようと考えた ✴ 受講生に身近なスマホ用のアプリを題材にすれば、 アプリにおけるデータベースの役割を少しは実感できるのではないか？ # Page. 15 ![Page Image](https://bcdn.docswell.com/page/PJR2985LE9.jpg) 受講生・環境・担当のスキルについて 受講生は、プログラムやアプリ開発に関する 特段の知識・関心は持っていない（という前提）。 開発向けのアプリは何も入っていない情報端末 担当教師（発表者）もプログラムは得意ではない ✴ プログラムのスキルがなくても、ウェブサービスなどの活用で、 高度なことが実現できる・自分の可能性が広がる体験をしてもらいたい。 # Page. 16 ![Page Image](https://bcdn.docswell.com/page/PEXDQ8X67X.jpg) ノーコードの中でもAppSheetを採用した理由 開発に必要な環境がブラウザのみ・無料 スプレッドシートをデータベースに使える データベースからアプリ化を自動でやってくれる ✴ 自動で組み上がったアプリが、設定調整なしでも実用的なレベル ✴ 画面設計の自由度が低いことを長所として捉える 日本語の資料が他のツールに比べて多い # Page. 17 ![Page Image](https://bcdn.docswell.com/page/3EKX9KWG7D.jpg) 実践内容と結果 学期終盤の4週（360分）程度をノーコードに割り当て ベーシックなメモ帳・タスク管理アプリの作成と改善 受講生（多いクラスは30名超）のほぼ全員が 自分のスマホでアプリを動作させるところまで到達。 ✴ 自作の配布資料に沿って受講生各自で進める形式 ✴ 個別のトラブルシューティングはさほど多くはなかった # Page. 18 ![Page Image](https://bcdn.docswell.com/page/L735WZ15E5.jpg) # Page. 19 ![Page Image](https://bcdn.docswell.com/page/87DDKRXY7G.jpg) 本発表で共有したい、２つの「難しさ」 事前に想定していた「難しさ」 ✴ 受講生がノーコードを使ってアプリを作るのは、 ハードルが高すぎるのではないか？ 実践してみて感じた「難しさ」 ✴ アプリを完成させることが優先、ではない授業においては、 ノーコード自体の設計思想や巷の学習リソースと相性が悪い。 # Page. 20 ![Page Image](https://bcdn.docswell.com/page/VJPXKWP278.jpg) 事前に想定していた「難しさ」 # Page. 21 ![Page Image](https://bcdn.docswell.com/page/2EVLV82XJQ.jpg) ノーコード＝開発知識は不要、ではない エディタでプログラムを書いていく工程ではないが、 GUIでそれを行うための知識は、ある程度必要。 ✴ 例1：データベースのカラムのデータ型の指定 ✴ 例2：英語のエラーメッセージが出た時の対処法 データの抽出では関数を書く必要がある ✴ 集計関数、IFによる分岐など（Excelの知識が使える、とも言える） ✴ 配列などの理解が要求されるケースになると、授業で扱うのは厳しい # Page. 22 ![Page Image](https://bcdn.docswell.com/page/57GXL5RREL.jpg) # Page. 23 ![Page Image](https://bcdn.docswell.com/page/4EQ8YZVYJP.jpg) 画面設計を自分ですることの大変さ 画面遷移やUIパターンが整理できていないと厳しい ✴ AppSheetに限った話ではなく、開発全般に言えることだが… ✴ データの一覧表示・個別データの表示・データ編集画面、など AppSheetはベーシックな画面遷移とUIを自動で用意してはくれる。 ✴ メモ帳アプリは使ったことがあっても、いざそれを自分で作るとなると、 目指すべき（あるべき）画面と遷移の形がイメージできない。 # Page. 24 ![Page Image](https://bcdn.docswell.com/page/KJ42W3MZE1.jpg) 授業ではどう準備・対応したか？ 作成するデータベースをAppSheetの挙動に合わせる ✴ どんな状態のデータベースを指定するとどんなアプリを自動生成するか、 事前に挙動を検証して、初期データやカラム追加時のラベル名など、 トラブルを回避しやすいスプレッドシートを受講生に例示する。 開発の知識が必要な設定は「指示」する ✴ 設定の意味を説明することも大切だが、アプリ開発が目的ではないので、 概念の大雑把な説明にとどめてスムーズに次に進ませる。 # Page. 25 ![Page Image](https://bcdn.docswell.com/page/LE1MY18D7G.jpg) 実践してみて感じた「難しさ」 # Page. 26 ![Page Image](https://bcdn.docswell.com/page/GEW3G8Z8E2.jpg) 理解より完成が優先されがち トラブル回避を意識したスムーズな工程設計の提示が、 逆に「手順通り作業してアプリを完成させること」を 受講生が目標にしすぎてしまうことにもつながる。 ✴ 適切なデータベース（スプレッドシート）を受講生に渡せば、 AppSheetはまともなアプリに仕立ててくれる。 ✴ データベースと手順書を整備すればトラブルはかなり回避できるが、 手本通りに作ることに（教師も受講生も）意識が向きすぎてしまう。 # Page. 27 ![Page Image](https://bcdn.docswell.com/page/47ZVL819E3.jpg) 理解より完成が優先されがち データ表示のトラブルからデータベースを見直す、 という作業を通して理解を深めてもらいたいが… ✴ 見本と異なるデータ、あるいはデータ自体が未入力という事実に、 受講生の意識がなかなか向かないケースが見られた。 ✴ 見本通りではなく、自分で考えたデータを入れるチャレンジが少ない スムーズにアプリを完成させられるような人は、 スタイル設定などの見栄えの調整に時間を割きがち。 # Page. 28 ![Page Image](https://bcdn.docswell.com/page/YJ65WPLD7V.jpg) トラブルが程良く起きるような工程を入れる 教師が提示するスプレッドシートの設計を、 あえてAppSheetが適切に設定してくれないものにする ✴ トラブルを故意に起こして、受講生に意図的に回り道させる シートを作り込んでからAppSheetに渡す形が向いているが、 少しずつカラムを追加してはアプリで設定する手順を選ぶ。 ✴ メモ帳なら、後から日付やIDなどを場当たり的に追加していき、 データの修正やアプリ側の表示の手動調整を繰り返させる。 # Page. 29 ![Page Image](https://bcdn.docswell.com/page/GJ5YMK18J4.jpg) 教師側の下準備が大変 データのアプリ化を自動で行うAppSheetの良さに あえて逆らうような工程設計が必要。 問題が起きそうなデータ、ツールの穴を探すような作業は、 不毛な下準備であり、そのコストも大きい。 ✴ 適当なデータを指定しても、いい感じに仕上げてくれる賢いツールだけに… # Page. 30 ![Page Image](https://bcdn.docswell.com/page/9E2G9W1VER.jpg) ノーコードの特徴と噛み合わない授業 ノーコードがその強みを発揮するのは、 現場の抱えている問題をアプリで解決したい人や、 活用したい事業データがすでにある、というような人。 ✴ 世の中の資料も「具体的なアプリを完成させる手順の解説」に主眼 データを扱う経験の少ない（いま扱っていない）受講生には 解決したい問題・活用したいデータ自体がない ✴ アプリ開発の目標や動機を設定することが難しい # Page. 31 ![Page Image](https://bcdn.docswell.com/page/D7YV4LZQ7M.jpg) データベースを学ぶ、に使えるリソースや手法は？ データベース自体をライトに学べるような資料は少ない ✴ ノーコードの資料は「具体的なアプリの完成手順の解説」に主眼 ✴ エンジニア向けの入門書はあるが大袈裟すぎる アプリを多く作っていけば理解も深まるだろうが… ✴ 毎週違ったアプリを作るような授業にするには時間が足りない ✴ 受講者数が多いと教師一人ではサポートが追いつかなくなりそう # Page. 32 ![Page Image](https://bcdn.docswell.com/page/VENMY432J8.jpg) 次年度（2023年後期）はどうするか？ # Page. 33 ![Page Image](https://bcdn.docswell.com/page/Y79NPQ9D73.jpg) 次年度の授業の方針 2023年度後期も「Excelの次」にノーコードを扱う AppSheetを採用する見通し ✴ トラブルや回り道を、もう少し盛り込むような流れにする ✴ AppSheetの機能や画面構成の突然のアップデートを注視 新しい他のサービスも横目で検討 ✴ 4年生の授業では、AppSheetの後にGlide（glideapps.com）も使った # Page. 34 ![Page Image](https://bcdn.docswell.com/page/G78KDG95JD.jpg) # Page. 35 ![Page Image](https://bcdn.docswell.com/page/L7LZMGW3ER.jpg) AppSheetと比較したGlideの特徴 AppSheetよりも手作業の設定が求められるが、 画面遷移やUIパーツの配置の自由度が高い。 ✴ 入力データをリアルタイムに処理し表示するので、計算機なども作れる 作れるアプリの幅が広いが、最初のツールとしては不向き ✴ 「難しいが慣れるとAppSheetより楽しい」という声 ✴ 癖のあるGUIや情報の少なさに耐えて試行錯誤できるマインドが必須 # Page. 36 ![Page Image](https://bcdn.docswell.com/page/4EMVYQ9MEW.jpg) # Page. 37 ![Page Image](https://bcdn.docswell.com/page/PER298GL79.jpg) AppSheetと比較したGlideの特徴 AppSheetよりも手作業の設定が求められるが、 画面遷移やUIパーツの配置の自由度が高い。 ✴ 入力データをリアルタイムに処理し表示するので、計算機なども作れる 作れるアプリの幅が広いが、最初のツールとしては不向き ✴ 「難しいが慣れるとAppSheetより楽しい」という声 ✴ 癖のあるGUIや情報の少なさに耐えて試行錯誤できるマインドが必須 # Page. 38 ![Page Image](https://bcdn.docswell.com/page/P7XDQ8Q6JX.jpg) 発表のまとめ 初級者向けの情報（Excelメイン）の授業で、 データベースの学習にノーコードを使う実践を行った。 事前の懸念である「ノーコードを扱うことの難しさ」は 実際はそこまで大きな問題にはならなかった。 一方で「アプリの完成が目的になりすぎる」ことの回避を、 どう授業設計に盛り込むかは課題として残った。 # Page. 39 ![Page Image](https://bcdn.docswell.com/page/37KX9K9GJD.jpg) 実践を通して、いま考えていること 汎用性の高いExcelをまず学ぶのは前提として、 ノーコードのような今風のツールの活用例を通して データ処理への理解を深めるのも１つの方法ではないか。 ✴ エンジニア志望などでない学生、あるいは教員や職員などにとっても、 いま体験しておく価値のあるツールではないか、と考える。 教育現場でツールを扱うためのリソースが足りないので、 今後は情報収集だけでなく、発信・共有をしていきたい。 # Page. 40 ![Page Image](https://bcdn.docswell.com/page/LJ35WZW575.jpg) Sunami Hokuto Blog: withcomputer.jp Site: sunamihokuto.com X = 旧Twitter: @shokuto