--- tags: edu,covid19,CfJ, tittle: CODIV19_edu(臨時休校学習計画表) description: 緊急事態宣言に伴う臨時休校期間と今後の分散登校や学校と家庭の間での子どもの学びと家庭でのデジタル環境整備へのサポートプロジェクトです --- # 「おうちで時間割」開発ログ COVID19_edu 緊急事態宣言に伴う臨時休校期間と分散登校・短縮授業など含め、学校と家庭の間での子どもの学びにおけるデジタル環境整備へのサポートを行うプロジェクト - はじめての方へ📜 - [プロジェクト開始時の背景や概要](#%E3%83%97%E3%83%AD%E3%82%B8%E3%82%A7%E3%82%AF%E3%83%88%E6%A6%82%E8%A6%81) - [概要説明資料(最新ver.2)](https://docs.google.com/presentation/d/1VHLf3fIwiVCO4lqc8PCw3RdbPgobppNUr1D5PRqGTDg/edit?usp=sharing) - [コントリビューター自己紹介ページ](https://docs.google.com/presentation/d/1swk_vvUutzmpij2Tr4NQs7Qd8Joe-FqsWJIdOMzd5-M/edit#slide=id.p) - Slack - [「おうちで時間割」HackMD](https://hackmd.io/@codeforjapan/StudyAtHome) - [おうちで時間割デザイン HackMD](https://hackmd.io/@codeforjapan/StudyAtHome_design) - [#covid19\_edu](https://app.slack.com/client/T02FMV4EB/C0137MBH46L) メインとなるチャネルです - [#studyathome\-impl](https://app.slack.com/client/T02FMV4EB/C012WQQEF8V) 実装よりの細かい内容 - [#studyathome\-git](https://app.slack.com/client/T02FMV4EB/C01427EV8JW/) 通知用(現在GitHubのみ) - Github - https://github.com/codeforjapan/StudyAtHome/issues - ## 9/26ソーシャルハックデー#19 1. issueの対応 - V1対応 https://github.com/codeforjapan/StudyAtHome/milestone/2 - [ ] [163](https://github.com/codeforjapan/StudyAtHome/issues/163 ) URL・クエリパラメータ等の整理 - MaySo - [ ] [148](https://github.com/codeforjapan/StudyAtHome/issues/148) 2つある利用規約のページ名変更->155関連 - MaySo - [x] 389,390,387,表記関連 [name=吉沢] - [ ] 244 授業のページ　動画リンクを画像サムネイルにしたい [name=MaySo] - [x] [196](https://github.com/codeforjapan/StudyAtHome/issues/196) クラスに対する授業追加を案内する文言に選択中クラスの属性が反映されない [name=吉沢] - [ ] [252](https://github.com/codeforjapan/StudyAtHome/issues/252) シェアページ [name=MaySo → 吉沢] - [x] [247](https://github.com/codeforjapan/StudyAtHome/issues/247) クラス一覧にクラスIDを表示 [name=MaySo] 1. 言語対応[name=Bess][name=MaySo] 1. 横デザイン対応準備 - 紀子さんが動けない分、伊藤さんに投げるところの明確化[name=紀子] - [ ] 動画が入っているところに表示するOGP風動画マーク画像 - [ ] 動画検索画面のデザイン - そもそものOOUI整理しましょう[name=紀子][name=武貞] - [ ] OOUI整理 - [ ] タスク - [ ] モデル - [ ] インタラクション - [ ] プレゼンテーション 1. テスト運用してもらう学校への連絡と相談 [name=武貞] - 伊勢先生 - その他の普通級の相談 1. NHKとの打ち合わせ [name=武貞] - 更新する際のデータ周りについて - プレスリリースの準備 ## 8/22ソーシャルハックデー#18 1. **現状整理+issue確認** - issueを整理する - 動画がURLの文字列だと気がつけない押せない [issue#244](https://github.com/codeforjapan/StudyAtHome/issues/244) - 今後のスケジュールチェック 2. **データ入れ込み・インフラ周り** - NHK for Schoolデータ - 概ね整理済み - jsonはつくってあるのでUIに組み込みはできる - 既存の編集画面3/4の動画URLの部分に - 既存デザインを使いながら、あまり大きな改修せず - 検索機能をつくろうという段階 - ガッチャンコはいとうさん done - デザインは実装が走ってから、のりこさんが確認 - GCP -> AWS - DB：AppSyncに載せ替え - 問題なさそう - app認証：Amplifyに載せ替え? - SSR周りが心配だが、ミドルウェア使わないならいらない - 認証系:ログインしていない時トップページに戻す - 現状 - LPはそのまま移植完了 - アプリはESCへの載せ替えのみ - アカウントは吉沢個人からC4Jへ - firestorageは使ってない - DBの中でのクラスデータとエディタクラスデータ - 外形監視 https://uptimerobot.com/ 3. **教員向け改善(主にUIUX)** デザイン関連のHackMD https://hackmd.io/@codeforjapan/StudyAtHome_design - 縦横問題：レスポンシブでスタイルを入れていくのがいいのではないか - 編集画面の4分割されているのを１画面にするのは開発側として面倒なのではないか - 一方で、ユーザーヒアリングのなかでは圧倒的にスマホよりもパソコンでの編集が多かったので、今あるもの前提で作るよりも前提条件が正しいのかの整理からやった方が良さそう - 外的要因の変化問題：臨時休校から短縮授業や普段の学校でのやりとりを想定するところへ比重を変えていく必要性がある - ユーザーフローの再整理 - BPMNチャートをつくってみよう - ユーザーストーリー - OOUI - OOUX https://www.thinkcompany.com/blog/object-oriented-ux-part-2/ ## 7/18ソーシャルハックデー#17 12：00 - 18:00 1. **現状整理＋今あるissue対応**(1200-1500) - issueを整理する - 今後のスケジュールチェック - ﾄﾗﾌﾞﾙ発生)修正を… - Nuxtのバージョンアップをしてみた - ら、動かず、マスターまで戻しても動かず - マスタは動いた?? 修正・現場復帰 1. **データの取り扱い周りを整えていく**(1500-) - NHK for Schoolのデータを時間割へ - 学習指導要領のコード化を想定したり - 他のコンテンツが今後増えていくことも想定したり - 先にNfSのデータでまず動くもの作ってから、他のコンテンツも考えたらいいのでは？(伊藤さん) 1. **言語対応の準備** - 来週のg0vハックデーに向けて、英語・マンダリン対応ができるように素地を作っておく 1. **PCからの編集を想定したUIUXの改善**(林さんと) - 緊急時で在宅ワーク環境だったのでスマホで使うことを想定していたが - 学校からのタブレット配布・PC配布が増えている＋学校の先生は家の私用PCで仕事することが判明 1. **ユーザーの声を拾っていく仕組みの想定**(空き時間あれば) - ユーザーテスト・ユーザーヒアリングはしているが、今後バージョンアップしていくごとに使用者の声を拾えるようにしていきたい - `"vuex-class-component": "2.3.3"` バージョン固定で動くはず → 動いた - Transifex 開設 https://www.transifex.com/studyathome/studyathome-app/ - nuxt-i18n 導入中 - --- ## 6/27ソーシャルハックデー#16 12：00 - 14:00（昼休み含む） - みんなでユーザーテストをやってみよう - 基本シナリオ：Covid19の第二波によって、再び休校となって、生徒たちは在宅で勉強をしなくてはなりません。これ以上、学習スケジュールを遅らせるわけにはいきませんが、学校及び家庭のIT環境は4月頃と変わりません。教員である被験者は、どうやって、家にいる生徒に学習計画表を伝えて、勉強してもらうか悩んでいます。その時、同僚から「おうちで時間割」というサービスを聞いて、Google検索をして使ってみることにしました。 - 使うものはこちら： - 検証に使うURL https://studyathome-dev.web.app/ - バグを記載するシート https://docs.google.com/spreadsheets/d/1xRuPVQWhHdJ-4yytt6-z4to2vwnYG5Hz2sDTCKM0ROI/edit#gid=1427957996&range=A1 - スクショをいれるフォルダ https://drive.google.com/drive/u/3/folders/1HX-127gyxYe4-XDxogo2t4_mXelXGpLQ - ヒアリングのドキュメント https://docs.google.com/document/d/1UJTo-irBNr-UcXtd7K4TLGEGSh-V8Sr13kv_WRPoKEw/edit# - プロセスはこちら： 1. Google検索で「おうちで時間割」のトップページを選択（現在のところ上位に来ないので、LINEorFBメッセンジャーで伝える） 2. トップページから、新規ユーザー登録、クラスの登録 3. クラスに入って、時間割の作成（授業登録）をする 4. （オプション）授業の登録の時に動画を使ってもらう 5. 動画はそもそもどこにあるか知っているかも確認ポイント 6. 翌日以降の授業の登録 7. クラスIDを生徒に連絡（ここまでが基本タスク） 8. （オプション）副担任のクラスもある設定でどうするかの確認 9. 生徒側の画面も見てもらい、感想をもらう 14:00-15:00 - 開発チーム - バグのissue化 - バグ潰し - デザインチーム - v1に向けたデザイン修正 15:00-　中間報告 15:30- 開発引き続き - NfSのデータの扱いについて相談 - https://www.nhk.or.jp/school/guideline/ - 引き続きバグ対応（開発チーム） - v1に向けたデザイン修正（デザインチーム） --- ## 5/23ソーシャルハックデー#15 https://hackmd.io/mwazHPfjTO-3s0T5lRs1Sg#%E2%91%A1%E8%87%A8%E6%99%82%E4%BC%91%E6%A0%A1%E6%9C%9F%E9%96%93%E3%81%AE%E5%AE%B6%E5%BA%AD%E5%AD%A6%E7%BF%92%E3%82%B5%E3%83%9D%E3%83%BC%E3%83%88%E3%83%97%E3%83%AD%E3%82%B8%E3%82%A7%E3%82%AF%E3%83%88 ### 参加者 - 武貞（発達障害児支援・子どもの人権→[SFA-18](https://edtechzine.jp/article/detail/1923)開催時田中さんと出会う） - 白澤（流山テイクアウトマップ・CfJサミット教育トラック） - おそけん（Nuxt版とかデータ加工とか！） - はやし（デザイナー・紙マップをおそけんさん達と→都のサイト→ここ・新小１の娘さん・主業務で公教育系に強い） - MaySoMusician(渡邊響)（CfJインターン / 都コロナ対策サイト多言語化 → 本プロジェクトNuxt版実装・TypeScript化など（吉沢・y-chanとともに）） - 吉沢（高専にいます・前回ハックデーをみた・ちょっと遅刻した） - ふくだ(なんだろう) - 田中（NHK・TEDの番組きっかけで関さんと知り合い…C4J発足していった→コロナ特番がきっかけでこのプロジェクトの提案に至る） - 林さん（初!・NHK・田中さんに連れてこられました。日本賞プロジェクト） - 伊藤（初!・普段はチームラボさんでUIUX・社会課題に興味があり、Slackから） - 八谷（プログラミング勉強している高校生です。C4Jインターンです。貢献したいです。） - y-chan(芦田) (~~吉沢さんに連れてこられた人。~~ 何か言えるほど何かしているわけではない) ### Today's Mission： 1. Nuxt版を開発(吉沢・林(のりこ)・MaySoさん・伊藤さん・福田さん・八谷) - 参考 - [おうちで時間割 リンク集 \- HackMD](/WaMGvfV3TOy1XSUqEDpTfQ?view) - [おうちで時間割 Nuxt版　仕様書 \- HackMD](hltUcnt2S0eQEv1Heif7zw?view) - 作業 - [x] TS化整理して一旦developmentにマージして貰えれば... - [x] コンポーネントの実装 < Figma - [スタイルガイド — Vue.js](https://jp.vuejs.org/v2/style-guide/) - [Issue `label:components`](https://github.com/codeforjapan/StudyAtHome/issues?q=is%3Aissue+label%3Acomponents+) をさばく - 余裕があれば対応したいかも - API(別リポジトリ) - Nestでテストなど先に書いてしまおうかと思います - ちょっとまとめていたSwaggerからの移行も含む 1. データが届いたので.jsonに変換（白澤・おそけんさん・田中さん・たかこさん） - NDA締結した人の取り扱いが必要(契約に紐づくため) - データの形式変換 - 今後を見据えてのデータの項目確認 1. Glide版のユーザーヒアリングを確認 - これはリリース後に小池先生・白澤さん・武貞でやりましょう 1. ポリシー系（田中さん・武貞） - 確認・作成 - 弁護士さんに確認 - aboutに載せねば 1. LPの最終修正とv1に向けた全体像設計してみんなに共有(武貞) - 文面を変えていく - これをコーディングしていきたいが、本体の開発優先 1. 夕方にはできたよ宣言≠ローンチ - 契約締結までは外向けにローンチできません - **できることは、ハックデー内での「できた！」宣言となります** ### 本日のワークスペース - Zoom(のブレイクアウトルーム) 通話, テキストチャット ### 時間進行： | time | 全体 | Nuxtチーム | データチーム | | -------- | -------- | -------- | -------- | | 12:00-13:30 | | 13:30-15:00 | | 15:00-15:30 | 中間報告/休憩 | 15:30-17:00 | | 17:00-17:30 | 進捗・成果報告 --- ## 5/2もくもくデー - 未明~ - 自由時間 (Meetは開いてます) - 11:30 チェックイン - 簡単な自己紹介 - これまでのプロジェクト概要共有 - 今日の各隊の予定共有・分担検討・決定 - 18:00 チェックアウト - 今日の成果・議論で残った部分の共有 - 今後の予定を確認 ### 関連資料など - [covid19\_edu\(外部公開\!\!\!\) \- Google Drive](https://drive.google.com/drive/folders/1ivfM-FS_KwJd1v5Ow3-iWgLIIktylC-F) - [議論、情報共有 公開Jam \- Google Jamboard](https://jamboard.google.com/d/1Kcbr_kTZUhCYXkVlG8MtBGdV90IY2boqgAraUlbh6Rc/) - [概念、機能の整理 \- Google Jamboard](https://jamboard.google.com/d/1uUkaqWZm2jaiLrK0aSd3y15C14zXYHzR_iFacY-fb1A/) ### Today's Mission： もくもくデーなので、得意なこと・好きなこと・やってみたいことを各自選び、分担して、ゴリゴリ進めていきたいです。 1. **プロトタイプGlide先発部隊(白澤さん隊長)** -- 最短で、Glideでプロトタイプを出すことを優先(UI的にも子どもにも優しい) -- とにかくまず、テストユーザーの教員・子どもに使ってみてもらえるように、触れるものを作りきる。 - 白澤さんサンプル：https://x62in.glideapp.io/ - 福田さんサンプル：https://qvd9d.glideapp.io/ 1. **機能・制約を確認する後続部隊(福田さん隊長)** -- Glideでできる限りの追加機能を試みる -- 印刷はできるようにするとか 1. **フルスクラッチ含め前広に考える後発部隊(吉沢さん隊長)** -- NuxtJSでガツンと作ることも含め、検討 - プロトの後は、「〇〇で作ります！」と宣言した、その技術に関心があるシビックテッカーは募ることができるので、開発スピードは早めていけるはずというポジティブな前提で - とはいえ、継続していくとなると保守作業も出てくるので、ある程度の仕組みは考えておきたい 1. **現状把握・分析(手が空いている人がいたら有志で)** -- 4/21から順次学校が学習計画表を作って、オンライン授業を模索したりしているところもあったり、空欄の計画表を出されて困っている親御さんもいるので、 -- お知り合いの保護者や教員に - 学習計画表をどう使っているか - 実際に家庭と学校でやりとりやコミュニケーションは取っているか（電話 or LINE or 訪問など) - 教員の感じる課題点・保護者の抱える課題点 この辺りをヒアリングしたり、アンケートしたりできると嬉しいです。(googleformなどでも電話で数件ヒアリングでも！) 1. **伝える系資料作り(林さんなど視覚情報作成得意な方)** -- 武貞が作ったドラフトもありますが、改めて、①今後のコントリビューター（協力してくれるエンジニアや関係者）②学校の先生達（特にリテラシーが低くても安心して使ってもらえるように③保護者・親御さん向け（どんな風に使うと何が便利なのか）とかが、伝わるように別途ver.2.0などを作成いただけると助かります！ - 関連する意見・情報の補足 -- Glideに入れるスプレッドシートの項目について 教員小池さんより回答 「まずは小学校ベースという前提であれば、項目名は子ども目線になると良いです。そうすれば不慣れな大人(ICTなれてない教員や保護者など)も各項目の意図がわかるはずなので…。(各項目長いので、UI設計等加味してご検討ください) - 「内容」は、「準備するもの」へ(=学習にあたって必要な教科書・教材) - 「詳細」は、「やること」へ(=準備したものをどうするか) - 「目的(コメント)」は、「先生からお家の人へ」へ(=家の人が書けないとなりそうだがひとまず…) -- NHK for Schoolのデータ - yahooキッズに問い合わせ中。やや古いデータではあるが、過去にyahoo側が人力で学習指導要領項目からNHKコンテンツに紐付けしたものがあるので共有できるはずとのこと。(5/2 12時時点では返信待ち) ### 夕方報告会 (18:00) #### 本日の進捗 - プロトタイプGlide先発部隊 - コンテンツを編集出来る版を作成し、編集可/不可 2アプリをテスト用に用意 - 独自アイコン作成 - [Glide Organizations](https://www.glideapps.com/orgs) の検証 (共同編集がどこまで有効か確認) - org内でアプリケーションを共有出来る - アプリケーションの同時編集は不可 - リンク先のGoogleシートへのアクセス権限が無い場合は編集不可 - (Glide版の)機能・制約を確認する後続部隊 - Glide > Zapier > PDFMonkey でPDF出力出来そう - URL叩けば画面上に時間割を表示出来るサービスを実装した - フルスクラッチ含め前広に考える後発部隊 - UIデザイン検討中 - [covid\-edu – Figma](https://www.figma.com/file/JBcf0nDLMqOyS5vffbZtvw/covid-edu) - 個人GitHubに公開リポジトリを用意 - [Nekoya3/StudyAtHome](https://github.com/Nekoya3/StudyAtHome) - 最新版(当日の状態ではなく、アクセスした時点の最新版です) - [StudyAtHome \- StudyAtHome](https://studyathome.web.app/) - 現状把握・分析 - 参加者間で作業しながら雑談にて共有 - 伝える系資料作り - 紹介用の画を描いた ![image glide実装図](https://i.imgur.com/EbAmDGx.png) #### Glide版レビュー - ユーザーテストに向けて使い方をまとめておかないと - 現バージョンであれば説明一切不要で使えると思われる - 動画URLが複数設定出来るようになっていると良い - 各項目1つしか設定出来ない状態よりも1つでも同種のデータが複数ある項目があると印象が良いと思う - 単元などのデータが空の状態で1から登録出来るものがあると良いかも #### Nuxt版について (若干抽象的に記録します) - システム構成についての議論 - 設置する環境によって外部との通信制限などの理由でアクセス出来ないこともあるだろう - まずはより広く利用して貰えることを最優先して開発を進める方が良い - 将来的にオンプレで動作するようなものになればクローンを閉じた環境において公開するようなことも出来るかも知れない #### Glide版ユーザーテストに向けて - 協力頂ける先生方によるテストに先立って、Slackチャネルにいる方々に使ってみてもらいたい(しらさわ) - Glide上の公開するアカウントはCfJのものにするか? - 実質別アカウントで作成し直すことになる(copy出来るのでさほどの手間ではないかも) --- ## 4/25-5/2(もくもくデー)までの各担当の進捗共有はこちら： ##### プロジェクトメンバー contributer： - 若山大輔（NHK制作局） - 田中瑞人（NHK制作局） - 武貞(c4Japan/LITALICO/大阪大学) - 白澤(code for Nagareyama) - 小池（教員） - ふくだ（機能実装の検討をしてくれています） - 林（UI/イラストなど作ってくれています） - 吉沢さん(今後の開発の仕方など検討してくれています) ##### こんな人にきて欲しい People needed： - 教育・子どもの支援に興味がある - まず手を動かして、考えながら作りたい - 教育のデジタル推進に寄与したい ##### Slack - CfJ Slack の [#covid19\_edu](https://app.slack.com/client/T02FMV4EB/C0137MBH46L) - CfJ Slack 新規参加は [Join Code for Japan on Slack! ](https://cfjslackin.herokuapp.com/) ##### 4/25ハックデーでの取り組み Outcome： - デザイン - データソース整備 - 実装方法の検討 - 現候補 - [AppSheet](https://www.appsheet.com/) - [Glide](https://www.glideapps.com/) - AppSheet版 実装 - Glide版 実装 ![おうちで時間割](https://i.imgur.com/T2k7cjA.png) ![](https://i.imgur.com/eOeBJ5U.png) 1. [ワイヤー by林さん](https://docs.google.com/presentation/d/1-e-hKXnZi0CX44CISVICn750-ZGw-aI78QkjQLNqmZY/edit?usp=sharing) 3. [サンプルデータ時間割データ by 白澤さん](https://docs.google.com/spreadsheets/d/1r3d3VEV9bZGaw-9yF7q9ajgUzpkBc3q1xTdlPzzz79A/edit) --- ## 4/25ハックデー [https://hackmd.io/jeARID_0SESEtas5-ZDLcQ#④コロナ休校期間の家庭学習カリキュラムサポート](https://hackmd.io/jeARID_0SESEtas5-ZDLcQ#%E2%91%A3%E3%82%B3%E3%83%AD%E3%83%8A%E4%BC%91%E6%A0%A1%E6%9C%9F%E9%96%93%E3%81%AE%E5%AE%B6%E5%BA%AD%E5%AD%A6%E7%BF%92%E3%82%AB%E3%83%AA%E3%82%AD%E3%83%A5%E3%83%A9%E3%83%A0%E3%82%B5%E3%83%9D%E3%83%BC%E3%83%88) --- ## プロジェクト概要 ### 緊急事態宣言に伴う休校期間の家庭学習カリキュラムサポート 公開スライド１：[おうちで時間割\_0428シビックテック車座会議\#1\(公開\) \- Google Slides](https://docs.google.com/presentation/d/1NKMZ_u7owKeG0aCC9RxoGwuRvHtvwu-mY_0vRGK6ZBU/) 公開スライド２：[おうちで時間割\_0515シビックテックライブ(公開)](https://docs.google.com/presentation/d/11UeFTOhXcYTzl7ZFPRU4drXxLVXtdio8vFAdPJsKtlo/edit?usp=sharing) #### 背景 background： 2/27に決定し、3/2に始まった臨時休校開始から約２ヶ月。子ども達は自宅待機、保護者は在宅ワークや休校中の子どもの対応で精一杯な状態です。 中高生や小学校高学年で受験などの目的が明確なお子さん達は学習時間が増える中、小学校（特に低学年）の家庭学習のサポートが急務となっています。 OECDのPISA2018調査によると、自宅にネット環境が整っているのは約６割、共有PCがあるのも約６割、自分で使えるPCがあるのは3%程度とも言われています。 そんな中、[4/21に文科省より出された通知](https://www.mext.go.jp/content/20200421-mxt_kouhou01-000004520_6.pdf)で、各教育委員会・学校は「学習計画表」「学習予定表」など週次での時間割を配布することが求められました。しかし、PDFをホームページに掲載したり、紙で配布されるのみで、デジタルコンテンツへのアクセスに障壁があります。 例： [学習予定表(品川):コンテンツ記載あり]( https://school.cts.ne.jp/data/open/cnt/3/1647/1/2nen.pdf?20200422113446), [学習計画表(横浜):空欄](https://www.edu.city.yokohama.lg.jp/school/es/nakagawanishi/index.cfm/1,2019,c,html/2019/20200310-170700.pdf) ##### プロジェクト概要 Overview： ・上記背景より、「スマホで」「簡単に」教材にアクセスすることをサポートするツールの開発を急ピッチで進めています。 このプロジェクトの発起人でもある田中さんのご提案から、NHK for Schoolのコンテンツはリンクとして使うことができます（学校や文科省もNfSコンテンツを推奨）し、今後はその他の動画リンクを埋め込んだ学習予定表や宿題シートを、先生や親が簡単に作って発行できるようにしたいと考えています。 ・NHK for Schoolは、小学校・中学校・特別支援学校の教科学習に適した動画教材およそ9000本を、学習指導要領に沿った形で提供しているが、そもそも教員が使って学校内の授業で見せるための設計なので、それを「宿題」や「時間割」に埋め込む方法がなく、多くの子どもが適切な動画にアクセスできていない可能性が高い。 ・先生や親が子どもに見せたい動画を簡単に探すことができ、簡単にカリキュラムに埋め込める＝子どもが簡単に開ける仕組みをつくりたい。また学習した後に、子どものログを紙で印刷して学校に提出できるようにしたい。
Published on HackMD
821