タイトル

開講年度 開講学部等
2026 国際総合科学部
開講学期 曜日時限 授業形態 AL（アクティブ・ラーニング）ポイント
前期 火7～8   10.0
時間割番号 科目名[英文名] 使用言語 単位数
1091011087 科学技術論演習Ⅲ(通態情報学)[Science and Technology Seminar III] 日本語 2
担当教員（責任）[ローマ字表記] メディア授業
杉野 弘明[SUGINO Hiroaki] ー
担当教員[ローマ字表記]
杉野 弘明　[SUGINO Hiroaki]
特定科目区分 STEAM関連科目 対象学生   対象年次 3～
ディプロマ・ポリシーに関わる項目 カリキュラムマップ(授業科目とDPとの対応関係はこちらから閲覧できます)
授業の目的と概要
本講義では、コードをただ「読む」「書く」だけでなく、試行錯誤を回せる思考様式を身につけることを目的とする。また、コンピュータを単に使う存在から、構造を理解し、自ら設計できる存在へと成長するための基礎を養うことも狙う。講義と演習の組み合わせによって、プログラミングを技能として習得するだけでなく、アルゴリズムやオブジェクト指向、関数型思考などの考え方を通じて「コードで世界をどのように切り取り、変形できるのか」を体験的に学ぶ。HTML/JavaScript を中心に、アルゴリズム、オブジェクト指向、API 接続などの基礎を体験的に学び、最小限のWebプロトタイプを自立して設計・実装できる力を育む。
本講義独自に設定された学生の到達目標は以下の通り：
１）HTML/JS の基本構造を理解し、単体のWebページを自力で作成できる。
２）アルゴリズム／関数型／オブジェクト指向の基礎を説明・実装できる。
３）API や外部データを接続し、可視化・操作できる。
４）失敗ログを通じて、試行→分析→調整の学習サイクルを言語化できる。
授業の到達目標
地域社会や国際社会、様々な規模・地域において多様な課題が生じている。これらの社会的な課題対し積極的に関与するには、科学・技術や文化・社会など幅広い知識とそれらを総合的に活用し、情報収集や問題点の整理、更に適切な課題の設定と解決へとつながる実践力が求められる。本科目では、そのための科学技術に関わる基本的な知識や技術の習得と共に、科学技術と社会が関わる諸問題に対する自発的な疑問と思考を育み、課題解決に向けて積極的に関与するための実践的な基盤を育むことを目的とする。
授業計画
【全体】
本講義では、コードを書くことを単なる技術習得としてではなく、構造を身体的に理解し、試行錯誤を通じて思考を鍛えるプロセスとして位置づける。前半では、アルゴリズムや問題の切り分け、HTML・CSS・JavaScriptの基礎、p5.jsによる生成的表現、オブジェクト指向および関数型思考などを段階的に扱い、プログラムの構造と振る舞いを体験的に学ぶ。中盤では、API接続やデータ操作、デバッグの方法を通じて、外部世界とコードを接続する実践力を養うとともに、失敗ログの記述を通して「試行→分析→調整」の学習サイクルを内面化する。後半では、マルチモーダル変換や小規模ツール制作に取り組み、コードを用いて自らの発想を形にする経験を積む。最終的には、最小限のWebプロトタイプを自立して設計・実装できる基礎的素養を身につけることを目標とする。
項目 内容 授業時間外学習 備考
第1回 ガイダンス：コードとは何か - コード＝命令・構造・抽象化
- Sequence / Condition / Loop の概念
- 疑似コーディング演習 		講義内容の予習（目安：2時間）
第2回 アルゴリズムと問題の切り分け - ソーティングの可視化
- “Order your friends with code” ワーク
- 問題分解（Decomposing tasks） 		講義内容の予習と復習（目安：3時間）
第3回 HTML基礎：構造をつくる - 基本タグとDOM
- テキスト／画像／リンクの配置
- 最初のWebページ公開 		講義内容の予習と復習（目安：3時間）
第4回 CSS：見た目の設計 - レイアウトとボックスモデル
- カラーコードクイズ
- パラメータ思考（値が振る舞いを変える） 		講義内容の予習と復習（目安：3時間）
第5回 JavaScript入門 - 変数／関数／イベント
- ボタンで動くインタラクション
- コンソールでのデバッグ 		講義内容の予習と復習（目安：3時間）
第6回 p5.js：生成的グラフィックス - 図形描画とアニメーション
- パラメータによる変化
- ミニビジュアル作品制作 		講義内容の予習と復習（目安：3時間）
第7回 オブジェクト指向 - Object / Property / Method
- カプセル化・継承・多態性（概念レベル）
- 複数オブジェクトの挙動設計 		講義内容の予習と復習（目安：3時間）
第8回 関数型思考と変換 - 純粋関数
- map / filter の概念
- データ変換演習 		講義内容の予習と復習（目安：3時間）
第9回 APIとデータ接続 - APIとは何か
- fetch と JSON
- 外部データの可視化 		講義内容の予習と復習（目安：3時間）
第10回 デバッグとBackprop的学習 - エラーの種類
- Trial → Analysis → Adjustment
- 失敗ログ①提出 		講義内容の予習と復習（目安：3時間）
第11回 機械の分解と構造理解 - 小型ガジェット分解
- CPU & GPU の概念
- ハードとソフトの対応関係 		講義内容の予習と復習（目安：3時間）
第12回 マルチモーダル実験 - データ→音（Strudelなど）
- テキスト→ビジュアル
- クロスモーダル変換 		講義内容の予習と復習（目安：3時間）
第13回 ミニツール制作 - Web上で動く小さなツール設計
- UI改善
- ピアレビュー 		講義内容の予習と復習（目安：3時間）
第14回 改良・リファクタリング - コード整理
- 可読性の改善
- 発表準備 		講義内容の予習と復習（目安：3時間）
第15回 ミニ・デモデイ - ツール発表
- 失敗ログ共有
 		講義内容の予習と復習（目安：3時間）
第16回 総括 - 講義総括
- 最終レポートに向けた議論 		講義内容の復習（目安：1時間）
※AL（アクティブ・ラーニング）欄に関する注
・授業全体で、AL（アクティブ・ラーニング）が占める時間の割合を、それぞれの項目ごとに示しています。
・A〜Dのアルファベットは、以下の学修形態を指しています。
【A：グループワーク】、【B：ディスカッション・ディベート】、【C：フィールドワーク（実験・実習、演習を含む）】、【D：プレゼンテーション】
A: 20%　B: 20%　C: 40%　D: 20%
成績評価法
本講義では、クラス内活動と、実践演習の成果、およびプレゼンテーションに基づいて評価を行う。
クラス内活動30％、実践演習の成果50％、プレゼンテーション20％
教科書にかかわる情報
備考
教科書は用いずに適宜資料を配布する。
参考書にかかわる情報
参考書 書名 CODE : コードから見たコンピュータのからくり ISBN 9784296080243
著者名 Petzold, Charles, 1953-,酒匂, 寛, 1958-,チャールズ・ペゾルド 著,酒匂寛 訳 出版社 日経BP 出版年 2024
参考書 書名 アルゴリズムとデータ構造 ISBN 9784000103435
著者名 石畑清 [著] 出版社 岩波書店 出版年 1989
備考
参考資料は必要に応じて講義中に共有または配布する。
メッセージ
キーワード
計算機社会、ユーザーインターフェース、UX、計算機科学、情報学
持続可能な開発目標（SDGs）

  • 質の高い教育をみんなに
  • エネルギーをみんなに そしてクリーンに
  • 住み続けられるまちづくりを
  • つくる責任つかう責任
  • パートナーシップで目標を達成しよう
(教育)すべての人に包摂的かつ公正な質の高い教育を確保し、生涯学習の機会を促進する。
(エネルギー)すべての人々の、安価かつ信頼できる持続可能な近代的エネルギーへのアクセスを確保する。
(持続可能な都市)包摂的で安全かつ強靱（レジリエント）で持続可能な都市及び人間居住を実現する。
(持続可能な生産と消費)持続可能な生産消費形態を確保する。
(実施手段)持続可能な開発のための実施手段を強化し、グローバル・パートナーシップを活性化する。
関連科目
Human Computer Interaction、社会科学情報処理入門、社会科学情報処理応用、ICT演習、コンピュータグラフィックス、人工知能論
履修条件
連絡先
教員居室：教育学部C棟2階209号室
内線：5525
E-mail：hsugino [at] yamaguchi-u.ac.jp
オフィスアワー
特に設けていません。必要があれば小さな質問でも構いませんので、いつでも連絡してください。メールでのお問い合わせも可能です。事前にアポを取ってもらえると助かりますが、ふらっと教員室に来て頂いても構いません。教員室に在室中は、ウェブ会議を行っている等を除き、できるだけ対応いたします。

ページの先頭へ