#author("2024-12-05T09:44:17+09:00","default:member","member") #author("2024-12-18T16:56:41+09:00","default:member","member") *善結穂&scale(70){ ｜ 情報デザイン演習ⅢB}; [[情報デザイン演習IIIB]] ~ ~ ~ *課題2 経路案内 ~ ~ ~ **概要 ***背景 -九産大前駅から九州産業大学の卒業制作展の会場までの道を案内する -踏切があり、狭い道で危ないため、経路の安全性に問題がある -建物やエレベーターの場所など、会場までの経路が分かりにくい ~ ***目的 -経路の安全性に問題があることを指摘し、注意喚起を行う -卒業制作展に興味を持っている人が楽しく見れる動画にする -初めて九州産業大学に来た人にも分かりやすい経路案内の動画にする ~ ***コンセプト -テロップを用いて、できるだけ短い文章で動画に補足を入れる -卒業制作展のイメージにあったBGMを使用する -画角を工夫して、経路のイメージがつきやすいようにする ~ ***成果物の仕様 -YouTube（横型動画） #YouTube() -YouTube（縦型動画） --[[リンクはこちら>]] ~ ***制作期間 -2024.11.07 - 2024.12.18 ~ ***まとめ - ~ ~ **調査 ***現状調査：撮影テスト -[[OneDriveへのリンク>https://ksumail-my.sharepoint.com/:v:/g/personal/k22as605_st_kyusan-u_ac_jp/ER-OzEvLx0tLo8iq9UUt4PcBBnCEJWYJPQPx9Rae5h2TaQ?nav=eyJyZWZlcnJhbEluZm8iOnsicmVmZXJyYWxBcHAiOiJPbmVEcml2ZUZvckJ1c2luZXNzIiwicmVmZXJyYWxBcHBQbGF0Zm9ybSI6IldlYiIsInJlZmVycmFsTW9kZSI6InZpZXciLCJyZWZlcnJhbFZpZXciOiJNeUZpbGVzTGlua0NvcHkifX0&e=xiwl5r]] ~ ***先行事例の調査 -横型動画 -- -縦型動画 -- ~ ***技術・技法の調査：テロップ（映像表現における文字情報について） -[[伝わるテロップの動かし方-108個のテロップモーション図鑑->https://note.com/meec/n/n2185e77c3cba#ed3ca6be-93a9-438c-99f8-295eb56a8ae7]] -[[【動画編集者必見】見やすいテロップの作り方11の条件【完全版】>https://note.com/meec/n/n292b1a7cc6b3]] -[[テロップのプロ、ナカドウガが語るテロップデザインのコツ>https://vook.vc/n/2393]] -[[テロップ入れの極意 編集の現場からプロ技を紹介 >https://www.artstech.net/column/3165]] ~ ~ #hr CENTER:''進捗記録'' //&color(red){最新の情報を一番上に記載して下さい（古い記事が下へ沈む）。}; #hr ~ ~ **#13：2024.12.12 ***編集 -After Effectsでの編集 -ブラッシュアップ ~ ~ **#12：2024.12.5 ***編集 -After Effectsでの編集 -ブラッシュアップ ~ ~ **#11：2024.11.28 ***撮影・編集 -横向き撮影 -縦向き撮影 -After Effectsでの編集 ~ ~ **#10：2024.11.21 ***撮影 -横向き撮影 -縦向き撮影 ~ ~ //まとめ→振り返って得た新たな発見を書いてもいいかも //感想にならないようにする **#09：2024.11.14 ***構成 +スタート（改札前） +北門入り口 +17号館入り口 +エレベーター +ゴール（会場） ~ ***ストーリーボード：テロップ //縦バージョンと横バージョンふたつ作る、PDFで一つのデータにまとめる //ナレーション、BGM、効果音入れる -[[OneDriveへのリンク>]] ~ ***技術・技法の調査：テロップ（映像表現における文字情報について） -[[伝わるテロップの動かし方-108個のテロップモーション図鑑->https://note.com/meec/n/n2185e77c3cba#ed3ca6be-93a9-438c-99f8-295eb56a8ae7]] -[[【動画編集者必見】見やすいテロップの作り方11の条件【完全版】>https://note.com/meec/n/n292b1a7cc6b3]] -[[テロップのプロ、ナカドウガが語るテロップデザインのコツ>https://vook.vc/n/2393]] -[[テロップ入れの極意 編集の現場からプロ技を紹介 >https://www.artstech.net/column/3165]] ~ ***概要欄の整理 //２〜３項目ほど箇条書き -背景 //九州産業大学の卒展に来場してもらうときに道がわかりにくい --九産大前駅から九州産業大学の卒業制作展の会場までの道を案内する --踏切があり、狭い道で危ないため、経路の安全性に問題がある --建物やエレベーターの場所など、会場までの経路が分かりにくい -目的 //卒展のワクワク感を伝えながら誰もがわかりやすい動画にする --経路の安全性に問題があることを指摘し、注意喚起を行う --卒業制作展に興味を持っている人が楽しく見れる動画にする --初めて九州産業大学に来た人にも分かりやすい経路案内の動画にする -コンセプト //卒展のイメージに合わせたり、ソーシャルデザイン学科らしい手法で伝える --テロップを用いて、できるだけ短い文章で動画に補足を入れる --卒業制作展のイメージにあったBGMを使用する --画角を工夫して、経路のイメージがつきやすいようにする ~ ~ **#08：2024.11.07 ***現状調査：撮影テスト -[[OneDriveへのリンク>https://ksumail-my.sharepoint.com/:v:/g/personal/k22as605_st_kyusan-u_ac_jp/ER-OzEvLx0tLo8iq9UUt4PcBBnCEJWYJPQPx9Rae5h2TaQ?nav=eyJyZWZlcnJhbEluZm8iOnsicmVmZXJyYWxBcHAiOiJPbmVEcml2ZUZvckJ1c2luZXNzIiwicmVmZXJyYWxBcHBQbGF0Zm9ybSI6IldlYiIsInJlZmVycmFsTW9kZSI6InZpZXciLCJyZWZlcnJhbFZpZXciOiJNeUZpbGVzTGlua0NvcHkifX0&e=xiwl5r]] ~ ***先行事例の調査 //縦動画のサムネ調べる //分かりにくい場所までの道を案内する動画など -横動画 -- -- -縦動画 --[[カフェまでの案内動画(Instagram)>https://www.instagram.com/reel/DCGEqXOy76x/?utm_source=ig_web_button_share_sheet]] -- ~ ~ ~ ~ *課題1 VI計画 ~ #image(使用例22AS605善結穂.jpg) ~ ~ **概要 ***背景 -大衆食堂のように話しながらご飯を食べれる雰囲気 -所々に芸術作品が展示してある -大学の中央辺りに位置し、多くの学生が利用する -定食、どんぶり、カレー、麺類などのメニューで量が多め -メニュー内容でカウンターや整列線の色を分けている -鮮やかな色が多用され、明るい雰囲気 -間違えやすい返却棚に警告色が使われている -食券販売機に写真が載っていないメニューが多く、イメージがしづらい -メニューポスターに色が多用され、情報が整理しにくい ~ ***目的 -さらに活気のある立ち寄りやすい食堂にしたい -メニューのイメージを伝わりやすくしたい ~ ***コンセプト -大きく開けた口や食事の時の手の動きを入れて、 活気を感じて、お腹いっぱいご飯が食べたくなるデザインにする -暖色(赤、橙、黄)を使い、明るい雰囲気を演出する -デザインにスプーンや食べ物を含めて、食事を具体的にイメージできる デザインにする ~ ***成果物の仕様 -シンボルマーク / ロゴタイプ #image(成果物.jpg) -モーションロゴ #YouTube(t-uTwUPdrCk) -VIマニュアル --[[OneDriveへのリンク>https://ksumail-my.sharepoint.com/:b:/g/personal/k22as605_st_kyusan-u_ac_jp/ETHafe4FUx1PqUaFK-Wx53oBHgr7jZQGDscJKdLMpnC2KQ?e=j3s6P4]] ~ ***制作期間 -2024.09.19 - 2024.11.07 ~ ***まとめ -暖色を使用し、動きの多いモーションロゴに仕上げたことで、 明るく活気のあるイメージを作ることができた -デザインに食べ物を取り入れなかったので、食堂のメニューの イメージが伝わりにくいデザインになってしまった -雰囲気を伝えるだけでなく、食堂の概要も伝えられるデザインにすることが 今後の課題である ~ ~ **調査 ***現状調査 -記録写真（外観 / 内観） --[[OneDriveへのリンク>https://ksumail-my.sharepoint.com/:f:/g/personal/k22as605_st_kyusan-u_ac_jp/EiIgGCDCOuZJqQQzaL97NMcBWVFmiyUR5p7uQzw9DfCB5Q?e=0WhSGd]] -店舗の概要 --大衆食堂のような雰囲気 --わいわいとお喋りできる雰囲気 --所々に芸術作品が展示してある --大学の真ん中辺りに位置している --定食、どんぶり、カレー、麺類などのメニューで量が多め --しっかりとした味付けのメニューが多い -良い点 --メニュー内容によって、色を分けて列の線やカウンターの色を分けている --鮮やかな色が使われている割合が高いため、明るい雰囲気になっている --返却棚の表記に警告色が使われているため、戻す場所が間違いにくい -改善点 --食券販売機に写真が載っていないメニューが多いため、 メニューのイメージがしづらい --外に貼ってあるポスターに多くの色が使用されていて、 目立たせたい情報が分かりにくい ~ ***先行事例 -VIに関する基本情報 --[[ビジュル面での規格を定めるVIとは >https://www.omnimosouq.jp/vi/]] --[[看板製作との関係も深いVI（ビジュアル・アイデンティティ）とは？ >http://uchino-kanban.com/archives/2220]] --[[CIとVIの違いを具体的に解説！>https://harmonic-society.co.jp/differences-between-ci-and-vi/]] --[[VI（ビジュアル・アイデンティティ）って何？>https://trusnex.com/blog5/]] -類似する飲食店の事例調査 --[[日本社会事業大学「しゃだいにんぐ」>https://www.jcsw.ac.jp/campuslife/cafeteria/]] --[[フィリピンの大学>https://www.english-infonetwork.com/%E3%83%95%E3%82%A3%E3%83%AA%E3%83%94%E3%83%B3%E3%81%AE%E5%A4%A7%E5%AD%A6%E3%81%AE%E5%AD%A6%E9%A3%9F/]] --[[広島大学>https://vsign.jp/hiroshima/2025/meal/about_menu]] --[[神戸国際大学>https://www.kobe-kiu.ac.jp/news/243094/]] ~ ***技法・技術情報 -モーションロゴの制作方法 --[[モーションロゴ風のキャラクターアニメーション【After Effects】>https://youtu.be/WhcaE6upgo4?si=qVKi1fRwpNFV9cIV]] --[[【AfterEffects】Spoon風口ゴアニメーションを作ってみよう【アフターエフェクトチュートリアル】>https://youtu.be/WyWtz1XASnQ?si=PSp5fN8qmTgAGlOD]] ~ ~ #hr CENTER:''進捗記録'' //&color(red){最新の情報を一番上に記載して下さい（古い記事が下へ沈む）。}; #hr ~ ~ **#07：2024.10.31 ***使用例 -[[OneDriveへのリンク>https://ksumail-my.sharepoint.com/:i:/g/personal/k22as605_st_kyusan-u_ac_jp/EdZbJ41Qgx5FgQiGJRE82JMBxmtxvyiz2ytVD9D1ATgDSg?e=SzPTo5]] ~ ~ **#06：2024.10.24 ***モーションロゴ -[[OneDriveへのリンク>https://ksumail-my.sharepoint.com/:v:/g/personal/k22as605_st_kyusan-u_ac_jp/Ec-OJ_KlXk5Lj7T3Z2s1mAoBmHivI_DCZNofJ5D0JR3tuw?nav=eyJyZWZlcnJhbEluZm8iOnsicmVmZXJyYWxBcHAiOiJPbmVEcml2ZUZvckJ1c2luZXNzIiwicmVmZXJyYWxBcHBQbGF0Zm9ybSI6IldlYiIsInJlZmVycmFsTW9kZSI6InZpZXciLCJyZWZlcnJhbFZpZXciOiJNeUZpbGVzTGlua0NvcHkifX0&e=R7EWKE]] ~ ~ **#05：2024.10.17 ***VIマニュアル -[[OneDriveへのリンク>https://ksumail-my.sharepoint.com/:b:/g/personal/k22as605_st_kyusan-u_ac_jp/ETHafe4FUx1PqUaFK-Wx53oBHgr7jZQGDscJKdLMpnC2KQ?e=j3s6P4]] ~ ~ **#04：2024.10.10 ***字コンテ -起：口をパクパクさせながら右からジグザグに移動してくる -承：上からスプーンが落ちてきて口の中に入る（スプーンは透明からオレンジ色に変化する） -転：口に入ってきたスプーンを咥える -結：口を開けたら「アルテリア」の文字が出現する ~ ***ストーリーボード -[[OneDriveへのリンク>https://ksumail-my.sharepoint.com/:b:/g/personal/k22as605_st_kyusan-u_ac_jp/Ee0dF3cgA_xArdru3XQsmm0BndNYYZeMFURDfThuxIX9CQ?e=YoN9gP]] ~ ~ **#03：2024.10.03 ***試作（3案） -[[OneDriveへのリンク>https://ksumail-my.sharepoint.com/:b:/g/personal/k22as605_st_kyusan-u_ac_jp/EaQVDcNcmH5AtALy9dYbtLEB41Wjttgxna9FjkxY0xqw0g?e=YzkTeC]] ***先行事例の調査：VIマニュアル -[[中央学院大学>https://www.cgu.ac.jp/albums/abm.php?d=27&f=abm00000285.pdf&n=VI%E3%83%9E%E3%83%8B%E3%83%A5%E3%82%A2%E3%83%AB.pdf]] -[[お茶の京都>https://ochanokyoto.jp/data/DA_112_2.PDF]] -[[いわき野菜アンバサダー>https://misemasu-iwaki.jp/iwaki_ambassador/02_IVA_VI.pdf]] -[[長野県がん対策推進企業等連携協定 ロゴマーク>https://www.pref.nagano.lg.jp/hoken-shippei/gan/documents/logo_manualr3.pdf]] ***概要欄の整理 -背景 //箇条書き //対象の現状や対象周りの環境の現状、世の中的な事情 //学食の現状（特徴、いい点、悪い点） //雰囲気や場所、メニュー等を箇条書き --大衆食堂のように話しながらご飯を食べれる雰囲気 --所々に芸術作品が展示してある --大学の中央辺りに位置し、多くの学生が利用する --定食、どんぶり、カレー、麺類などのメニューで量が多め --メニュー内容でカウンターや整列線の色を分けている --鮮やかな色が多用され、明るい雰囲気 --間違えやすい返却棚に警告色が使われている --食券販売機に写真が載っていないメニューが多く、イメージがしづらい --メニューポスターに色が多用され、情報が整理しにくい -目的 //現状のお店をどのように変えていきたいか、課題、お店側の思い、客の思い --さらに活気のある立ち寄りやすい食堂にしたい --メニューのイメージを伝わりやすくしたい -コンセプト //目的達成のために具体的に何をするか、どんな作戦で実行するか、方向性（固いのか柔らかいのか、軽快なのか重厚なのかなど） //元気で活力のある感じにする。それを具体化するために手書きの雰囲気を感じられる丸みの帯たデザインにするなど //こういうデザインにする→具体的なデザイン提案をどうしていくか、表現技法や工夫など --大きく開けた口や食事の時の手の動きを入れて、 活気を感じて、お腹いっぱいご飯が食べたくなるデザインにする --暖色(赤、橙、黄)を使い、明るい雰囲気を演出する --デザインにスプーンや食べ物を含めて、食事を具体的にイメージできる デザインにする -成果物（制作物） --シンボルマーク / ロゴタイプ --モーションロゴ //--+α //名刺や封筒、メニューなど ~ ~ **#02：2024.09.26 ***研究対象 -アルテリア ***アイデアスケッチ -[[OneDriveへのリンク>https://ksumail-my.sharepoint.com/:f:/g/personal/k22as605_st_kyusan-u_ac_jp/El_5kcetdllKix-Dt3mHHKABMOzPgBpu2YoVFddEDcF2aQ?e=eKIgTK]] ***現状調査：記録写真 -[[OneDriveへのリンク>https://ksumail-my.sharepoint.com/:f:/g/personal/k22as605_st_kyusan-u_ac_jp/EiIgGCDCOuZJqQQzaL97NMcBWVFmiyUR5p7uQzw9DfCB5Q?e=MSXMmp]] ~ **#01：2024.09.19 ***VIに関する基本情報 //VIとはなにかについてまとめる（たくさん） -[[ビジュル面での規格を定めるVIとは >https://www.omnimosouq.jp/vi/]] -[[看板製作との関係も深いVI（ビジュアル・アイデンティティ）とは？ >http://uchino-kanban.com/archives/2220]] -[[CIとVIの違いを具体的に解説！>https://harmonic-society.co.jp/differences-between-ci-and-vi/]] -[[VI（ビジュアル・アイデンティティ）って何？>https://trusnex.com/blog5/]] ~ ***モーションロゴの制作方法 //YouTubeやWEBサイトのリンク -[[モーションロゴ風のキャラクターアニメーション【After Effects】>https://youtu.be/WhcaE6upgo4?si=qVKi1fRwpNFV9cIV]] -[[【AfterEffects】Spoon風口ゴアニメーションを作ってみよう【アフターエフェクトチュートリアル】>https://youtu.be/WyWtz1XASnQ?si=PSp5fN8qmTgAGlOD]] ~ ***先行事例の調査：WEB・文献調査 //WEBサイトや書籍等、高校。大学。社食のVIの事例、ブランディング、学食の参考になるもの -[[日本社会事業大学「しゃだいにんぐ」>https://www.jcsw.ac.jp/campuslife/cafeteria/]] -[[フィリピンの大学>https://www.english-infonetwork.com/%E3%83%95%E3%82%A3%E3%83%AA%E3%83%94%E3%83%B3%E3%81%AE%E5%A4%A7%E5%AD%A6%E3%81%AE%E5%AD%A6%E9%A3%9F/]] -[[広島大学>https://vsign.jp/hiroshima/2025/meal/about_menu]] -[[神戸国際大学>https://www.kobe-kiu.ac.jp/news/243094/]] ~ ***現状調査：学食の現在の様子 //実際に調査、写真→外観（引きとより、看板）、内観、料理が提供されるカウンターの様子、座席の様子、お店の全体、メニュー、提供される料理、実食 -店舗の概要 //雰囲気や場所、メニュー等を箇条書き --大衆食堂のような雰囲気 --わいわいとお喋りできる雰囲気 --所々に芸術作品が展示してある --大学の真ん中辺りに位置している --定食、どんぶり、カレー、麺類などのメニューで量が多め --しっかりとした味付けのメニューが多い -良い点 //（現状の状態）視覚的な情報 --メニュー内容によって、色を分けて列の線やカウンターの色を分けている --鮮やかな色が使われている割合が高いため、明るい雰囲気になっている --返却棚の表記に警告色が使われているため、戻す場所が間違いにくい -改善点 //視覚的な情報での改善点、メニューがわかりずらい、看板が見にくい（現状の状態） --食券販売機に写真が載っていないメニューが多いため、 メニューのイメージがしづらい --外に貼ってあるポスターに多くの色が使用されていて、 目立たせたい情報が分かりにくい ~ ~