#author("2026-06-29T12:41:35+09:00;2026-06-29T11:24:03+09:00","default:inoue.ko","inoue.ko") #author("2026-06-29T14:48:03+09:00","default:inoue.ko","inoue.ko") *[[情報デザイン演習IIA]]|2026 &small(情報デザイン専攻|前期 月曜3・4限|デジタルラボ503); __[[受講生一覧>https://design.kyusan-u.ac.jp/socialdesign/?%E6%83%85%E5%A0%B1%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E6%BC%94%E7%BF%92IIA]]__|__[[汎用シート>https://docs.google.com/spreadsheets/d/1CDpZv8N5oCXvCUtSnA6r4Asyvrq4udZlYWtu_dRsw24/edit?usp=sharing]]__ __[[臨時|CommentScreen>https://commentscreen.com/comments?id=WKTY3TQ0rtwLB9a8VPRo]]__ ~ ~ **第11回|2026.06.29 第1Qと同様に進行します。今回はテストの段階。プロトタイプに対する意見聴取を行います。 ~ ***意見・感想を聴取する準備 それぞれのプロジェクトのプロトタイプについて、全員からコメントをもらうため、何らかの方法を検討し、自身のページのメインビジュアルの下にリンクを配置してください。今回は、Googleフォームの利用も可とします。 -Googleスプレッドシート(共同編集方式) --名簿部分のデータには、以下の一覧の氏名の列をご利用下さい。 --__[[汎用シート>https://docs.google.com/spreadsheets/d/1CDpZv8N5oCXvCUtSnA6r4Asyvrq4udZlYWtu_dRsw24/edit?usp=sharing]]__ -Googleフォーム(アンケート方式 ) ~ ***全員のプロトタイプを閲覧してコメント入力 以下から、受講生全員のページを確認して、シートあるいはフォームへコメントを入力して下さい。全員分の評価入力を終えたら、あとは自由・・です。 -__[[受講生一覧>https://design.kyusan-u.ac.jp/socialdesign/?%E6%83%85%E5%A0%B1%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E6%BC%94%E7%BF%92IIA]]__ ~ ***進捗記録にコメントを整理 次回までに意見を整理して、次の作業に着手できるよう準備して下さい。 以下、あくまでも記載例です。このとおりに書く必要はありません。 **2026.06.29 ***見出された問題点 -◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ ~ ***好評を得た点 > プロジェクトの特性として -◯◯◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ ~ ~ ~ ***再度、プロトタイプについて プロトタイプは、本来「試作品」レベルのものです。短期間の演習のため、サイトマップや台割といった、設計段階のものでも相互評価(テスト)にかける展開となっていますが、時間的に余裕のある展開であれば、プロトタイプのテストでは、実際にアクセス可能なWebサイトや、冊子の状態になったものを提示して評価をしてもらうのが理想です。また、これは1回限りではなく、プロトタイプ → テスト → プロトタイプの修正 → テスト・・と複数回も繰り返してブラッシュアップするのが普通です。期間が短いことから、実際のプロジェクトの進め方と比較すると「略式の展開」となっていることをご了承下さい。 ~ ~ **第10回|2026.06.22 第1Qと同様に進行します。本日は、プロトタイプの制作です。 ~ ***プロトタイピング プロトタイピングの目的は、アイデアに対するユーザーの反応を見ることにあります。構想中のアイデアの「全体像」がある程度具体的なカタチになることで、ユーザーから様々な感想を得ることができます。要点は・・・ -これは何? アイデアの全体像がわかるようにつくる -極力短時間・少資源でつくる -簡単に修正できるようなものにする(つくり込みすぎない) -プロトタイプによって確認したいことを明確にしておく --情報の構造(構成)についての意見が欲しい > サイトマップ、台割等を作る --色・カタチやレイアウトについて意見が欲しい > 具体的なサンプルページをひとつ作る(内容はダミー) --操作性について意見が欲しい > インターフェイス部分を再現したサンプルをつくる(内容はダミー) ~ ***進捗報告の記載 以下の雛形を 学科サイトの個人ページ に、コピー&ペーストするかたちで、今週の進捗報告を記載する枠組み用意して下さい。 **2026.06.22 ***今回制作したプロトタイプ 画像等を掲載して下さい。 ~ ***プロトタイプの説明 -◯◯◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯、◯◯◯◯◯◯ ~ ~ ~ ***意見・感想を聴取する準備 それぞれのプロジェクトのプロトタイプについて、全員からコメントをもらうため、何らかの方法を検討し、自身のページのメインビジュアルの下にリンクを配置してください。例えば・・・ -Googleスプレッドシート(前回同様、相互の書き込みが見えます) -Googleフォーム(アンケート方式) ~ 意見聴取は、次回 6月29日の授業時間内に一斉に行います。意見をもらえるよう、テーマの概要等を記載するとともに、プロトタイプに相当する情報の掲載を次回までに確実に遂行するよう、お願いします。 ~ ***補足:サイトのメニュー構成に悩むときは・・・ サイトマップ(メニュー構成)の設計は簡単ではありません。プロトタイプのテスト後に必ず修正が入る・・という前提で進めて下さい。以下、情報をどのように整理すればよいか、そのヒントとなるキーワードです。 -5つの帽子掛け &small(情報整理の視点 リチャード・ソール・ワーマン); --''カテゴリー'':ジャンル別分類 > 例:[[生命科学部>https://lifescience.kyusan-u.ac.jp/main/]] --''時間'':年表、スケジュール、番組表 > 例:[[Lyricism>https://hinata0720.github.io/Lyricism/]] --''位置(空間)'':地図 > 例:[[Graffiti Map>https://atleti-07.github.io/Graffiti-Map-01/]] --''アルファベット順'':五十音順、番号順など > 例:百科事典・辞書的サイト --''連続量・階層'':人気順、価格順など > 例:ショッピングサイト -''5W2H'' &small(新聞記事の必須項目); --What:これは何? --Why:何のために / なぜ? --When:いつ --Where:どこで --Who:誰が、誰に --How:どのような方法で --How much:費用(予算)は -AIに聞く ◯◯についてまとめたWebサイトを作成します。 どのように情報を整理したらよいか、サイトマップのかたちで提案して下さい。 ~ ~ **第9回|2026.06.15 第1Qと同様に進行します。本日は、現状分析と課題定義、アイデア出しです。 ~ ***はじめに テーマ、成果物の仕様を、以下のシートに記入して下さい。 __[[汎用シート>https://docs.google.com/spreadsheets/d/1CDpZv8N5oCXvCUtSnA6r4Asyvrq4udZlYWtu_dRsw24/edit?usp=sharing]]__ ~ ***現状分析 あなたが取り組もうとしているプロジェクトについて、以下のような現状の調査・分析を行って、課題を定義して下さい。 -プロジェクトテーマと同様の''「テーマ内容」に関する先行事例''を探す。 -プロジェクトの成果物の''「表現形式」に関する先行事例''を探す。 -プロジェクトのテーマに関わる''「時間的情報(歴史)」''を調査する -プロジェクトのテーマに関わる''「空間的情報(地理)」''を調査する -プロジェクトのテーマに関わる''「技術」''について調査する ~ ***課題を整理する 現状の調査が終了して、ある程度予備知識がついたところで、プロジェクトの遂行にあたって「解決すべき課題」を整理して下さい。 -公開方法 -成果物のネーミング -成果物の形式(分量とサイズ) -成果物の構成 -素材(イラスト・写真・記事等)の入手方法・生成方法 -制作環境と方法 -その他、決める必要があるものをすべて「課題」として列挙する ~ ***アイデア出し アイデア創出(Ideate)は、定義された課題を解決するためのアイデアを量産する段階です。''質よりも量を重視して''、考え得るさまざまなアイデアを一旦書き出して、その後、方向性を絞り込んで下さい。 ~ ***本日の進捗記録の記載・公開 本日の日付を「中見出し」として、''現状調査の結果と解決すべき課題、さらに個々の課題に対する複数のアイデア''を箇条書きで記載して下さい。 **2026.06.15 ***現状分析 -◯◯◯◯◯◯◯◯◯◯◯◯◯、◯◯◯◯◯◯◯◯◯◯◯ -◯◯◯◯◯、◯◯◯◯◯◯◯◯◯◯◯ ~ ***課題定義 -1. ◯◯◯◯◯◯◯◯ -2. ◯◯◯◯◯◯◯◯◯◯◯ -3. ◯◯◯◯◯◯ ~ ***制作上のアイデア(課題ごとに複数のアイデア) -1. ◯◯◯◯◯◯◯◯◯◯◯◯◯、◯◯◯◯◯ --◯◯◯◯◯、◯◯◯◯◯◯◯◯◯◯◯ --◯◯◯◯◯、◯◯◯◯◯◯◯◯ -2. ◯◯◯◯◯◯◯◯◯◯◯◯◯ --◯◯◯◯◯、◯◯◯◯◯ --◯◯◯◯◯、◯◯◯◯◯◯◯◯ -3. ◯◯◯◯◯◯◯◯◯◯◯◯◯、◯◯◯◯◯◯◯◯◯◯◯ --◯◯◯◯◯、◯◯◯◯◯◯◯◯◯◯◯ --◯◯◯◯◯、◯◯◯◯◯◯◯◯◯ ~ ~ ~ ~ **第8回|2026.06.08 ***はじめに -前半7週の演習の振り返り -個人ページ [ 氏名/情報デザイン演習IIA ] の整理・問題の除去 -重要:__[[学科サイト Web公開ガイドラインについて>https://design.kyusan-u.ac.jp/socialdesign/?%E7%89%B9%E8%A8%AD/Web%E3%82%AC%E3%82%A4%E3%83%89%E3%83%A9%E3%82%A4%E3%83%B3]]__ ~ ***後半7週間のガイダンス -前半と同様の進行で、新たなテーマに取り組みます。 -新たな個人ページ [ 氏名/情報デザイン演習IIA_02 ] を使用します。 ~ ***後半のテーマ設定について -自分自身の関心事(あるいは問題意識)を可視化する -成果物の仕様(電子冊子、映像、Webサイト等・・サイズ・量) -自身のスキルアップにタイムリーなテーマ -付記:グループプロジェクトもOKです。 その場合、タイトル・サブタイトル、背景と目的等の部分は、全員共通の内容を記載し、メンバー一覧を書くとともに、役割分担を明確にして下さい。また、進捗報告は、それぞれの作業内容を記載して下さい。 ~ ***本日の演習 -テーマタイトル・サブタイトルの書き込み -決まった方から報告 > __[[汎用シート>https://docs.google.com/spreadsheets/d/1CDpZv8N5oCXvCUtSnA6r4Asyvrq4udZlYWtu_dRsw24/edit?usp=sharing]]__にテーマの書き込み -進捗報告の部分は以下のように・・最終候補を太字で **2026.06.08 ***テーマ候補 -◯◯◯◯◯◯◯◯◯◯◯ -''◯◯◯◯◯◯◯◯◯◯◯◯◯'' ← 太字になります。 -◯◯◯◯◯◯◯◯◯◯◯◯◯ ~ ***成果物の仕様 -形式:◯◯◯◯◯◯ -サイズ:◯◯◯◯◯◯◯ -分量:◯◯◯◯◯◯ ~ ***参考リンク -◯◯◯◯◯◯◯◯◯◯◯◯ -◯◯◯◯◯◯ ~ ***この演習を通して身につけたいスキル -◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ ~ ~ ~ ~ **第7回|2026.05.28 ***成果報告 第1クォータの成果報告です。質疑を含めて一人5分程度を想定しています。 __[[受講生一覧>https://design.kyusan-u.ac.jp/socialdesign/?%E6%83%85%E5%A0%B1%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E6%BC%94%E7%BF%92IIA]]__ -プロジェクトのタイトルとサブタイトル -プロジェクトの背景と目的 -成果物の紹介 --成果物の仕様 --制作の方法(使用したツール、素材、手順など) --今回のプロジェクトで特にこだわった部分、工夫した点など・・ -成果の振り返りと今後の課題 ~ ***次回以降について -第2クォーターも同様に展開します。新たな取り組みテーマについて早めのご検討をお願いします。 -以下を前提にご検討下さい。 --自身のスキルアップにタイムリーなテーマ --自分自身にとって強い関心事であること(趣味全開で構いません) ~ ~ **第6回|2026.05.25 ***はじめに -__[[CLノートの入力について>https://design.kyusan-u.ac.jp/socialdesign/?CL%E3%83%8E%E3%83%BC%E3%83%88]]__ -__[[汎用シート>https://docs.google.com/spreadsheets/d/1CDpZv8N5oCXvCUtSnA6r4Asyvrq4udZlYWtu_dRsw24/edit?usp=sharing]]__ に、以下の内容を記載して下さい。 --タイトル・サブタイトル --成果物の形式(Webサイト、PDF冊子など) --相互評価実施の有無(完了、受付中、未設定・・など) --成果報告実施の有無(この列は、第7回に入力します) ~ ***今回の演習について 前回同様に進捗状況をメモとして残して下さい。 **2026.05.25 ***作業の記録 -◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ ~ ***MEMO(ToDo項目など) -◯◯◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯、◯◯◯◯◯◯ ~ ***補足1 PDFを軽くする方法 配置する画像のサイズ等によっては、出力したPDFが異常に大きくなる場合があります。スムーズに閲覧してもらうべく、ファイルサイズがなるべく軽くなるよう工夫して下さい。ちなみに、以下の卒業研究概要集は、60ページ以上ありますが、ファイルサイズは 10MB程度です。 https://design.kyusan-u.ac.jp/PDF/Proceedings2026.pdf -Illustrator から PDF にする場合、 --PDFプリセットで、Illustrator初期設定ではなく、プレス品質、最小ファイルサイズ・・などの候補があるので、まずはプリセットの変更でどの程度ファイルサイズが変わるかお試しください。 --オプションで、Web用に最適化」にチェックを入れる、画像を指定解像度にまで圧縮する・・といった方法もあります。 |#image(images/ai2pdf01.jpg)|#image(images/ai2pdf02.jpg)| |Web用に最適化|画像の圧縮| -オンラインサービスを使う方法もあります。 [[Google:PDF圧縮 オンライン]] -配置画像のサイズ最適化(Illustratorファイル自体を最適化するために) --印刷(300dpi)時に10 cm (約4inch)になる画像の場合、単純計算で 4 x 300 = 1200px 程度ということになります。 --Photoshop で最適化する場合、イメージ > 画像解像度 から、 再サンプリング, 10cm, 300dpi と設定すれば、画素数が最適化されます。 ~ ***補足2 Lorem ipsum について 出版、Webデザインの分野において使用されている「ダミー原稿」です。文章原稿が実際のサイズで入力されることで、紙面の割り付けイメージを確認できます。以下、日本語のダミー原稿もWebから入手することができます。 __[[Google:Lorem ipsum]]__ ~ ***次回(28日 木曜)、成果報告(プレゼン)の準備 成果報告は一人5分程度で発表と質疑応答・・を想定しています。スムーズかつ的確な報告ができるよう、自身のページを整理しておいて下さい。 -プロジェクトのタイトルとサブタイトル -メインビジュアル(プロジェクトのイメージが視覚的にわかるもの) -氏名、キーワード -成果物へのリンク -背景と目的 他、概要部分の整理 ~ ***成果物の公開について -Webサイト:GitHub Pages / GoogleSites ・・ -PDF冊子:GitHub Repository / Google Drive 共有 / OneDrive 共有 -現物:撮影して学科サイトに直接掲載 ~ ~ **第5回|2026.05.18 ***はじめに -相互評価シートへのリンクは、各自のタイミングで無効化して下さい。解放したままにすると、悪戯の書き込み等が入る可能性があります。 %%相互評価シート%% ご協力ありがとうございました。 ~ ***第5・6回の演習について -各自のテーマで制作に集中する期間となります(第7回は成果報告)。 -この期間中にページの未記入の部分(目的・背景など)を埋めて下さい。 -同様に、ページの上部にプロジェクトのビジュアルを掲載して下さい。 -毎回、以下の形式で進捗記録を記載して下さい。 **2026.05.18 ***作業の記録 -◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ ~ ***MEMO(ToDo項目など) -◯◯◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯、◯◯◯◯◯◯ ~ ***補足講義 -[[紙面のレイアウトについて>Layout]] -[[Web制作のワークフローについて>WebDesign/Workflow]] ~ ~ **第4回|2026.05.11 ***はじめに -今回は TEST の段階です。それぞれのプロトタイプを相互評価するかたちで、第三者からの意見をもらい、その後のブラッシュアップにつなげます。 -次回以降 --第5、6回は制作を中心に行い、その間、1人1回進捗報告 --第7回は、第1Qの成果のプレゼンテーションです。 ~ ***本日の演習の流れ -1. 相互評価シートの作成とリンク掲載 -2. 他の受講生のページを順に閲覧し、評価シートにコメントを記載 -3. 次週までに・・ 参考となったコメントを本日の進捗記録部分に整理 -参考イメージ:__[[JohnSmith/情報デザイン演習IIA>https://design.kyusan-u.ac.jp/socialdesign/?JohnSmith/%E6%83%85%E5%A0%B1%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E6%BC%94%E7%BF%92IIA]]__ ~ ***テストについて テストは、プロトタイプを試用してもらうことで、ユーザーからのフィードバックを得るとともに、ユーザーの共感を高めるための段階です。 -テストは、「ユーザーがそれをどのように認知するのか」、また「ユーザーはそれに対してどのようなやふるまいをするか」を理解する機会です。 -テストは、ユーザーが生活している実際の環境の中で行うのが理想です。しかし、テストを実際の状況で実施できない場合(今回のような遠隔評価もそのケース)は、擬似的な環境でそれを追体験できるように工夫しましよう(例えば、あなた自身が実際にそれを扱う場面を動画で見せるなど)。 ~ ***テストの目的 -プロトタイプとアイデアを改善するため テストはプロトタイピングを繰返してアイデアを改善する目的で行います。 -ユーザーの認知や行動について理解するため テストは、観察と関わりを通して「共感」を構築する機会でもあります。また、予期せぬ「気づき」の機会でもあります。 -着眼点を見直すため テストは、私たちが問題を正しく捉えていなかったこと、また、正しい課題設定をしていなかったことを気づかせてくれる機会でもあります。 ~ ***テストの要点 以下の説明は、リアルにテストが実施できる場合の一般論です。 -プロトタイプは、ユーザーが評価を行うための説明資料としてではなく、ユーザーがリアルに反応できる体験素材として準備します。 -説明は行わず、とにかく「見せる」「触らせる」が重要です。 -ユーザーがプロトタイプを「自ら解釈する」時間を設けることが重要です。 -ユーザーがプロトタイプをどのように扱うか(どこで使い方を間違うか)、また、どのような反応をみせるかを「観察」しましょう。 -ユーザーがプロトタイプについて発した言葉や、ユーザーの発した疑問に耳を傾けましょう。 -ユーザーが「比較」できるように、複数のプロトタイプを試しましょう。比較をさせることで、潜在的なニーズが明らかになることがあります。 ~ ***相互評価シートの準備 それぞれのプロジェクトのプロトタイプについて、全員からコメントをもらうために Googleスプレッドシート(共同編集シート)を用意します。 ~ #image(GoogleDrive/fig1.png,right,30%) -1) Googleドライブにシートを作成 --マイドライブ上で、右クリック>新規スプレッドシート --__[[汎用シート>https://docs.google.com/spreadsheets/d/1CDpZv8N5oCXvCUtSnA6r4Asyvrq4udZlYWtu_dRsw24/edit?usp=sharing]]__から名簿をまるごとコピー&ペーストして、自分自身の行をグレーにして下さい。 --作成したシートを 右クリック > 共有 -- 「制限付き」を「リンクを知っている全員」に変更 #clear #image(GoogleDrive/fig2.png,right,30%) -2) 共同編集を可能にする --「閲覧者」を「編集者」に変更 #clear -3) 学科サイトからリンク --上記のダイアログ上で「リンクをコピー」をクリック --このリンクアドレスを以下の形式で貼ればOKです。 [[プロトタイプ評価シート>https://docs.google.com/sprea・・・sharing]] &color(red){この情報は、自身のページの上部の目立つ場所に記載して下さい。}; ~ ***次週までに・・進捗記録にコメントを整理 **2026.05.11 ***見出された問題点 -◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ ~ ***好評を得た点 > プロジェクトの特性として -◯◯◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ ~ ~ ~ ***参考 -冊子系の作品を外注製本する方法 --フォトブックの利用:https://photobook.kitamura.jp/ --一冊から格安製本:https://www.seichoku.com/ --本格的なネット印刷:https://www.printpac.co.jp/ -ページ物のデータの作り方 --https://www.printpac.co.jp/contents/technicalguide/index.html --https://printmall.jp/blog/archives/20210902/4635/ ~ ~ **第3回|2026.04.27 ***はじめに -各自の SubMenu に ''[ 氏名 ] /情報デザイン演習IIA_01'' を追加して下さい。 II の部分は、ローマ数字ではなく、大文字の [ I (アイ)] 2つです。 -受講生の方のログ(テーマ、アイデア)を確認します。 [[受講生一覧>https://design.kyusan-u.ac.jp/socialdesign/?%E6%83%85%E5%A0%B1%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E6%BC%94%E7%BF%92IIA]] -今後の予定 --第4回:テスト > 全員の取り組み、プロトタイプを相互評価 --第5回:評価結果の整理 > アイデアの更新 > 本制作へ --第6回:本制作 --第7回:成果報告 ~ ***プロトタイピングについて プロトタイピング(Prototyping)とは、実際に目で見て、手で触れることができるモノを作ること、ソフトウエアで言えば、入力から出力までの一連のプロセスを確認できる試作品を制作することを意味します。 プロトタイプ、モックアップ、試作品・・ざっくり言えば似たようなものです。 -''プロトタイピングの目的'' プロトタイピングの目的は、アイデアに対するユーザーの反応を見ることにあります。構想中のアイデアの「全体像」がある程度具体的なカタチになることで、ユーザーは「これが完成すれば面白い!」、「便利!」、あるいは逆に、「説明がわかりにくい」、「使いづらい」といった感想を持つことができます。プロジェクトメンバーが気付けなかった点について、ユーザー目線で直感的な意見をもらうことで、ディスカッションが活性化します。 --利用者(ターゲット層)にアイデアを具体的なカタチで説明するため。 --開発メンバー間でアイデアを具体的なカタチで見て議論するため。 --最小限の投資で''早期に多くの失敗を体験''するため。 -''プロトタイピングの要点'' --短時間でつくることができるものを使う --修正・改善しやすいものを使う --お金をかけずにつくる --利用者が全体を見て・触ることができるようにつくる(プロダクト) --利用者が全プロセスを体験できるようにつくる(Web・ソフトウエア) --プロトタイプで何を確認したいのかを明確にする ---大きさを確認したい > 大きさに忠実な模型を作る ---手触りを確認したい > 素材を忠実使う(さわる部分的のみ) ---操作性を確認したい > インターフェイス部分のみ再現(その他はダミー ~ ***進捗報告の記載 以下の雛形を 学科サイトの個人ページ に、コピー&ペーストするかたちで、今週の進捗報告を記載する枠組み用意して下さい。 **2026.04.27 ***成果物の仕様・プロトタイプ 画像等を掲載して下さい。 -◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ ~ ~ ***「成果物の仕様・プロトタイプ」の記載例 -冊子系プロジェクトの記載事例 #image(台割り.png) 台割りイメージ #image(表紙.png) 表紙イメージ -動画系プロジェクトの記載事例 #image(ストーリーボード.png) ストーリーボードまたは絵コンテ #youtube(ABCDEFG) 全体の流れがわかる 1分間のダイジェスト映像 #youtube(ABCDEFG) 技法についての試作映像 -Web系プロジェクトの記載事例 #image(サイトマップ.png) サイトマップ #image(ワイヤーフレーム.png) サイトのワイヤーフレーム https://xxxx.github.io/project/index.html サーバーの動作確認(プロトタイプサイト) ~ ***用語の参考イメージ -[[GoogleImage:台割]] -[[GoogleImage:束見本]] -[[GoogleImage:絵コンテ]] -[[GoogleImage:ストーリーボード]] -[[GoogleImage:サイトマップ]] -[[GoogleImage:Webサイト ワイヤーフレーム]] ~ ***仕様書・プロトタイプ等制作ツール -[[Figma>Google:Figma]]:Googleアカウントを利用してアカウント登録すると利用可能 -[[Draw.io>Google:Draw.io]]:GoogleDrive アプリケーションとして登録可能 -Spread Sheet:サイトマップ、台割りなど、セルを利用した図表の作成が簡単 ~ ~ **第2回|2026.04.20 ***はじめに __[[学科サイト個人ページ>https://design.kyusan-u.ac.jp/socialdesign/?%E6%83%85%E5%A0%B1%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E6%BC%94%E7%BF%92IIA]]__の以下の部分を記載して下さい。 -ページの MainTitle の部分に、自身のプロジェクトタイトルを記載 -その下の SubTitle の部分に「これは何か?」を1行で端的に記載 -概要部分(背景と目的以下)を順次記載 &small(いずれも現段階での「仮のもの」でOK。後日修正可です。); ~ ***現状調査(分析) デザイン思考のプロセスにおいて、現状の問題を見出し、何をどうするべきか、その課題を定義する・・という作業は非常に重要です。極端に言えば、課題が決まれば(あとはアイデアを考えて実行するだけなので)プロジェクトの大半はできたも同然です。 そこで、まずは、あなたが取り組もうとしているプロジェクトについて、以下のような現状の調査・分析を行って、最終的に「課題の定義」につなげて下さい。 -プロジェクトテーマと同様の''「テーマ内容」に関する先行事例''を探す。 自身の''テーマ内容''に近い情報提供を行っているサイトをWeb上で調査して、そのURLを報告記事として列挙して下さい。 -プロジェクトの成果物の''「表現形式」に関する先行事例''を探す。 //自身の選択したメディア(ポスター、冊子、映像、Web等)における''表現形式''として、参考となるURLを報告記事として列挙して下さい。 -プロジェクトのテーマに関わる''「時間的な問題(歴史)」''について調査する //プロジェクトのテーマに関わる「対象」、例えばテーマが「レシピ動画」であれば、料理の歴史、食材の歴史、調味料の歴史、調理器具の歴史・・といった歴史的な経緯、また食材の成長プロセス(時間経過パターン)、調理器具の製造プロセス、さらに調理にかかる時間など、動画に登場する具体的な対象について、その「時間的な側面」を様々な視点から調査して、情報を整理して下さい。 -プロジェクトのテーマに関わる''「空間的の問題(地理)」''について調査する //同様に、プロジェクトのテーマが「レシピ動画」であれば、食材の産地、流通経路、また食材や器具の「大きさ」、撮影時の被写体の「サイズ」など、動画に登場する具体的な対象について、その「空間的な側面」を様々な視点から調査して、その情報を整理して下さい。 -プロジェクトのテーマに関わる''「技術」''について調査する //プロジェクトの遂行にあたって、どんな機材や技術が必要になるか、例えば、同様にテーマが「レシピ動画」であれば、まずは、調理器具、調理方法について、そして照明・撮影機材について、また撮影と編集に関する技術、さらに動画編集ソフトウエアの使い方など、総合的な視点から、関係があると思われる技術的な知見を調べて、これを分類・整理して下さい。すべてを自分で書く必要はなく、その情報にたどり着くためのリンクをまとめる・・という発想で構いません。 ~ ***課題を整理する 現状の調査が終了して、ある程度予備知識がついたところで、プロジェクトの遂行にあたって「解決すべき課題」を整理して下さい。 -公開方法 -成果物のネーミング -成果物の形式(分量とサイズ) -成果物の構成 -素材(イラスト・写真・記事等)の入手方法・生成方法 -制作環境と方法 -その他、決める必要があるものをすべて「課題」として列挙する ~ ***アイデア出し アイデア創出(Ideate)は、定義された目的や方向性を実現するためのアイデアを量産する段階です。この段階では、ブレインストーミングや、アイデア創出技法を活用して、''質よりも量を重視して''、考え得るさまざまなアイデアを書き出してみます。 解決すべき複数の課題について、どれからでも構いません。着手しやすいものからアイデア創出を行なって下さい。何かひとつが決まると、そこから別の課題の方向性も自ずと絞り込まれていきます。 '''以下、アイデア創出に関わる一般的な知見、手法について紹介します。''' -ブレインストーミング(BS法: brainstorming) ブレインストーミングは、アレックス・F・オズボーンによって考案された会議方式のひとつで、みんなでアイデアを出し合う際に、相互の連鎖反応や発想を誘発する技法です。みんなが自由な発言の機会を得られるよう、ブレストを行う人数は、5 - 7名程度が望ましく、人数が多い場合は小グループに分けて、それぞれの成果を持ち寄る・・といったケースもあります。ブレストには、一般に以下のような原則があります。 --他者の発言を批判しない --判断・結論を出さない --荒削りな考えを歓迎する --質より量を重んじる --アイディアを編集して発展させる -KJ法 文化人類学者の川喜田二郎氏がデータをまとめるために考案した手法で、そのアルファベット頭文字をとって KJ法。ポストイットとマーカー、そしてホワイトボードを使って、以下のように情報を整理していく手法で、おそらくみなさんも総合学習の時間等で経験したことがあるかと思います。 --ポストイット1枚に対して絵や字で1つのアイデアを書く --たくさんのポストイット=アイデアをホワイトボードに貼る --全体を眺めながら、それを貼り替えて、グルーピング --アイデアのカテゴリーや方向性を絞り込んでいく・・ --参考事例 ---[[KJ法のイメージ>GoogleImage:KJ法]] ---https://goodpatch.com/blog/ideation-workshop/#i-5 -AIの活用 最近は、ブレーンストーミングの段階で、AIにタタキ案を作成させることで、アイデアの抜けを防止する・・というのが一般的です。 ~ ***本日の進捗記録の記載・公開 本日の日付を「中見出し」として、''現状調査の結果と解決すべき課題、さらに個々の課題に対する複数のアイデア''を箇条書きで記載して下さい。 **2026.04.20 ← 中見出し ***現状調査(先行事例等) ← 小見出し -◯◯◯◯◯◯◯◯◯◯◯◯◯、◯◯◯◯◯◯◯◯◯◯◯ -◯◯◯◯◯、◯◯◯◯◯◯◯◯◯◯◯ ~ ***解決すべき課題(ToDoリスト) -1. ◯◯◯◯◯◯◯◯ -2. ◯◯◯◯◯◯◯◯◯◯◯ -3. ◯◯◯◯◯◯ ~ ***制作上のアイデア(課題ごとに複数のアイデア) -1. ◯◯◯◯◯◯◯◯◯◯◯◯◯、◯◯◯◯◯ --◯◯◯◯◯、◯◯◯◯◯◯◯◯◯◯◯ --◯◯◯◯◯、◯◯◯◯◯◯◯◯ -2. ◯◯◯◯◯◯◯◯◯◯◯◯◯ --◯◯◯◯◯、◯◯◯◯◯ --◯◯◯◯◯、◯◯◯◯◯◯◯◯ -3. ◯◯◯◯◯◯◯◯◯◯◯◯◯、◯◯◯◯◯◯◯◯◯◯◯ --◯◯◯◯◯、◯◯◯◯◯◯◯◯◯◯◯ --◯◯◯◯◯、◯◯◯◯◯◯◯◯◯ ~ ~ ~ ***最終的に -採用するアイデアを太字で強調 文字列を ' ' ( SingleQuotation x 2 )で囲むと、''強調表示'' になります。 -採用しないものは、取り消し線 文字列を % %( Percent x 2 )で囲むと、%%取り消し線%%がつきます。 ~ ***補足講義 -冊子の制作について --Illustrator で複数ページ:https://creators-plus.jp/illustrator-pdf/ --Adobe InDesign を使う:https://www.adobe.com/jp/learn/indesign -Webサイトを作成公開する方法について --GoogleSiteの利用 > [[GoogleSites]] --HTML+CSS によるコーディング + GitHubPages あるいはレンタルサーバーへアップロード公開 --WordPress(ブログサイト)の利用 > [[WordPress]] ~ ~ **第1回|2026.04.13 ***科目概要 本科目、演習Aは「情報とメディアの歴史、原理、構造、機能についての「理解」を深めるとともに、ソーシャルデザインの観点から新たな情報環境の構築に関するデザイン提案を行う」ことを目的とした科目です。 ソーシャルデザインは「自分ゴト」から・・とよく言われます。1年次の演習では半径3m - 10m、2年次は半径100m、3年次は半径10km(地域社会)へと、徐々に活動範囲を広げることをイメージしています。 ~ ***演習テーマ1|第1週 - 第7週 &scale(160){''半径 100m の「 面白い! 」''}; -未だ「情報化」されていない、「面白そうなもの」を、最適な情報媒体を選んで「情報化(見える化)」する・・というのがこの演習の趣旨です。 -現在のあなたの生活拠点から半径100mあたりを目処に、調査・撮影・録音・録画等が可能な「ヒト、モノ、場所、コト」を探して下さい。 ~ ***求める成果物 選ぶテーマによって、公開に適した媒体は異なります。紙媒体、映像媒体、Web媒体、あるいはイベントのような時限つき「場」の提案。成果の最終形態(公開情報)は ''以下のいずれでも構いません(組み合わせも可)''が、成果物に至る過程で必要となるソフトウエア等が利用できるか否か、そのあたりもふまえて、方針を決めるようにして下さい。 -ポスター(グラフィック中心) -PDF冊子(文章とグラフィックス) -映像 -音楽・音声 -Webサイト -イベントの開催 ~ ***参考事例 以下、昨年の先輩のプロジェクトの成果です。 -[[情報デザイン演習IIA/2025>https://design.kyusan-u.ac.jp/socialdesign/?%E6%83%85%E5%A0%B1%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E6%BC%94%E7%BF%92IIA/2025]] ~ ***演習に必要なツール 各自のテーマに応じて、なるべくシンプルなツール(お金をかけずに準備できるもの)を使って下さい。演習A は「考える」ことに重きを置くので、ツールは何でも構いません)。 パソコンが無い方は、スマートフォンのアプリ上で制作できるものでも構いません。さらに言えば、成果物がアナログ手作業のものでもかまいません(最終的に学科サイト上に写真等が掲載できればOKです)。 -情報収集ツール --カメラ --筆記具(アナログ、デジタルを問いません) -アイデア創出・プロトタイプ制作・本制作のためのツール --紙と鉛筆、[[FieldNote>GoogleImage:KOKUYO Field Note]]、スケッチブック等 --GoogleDrive連動アプリ、[[Figma>https://www.figma.com/]] 等の活用 --画像処理、図形描画、映像編集、Web制作、生成AI等 -情報公開のためのツール --[[学科サイトの個人ページ >https://design.kyusan-u.ac.jp/socialdesign/?%E6%83%85%E5%A0%B1%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E6%BC%94%E7%BF%92IIA]] にて公表 ~ ***演習の進め方 __[[デザイン思考>DesignThinking]]__のプロセスに沿って進めます。 -1. テーマ設定(共感) -2. 現状分析(調査・問題定義) -3. アイデア創出 -4. プロトタイピング -5. テスト(中間発表) > プロトタイプの改善(4に戻って繰り返し) &small(「テスト」というのは、プロトタイプを試用する・・という意味で、「中間試験をします」という意味ではありません。); -6. 実装 > 実運用 -付記:テーマ設定の段階から情報を共有(公開)します。 ~ ***本日の演習 -テーマの候補を複数挙げて、その中から1つを選定します。 -3限目の時間は、__[[学科サイト個人ページ>>https://design.kyusan-u.ac.jp/socialdesign/?%E6%83%85%E5%A0%B1%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E6%BC%94%E7%BF%92IIA]]__の「進捗報告 2026.04.13」 の部分に、テーマの候補を複数、また参考となるリンク等を掲載してください。 -4限目にそれぞれのテーマ候補を見て意見交換し、テーマを絞り込みます。 ~ ***本日分のイメージ **2026.04.13 ***テーマの候補 - - - ~ ***参考リンク - - ~ ~ ~ ***参考 最も簡単にWebサイトを構築・公開する方法について > __[[GoogleSites]]__ ~ ~ ~ **成績評価・単位認定について ***単位認定に必須の要件 -個人ページにプロジェクトの概要と作業記録がすべて記載されていること。 -成果物を公開していること。 -付記:受講生それぞれの過去の経験値が異なることを前提に、作品のクオリティに関する評価は +α 部分とします(要件を満たしていれば A)。 ~ //***参考:シラバス上の表記 //-コンピテンシー((コンピテンシーとは、職務や役割において優秀な成果を発揮する行動特性を意味します。教育現場でこの言葉を使うときは、当該授業で育成する資質や能力のことを意味します。)) //--課題や目的に沿って、必要な情報を収集・整理できる(情報収集力) //--自らの思考・判断のプロセスを説明し、伝達するためのプレゼンテーションとコミュニケーションを行うことができる(情報処理力) //--多様な情報ツールの機能を理解し、情報端末上で情報技術を活用することができる(ICTスキル) //-評価方法 //演習の成果物(内容、ビジュアル、ユーザビリティ、技術水準)を70%、企画報告・中間報告等のプレゼンテーションを30%として総合的に評価する。 // //-ルーブリック((ルーブリックとは、学習目標の達成度を判断するための評価の観点と、観点の尺度を数段階に分けた「評価の基準」から構成される「評価ツール」のことです。))における「評価の観点」 //--発想力 //--技術力 ~ ~