情報デザイン専攻|前期 月曜3・4限|デジタルラボ503
受講生一覧|汎用シート
各自、3分程度で以下の内容を簡潔に説明して下さい。
最終成果の確認は、前半・後半の両者ともあわせて試験期間中に行います。期末試験開始前までに、各自のページを整理して下さい。
次回7月14日は最終回となります。各自、前半同様に後半のプロジェクトの成果報告を行なってください。
|50|50|C | #image(サイトマップ.png) | #image(ワイヤーフレーム.png) |
今回の作業について、その内容を具体的に記載して下さい。
**2025.07.07 ~ ~ ~
第12回・13回は、テスト(相互評価)の結果にもとづくブラッシュアップ期間です。再度テスト(相互評価)を行いたい場合は汎用シートの右端の欄を使って、意見を募集する案内を行なってください(この作業は任意です)。
今回の作業について、その内容、新たな課題等の記載を行なってください。
**2025.06.30 ~ ~ ~
今回、Webサイト制作に取り組んでいる方が多数。公開の方法は様々なようですが、一般的な制作フローは同じです。
1年次、コンピュータ概論でも解説しましたが・・再掲
第1Qと同様に進行します。本日はテストの段階。プロトタイプに対する意見聴取を相互に行います。
次回までに意見を整理して、次の作業に着手できるよう準備して下さい。
**2025.06.23 ***見出された問題点 -◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ ~ ***好評を得た点 > プロジェクトの特性として -◯◯◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ ~ ~
プロトタイピングの目的は、アイデアに対するユーザーの反応を見ることにあります。構想中のアイデアの「全体像」がある程度具体的なカタチになることで、ユーザーから様々な感想を得ることができます。要点は・・・
以下の雛形を 学科サイトの個人ページ に、コピー&ペーストするかたちで、今週の進捗報告を記載する枠組み用意して下さい。
**2025.06.16 ***今回制作したプロトタイプ 画像等を掲載して下さい。 ~ ***プロトタイプの説明 -◯◯◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯、◯◯◯◯◯◯ ~ ~
それぞれのプロジェクトのプロトタイプについて、全員からコメントをもらうため、何らかの方法を検討し、自身のページのメインビジュアルの下にリンクを配置してください。例えば・・・
意見聴取は、次回 6月23日の授業時間内に一斉に行います。意見をもらえるよう、テーマの概要等を記載するとともに、プロトタイプに相当する情報の掲載を次回までに確実に遂行するよう、お願いします。
サイトマップ(メニュー構成)の設計は簡単ではありません。プロトタイプのテスト後に必ず修正が入る・・という前提で進めて下さい。以下、情報をどのように整理すればよいか、そのヒントとなるキーワードです。
◯◯についてまとめたWebサイトを作成します。 どのように情報を整理したらよいか、サイトマップのかたちで提案して下さい。
第1Qと同様に進行します。本日は、現状分析と課題定義、アイデア出しです。
あなたが取り組もうとしているプロジェクトについて、以下のような現状の調査・分析を行って、課題を定義して下さい。
現状の調査が終了して、ある程度予備知識がついたところで、プロジェクトの遂行にあたって「解決すべき課題」を整理して下さい。
アイデア創出(Ideate)は、定義された課題を解決するためのアイデアを量産する段階です。質よりも量を重視して、考え得るさまざまなアイデアを一旦書き出して、その後、方向性を絞り込んで下さい。
本日の日付を「中見出し」として、現状調査の結果と解決すべき課題、さらに個々の課題に対する複数のアイデアを箇条書きで記載して下さい。
**2025.06.09 ← 中見出し ***現状分析 ← 小見出し -◯◯◯◯◯◯◯◯◯◯◯◯◯、◯◯◯◯◯◯◯◯◯◯◯ -◯◯◯◯◯、◯◯◯◯◯◯◯◯◯◯◯ ~ ***課題定義 -1. ◯◯◯◯◯◯◯◯ -2. ◯◯◯◯◯◯◯◯◯◯◯ -3. ◯◯◯◯◯◯ ~ ***制作上のアイデア(課題ごとに複数のアイデア) -1. ◯◯◯◯◯◯◯◯◯◯◯◯◯、◯◯◯◯◯ --◯◯◯◯◯、◯◯◯◯◯◯◯◯◯◯◯ --◯◯◯◯◯、◯◯◯◯◯◯◯◯ -2. ◯◯◯◯◯◯◯◯◯◯◯◯◯ --◯◯◯◯◯、◯◯◯◯◯ --◯◯◯◯◯、◯◯◯◯◯◯◯◯ -3. ◯◯◯◯◯◯◯◯◯◯◯◯◯、◯◯◯◯◯◯◯◯◯◯◯ --◯◯◯◯◯、◯◯◯◯◯◯◯◯◯◯◯ --◯◯◯◯◯、◯◯◯◯◯◯◯◯◯ ~ ~
**2025.06.02 ***テーマ候補 -◯◯◯◯◯◯◯◯◯◯◯ -''◯◯◯◯◯◯◯◯◯◯◯◯◯'' ← 太字になります。 -◯◯◯◯◯◯◯◯◯◯◯◯◯ ~ ***成果物の仕様 -形式:◯◯◯◯◯◯ -サイズ:◯◯◯◯◯◯◯ -分量:◯◯◯◯◯◯ ~ ***この演習を通して身につけたいスキル -◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ ~ ~
前半7週の成果報告について、各自 3分程度で発表を行って下さい。
前回同様に進捗状況をメモとして残して下さい。
**2025.05.19 ***作業の記録 -◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ ~ ***MEMO(ToDo項目など) -◯◯◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯、◯◯◯◯◯◯
配置する画像のサイズ等によっては、出力したPDFが異常に大きくなる場合があります。スムーズに閲覧してもらうべく、ファイルサイズがなるべく軽くなるよう工夫して下さい。ちなみに、以下の卒業研究概要集は、60ページ以上ありますが、ファイルサイズは 10MB程度です。
https://design.kyusan-u.ac.jp/PDF/Proceedings2025.pdf
再サンプリング, 10cm, 300dpiと設定すれば、画素数が最適化されます。
出版、Webデザインの分野において使用されている「ダミー原稿」です。文章原稿が実際のサイズで入力されることで、紙面の割り付けイメージを確認できます。以下、日本語のダミー原稿もWebから入手することができます。
Google:Lorem ipsum
成果報告は一人5分程度で発表と質疑応答・・を想定しています。スムーズかつ的確な報告ができるよう、自身のページを整理しておいて下さい。
%%相互評価シート%% ご協力ありがとうございました。
**2025.05.12 ***作業の記録 -◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ ~ ***MEMO(ToDo項目など) -◯◯◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯、◯◯◯◯◯◯
次週までに・・
テストは、プロトタイプを試用してもらうことで、ユーザーからのフィードバックを得るとともに、ユーザーの共感を高めるための段階です。
以下の説明は、リアルにテストが実施できる場合の一般論です。
それぞれのプロジェクトのプロトタイプについて、全員からコメントをもらうために Googleスプレッドシート(共同編集シート)を用意します。
[[プロトタイプ評価シート>https://docs.google.com/sprea・・・sharing]]この情報は、自身のページの上部の目立つ場所に記載して下さい。
**2025.04.28 ***見出された問題点 -◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ ~ ***好評を得た点 > プロジェクトの特性として -◯◯◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ ~ ~
II の部分は、ローマ数字ではなく、大文字の [ I (アイ)] 2つです。
プロトタイピング(Prototyping)とは、実際に目で見て、手で触れることができるモノを作ること、ソフトウエアで言えば、入力から出力までの一連のプロセスを確認できる試作品を制作することを意味します。
プロトタイプ、モックアップ、試作品・・ざっくり言えば似たようなものです。
以下の雛形を 学科サイトの個人ページ に、コピー&ペーストするかたちで、今週の進捗報告を記載する枠組み用意して下さい。
**2025.04.21 ***今回制作したプロトタイプ 画像等を掲載して下さい。 -◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯◯◯、◯◯◯◯◯◯ ~ ***プロトタイプ制作の方法 -◯◯◯◯◯◯◯、◯◯◯◯◯◯ -◯◯◯◯◯、◯◯◯◯◯◯ ~ ~
#image(台割り.png) 台割りイメージ #image(表紙.png) 表紙イメージ
#image(ストーリーボード.png) ストーリーボードまたは絵コンテ #youtube(ABCDEFG) 全体の流れがわかる 1分間のダイジェスト映像 #youtube(ABCDEFG) 技法についての試作映像
#image(サイトマップ.png) サイトマップ #image(ワイヤーフレーム.png) サイトのワイヤーフレーム https://xxxx.github.io/project/index.html サーバーの動作確認(プロトタイプサイト)
- Googleスプレッドシート上に「台割」を記載 - 束見本をコピー用紙で作成(16ページの厚みを確認) - 表紙イメージはフリーの写真を使ってレイアウトのみ試作
- 主人公はダミー人形、舞台は自宅(本番は演劇部学生、舞台は大学) - 照明は特に設置せず(本番は3灯立てる) - 音はスマホで録音したもの(本番はアフレコ) - スマートフォンで撮影(本番は一眼レフを使用予定) - AdobePremiere で編集 - 音楽はフリーのものでイメージに近いもの(本番は自ら作曲)
- Adobe Illustrator により、ワイヤーフレームを制作 - インターネット上のWebテンプレートを利用 - メインビジュアルとメニューのみを修正してサーバーにアップ
用語の参考イメージ
学科サイト個人ページの以下の部分を記載して下さい。
デザイン思考のプロセスにおいて、現状の問題を見出し、何をどうするべきか、その課題を定義する・・という作業は非常に重要です。極端に言えば、課題が決まれば(あとはアイデアを考えて実行するだけなので)プロジェクトの大半はできたも同然です。
そこで、まずは、あなたが取り組もうとしているプロジェクトについて、以下のような現状の調査・分析を行って、最終的に「課題の定義」につなげて下さい。
現状の調査が終了して、ある程度予備知識がついたところで、プロジェクトの遂行にあたって「解決すべき課題」を整理して下さい。
アイデア創出(Ideate)は、定義された目的や方向性を実現するためのアイデアを量産する段階です。この段階では、ブレインストーミングや、アイデア創出技法を活用して、質よりも量を重視して、考え得るさまざまなアイデアを書き出してみます。
解決すべき複数の課題について、どれからでも構いません。着手しやすいものからアイデア創出を行なって下さい。何かひとつが決まると、そこから別の課題の方向性も自ずと絞り込まれていきます。
以下、アイデア創出に関わる一般的な知見、手法について紹介します。
本日の日付を「中見出し」として、現状調査の結果と解決すべき課題、さらに個々の課題に対する複数のアイデアを箇条書きで記載して下さい。
**2025.04.14 ← 中見出し ***現状調査(先行事例等) ← 小見出し -◯◯◯◯◯◯◯◯◯◯◯◯◯、◯◯◯◯◯◯◯◯◯◯◯ -◯◯◯◯◯、◯◯◯◯◯◯◯◯◯◯◯ ~ ***解決すべき課題(ToDoリスト) -1. ◯◯◯◯◯◯◯◯ -2. ◯◯◯◯◯◯◯◯◯◯◯ -3. ◯◯◯◯◯◯ ~ ***制作上のアイデア(課題ごとに複数のアイデア) -1. ◯◯◯◯◯◯◯◯◯◯◯◯◯、◯◯◯◯◯ --◯◯◯◯◯、◯◯◯◯◯◯◯◯◯◯◯ --◯◯◯◯◯、◯◯◯◯◯◯◯◯ -2. ◯◯◯◯◯◯◯◯◯◯◯◯◯ --◯◯◯◯◯、◯◯◯◯◯ --◯◯◯◯◯、◯◯◯◯◯◯◯◯ -3. ◯◯◯◯◯◯◯◯◯◯◯◯◯、◯◯◯◯◯◯◯◯◯◯◯ --◯◯◯◯◯、◯◯◯◯◯◯◯◯◯◯◯ --◯◯◯◯◯、◯◯◯◯◯◯◯◯◯ ~ ~
本科目、演習Aは「情報とメディアの歴史、原理、構造、機能についての「理解」を深めるとともに、ソーシャルデザインの観点から新たな情報環境の構築に関するデザイン提案を行う」ことを目的とした科目です。
ソーシャルデザインは「自分ゴト」から・・とよく言われます。1年次の演習では半径3m - 10m、2年次は半径100m、3年次は半径10km(地域社会)へと、徐々に活動範囲を広げることをイメージしています。
半径 100m の「 面白い! 」
選ぶテーマによって、公開に適した媒体は異なります。紙媒体、映像媒体、Web媒体、あるいはイベントのような時限つき「場」の提案。成果の最終形態(公開情報)は 以下のいずれでも構いません(組み合わせも可)が、成果物に至る過程で必要となるソフトウエア等が利用できるか否か、そのあたりもふまえて、方針を決めるようにして下さい。
以下、先輩のプロジェクトの成果です。
各自のテーマに応じて、なるべくシンプルなツール(お金をかけずに準備できるもの)を使って下さい。演習A は「考える」ことに重きを置くので、ツールは何でも構いません)。
パソコンが無い方は、スマートフォンのアプリ上で制作できるものでも構いません。さらに言えば、成果物がアナログ手作業のものでもかまいません(最終的に学科サイト上に写真等が掲載できればOKです)。
デザイン思考(後述)のプロセスに沿って進めます。
> デザイン思考