#author("2026-01-01T22:22:40+09:00","default:member","member") #author("2026-01-04T12:29:40+09:00","default:member","member") *劉沢寧 [[情報デザイン演習IIIB]] ~ ~ *課題2 経路案内 ~ #YouTube(BL0RXoSh6Og) ~ ~ **概要 ***背景 -校内の施設間の経路は日常的に頻繁に利用されているものの、初めて訪れる学生にとっては、ルートや曲がり角、目印が直感的に分かりにくく、迷ったり遠回りしてしまうことがある。 -特に建物が集中し、人の流れが複雑なエリアでは、文字情報や地図だけでは空間関係を正確に把握することが難しく、より直感的な案内方法が必要であると感じた。 ~ ***目的 -実写映像による経路案内を通して、校内環境にまだ慣れていない学生が、移動ルートや方向判断のポイントを直感的に理解できるようにする。 -映像内のテキスト、標識、定格表現を組み合わせることで、「どこで曲がるのか」「どの方向へ進むのか」を明確に伝え、迷いを減らし、体力を温存しながら移動効率の向上を目指す。 ~ ***コンセプト -日常の歩行視点で撮影した実写映像をベースに、経路体験をゲームUIに近い視覚的なガイドとして再構成する。 -重要な分岐点や目印となる建物では、定格やクローズアップ、文字やアイコンによる提示を用い、判断に必要な情報を分かりやすく伝える。 ~ ***成果物の仕様 -[[YouTube（横型動画）1920 × 1080 px>https://www.youtube.com/watch?v=BL0RXoSh6Og]] -[[Instagram or YouTube（縦型動画）1080 × 1920 px>https://youtube.com/shorts/nL0U7BdPOhE?feature=share]] ~ ***制作期間 -2025.11.13 - 2025.12.25 ~ ***まとめ -今回の制作では、経路案内を分かりやすく伝えるために、実写映像にUI的な表現を取り入れた。一方で、映像のブレや画面の安定感といった点では、やや課題が残る結果となった。 -経路案内映像は見た目の美しさだけでは不十分であり、見やすさや分かりやすさ、迷わず理解できる構成といった機能面が重要であることを改めて実感した。特に、文字やアイコンを表示する位置や時間について意識して制作を行った。 -今後は、映像の安定性やカメラワーク、画面内の情報量の整理にもより注意を払い、視覚表現としての魅力と案内としての役割の両立を目指した映像制作に取り組んでいきたい。 ~ ~ #hr CENTER:''進捗記録'' #hr ~ ~ **#13：2025.12.18 ***作品の仕上げ -[[OneDriveへのリンク>https://ksumail-my.sharepoint.com/:f:/g/personal/k24as030_st_kyusan-u_ac_jp/IgDWf-E43ztoRLvCn_u5b7xBAZ7EwAfSI2mFJOMpI4yB348?e=5KSsbp]] --サムネイル --縦動画 --横動画 ~ ~ **#12：2025.12.11 ***書き出しテスト -[[OneDriveへのリンク>https://ksumail-my.sharepoint.com/:f:/g/personal/k24as030_st_kyusan-u_ac_jp/IgBtCEKNZEM9Q4DNIoMZy9NDAepjCSTrWBNBXGRdR6QEXyo?e=fWjVLS]] ~ ~ **#11：2025.12.04 ***相互評価 -企画 --複雑な経路を利用しないので見やすい。 -撮影 --途中に映る建物を目印にしているので分かりやすい。 -編集 --基本倍速になっているので目印のところだけ等倍にするとより分かりやすいと思う。 ~ ~ **#10：2025.11.27 ***試作 -[[OneDriveへのリンク>https://ksumail-my.sharepoint.com/:f:/g/personal/k24as030_st_kyusan-u_ac_jp/IgB5NI-mSpUiRpuHf8r4JuRzAeOH736pyrncTFPImogO1yM?e=edOWcN]] ~ ~ **#09：2025.11.20 ***企画 -ストーリーボード --[[OneDriveへのリンク>https://ksumail-my.sharepoint.com/:u:/g/personal/k24as030_st_kyusan-u_ac_jp/IQAJOpsncKsFSIFtIdRTtSGoAdv0ZuBNouSZiZlKMYhpByc?e=zBf0cX]] --[[OneDriveへのリンク>https://ksumail-my.sharepoint.com/:b:/g/personal/k24as030_st_kyusan-u_ac_jp/IQCr9kfnZD5uQYk7o0UpYiYrAQe6-civ0Zmpp2UTteXMmu4?e=kG48wo]] -字コンテ --1：駅の外観を映し、経路案内のスタート地点を示す。 --2：大学の正門へ向かって進み、テロップを入れて直進する。 --3：曲がり角や直進ポイントで、UI表示による案内を行う --4：目印となる中央館をクローズアップで映す。 --5：中央館から2号館へ向かい、建物と入口を映す。 --6：エレベーターに乗り、上がる階数をテロップで示す。 --7：1号館と2号館の連結部分を通過する。 --8：1号館内の目的地に到着し、経路案内を締めくくる。 -概要 --背景 ---校内の経路は日常的に利用されているが、初めて訪れる学生にとっては分かりにくいと感じた。 --目的 ---実写映像による経路案内を通して、移動ルートや判断ポイントを分かりやすく伝える。 --コンセプト ---歩行視点の実写映像に、UI的な文字やアイコンを組み合わせて案内する。 ---シンプルで理解しやすい構成とする。 ~ ***先行事例の調査 -文字表現の調査 --[[文字で映像を構築するという発想>https://vook.vc/n/8267]] --[[モーション周期表>https://youtu.be/qxpMrf2f7zs?si=GgqpKE9U1KWjtTsl]] ~ ~ **#08：2025.11.13 ***現状調査：現場の状況 -[[OneDriveへのリンク>https://ksumail-my.sharepoint.com/:f:/g/personal/k24as030_st_kyusan-u_ac_jp/IgAa37pBF0tNRbu-fwNx3MbwAcGx9xs96o8ohjNEGKHLSdk?e=UuHoCX]] ~ ***先行事例の調査 -横型動画 --[[【道案内】グラバー園 長崎路面電車 石橋電停からグラバースカイロード>https://youtu.be/I6Vu6XOe654?si=t_qlProqYONej0kN]] --[[【経路案内】大崎駅〜freee本社が入っているビルまでの道案内(行き方)動画>https://youtu.be/FhMnlFrm004?si=xBm6nalq1C94XIL9]] -縦型動画 --[[水前寺駅から熊本県立劇場までの経路案内>https://youtube.com/shorts/Pj36SvrKw7s?si=qQBymzxYJdJiRIGL]] --[[信洲大学理工学部経路案内>https://youtube.com/shorts/XUi8hdxoTF8?si=1R2bYcrt1fCZcKpc]] ~ ~ ~ //ここまで *課題1 VI計画 ~ #image(oasisPS.jpg) ~ ~ //ここから **概要 ***現状 -券売機とメニュー掲示が入口にあり流れは分かりやすい -昼のピーク時には座席が不足しがち ~ ***課題 -ブランド感を高めるため、店舗名やロゴを目立たせデザインを統一する必要がある -メニュー表示が分散しており、全体を把握しにくい ~ ***目的 -初めてでも迷わず利用できるシンプルで分かりやすい空間をつくる -学生が快適に利用できる環境を整備する ***コンセプト -座席やメニュー利用効率を高め、混雑時にも快適に過ごせる食堂デザイン -親しみやすさと分かりやすさを最優先した空間 ~ ***成果物の仕様 -シンボルマーク / ロゴタイプ #image(LOGO FC.jpg) -モーションロゴ #YouTube(/tOvHFosWo1A) -VIマニュアル --[[OneDriveへのリンク>https://ksumail-my.sharepoint.com/:b:/g/personal/iwata_mail_kyusan-u_ac_jp/EV4Ath-BymBJky3PUF4tGD4BWFb3eCHXQNhHa7MnM-pmbQ?e=ET2Mdj]] ~ ***制作期間 -2025.09.18 - 10.30 ~ ***まとめ -ブランドカラーや形のバランスを工夫することで、全体の印象をより明るく親しみやすいものに仕上げることができた -VIマニュアルの製作を通して、普段何気なく見ているデザインにも明確な意図やルールがあることを知り、視点が広がった -今回のアニメーション制作では、動きの統一性やタイミングの難しさを実感した。また、ロゴの形状によっては視認性が下がる場面もあり、改めて調整の重要性を感じた。今後は目的に合わせてよりわかりやすい表現を意識して制作したいと思った ~ ~ //ここまで #hr CENTER:''進捗記録'' #hr ~ **#06：2025.10.23 ***モーションロゴ -[[OneDriveへのリンク>https://ksumail-my.sharepoint.com/:v:/g/personal/iwata_mail_kyusan-u_ac_jp/EVBdTwFXQUtGhJveSYNtZUEBjFhLt12VzH_i-h4beVlnEw?nav=eyJyZWZlcnJhbEluZm8iOnsicmVmZXJyYWxBcHAiOiJPbmVEcml2ZUZvckJ1c2luZXNzIiwicmVmZXJyYWxBcHBQbGF0Zm9ybSI6IldlYiIsInJlZmVycmFsTW9kZSI6InZpZXciLCJyZWZlcnJhbFZpZXciOiJNeUZpbGVzTGlua0NvcHkifX0&e=a7zOTb]] ~ ~ **#05：2025.10.16 ***VIマニュアル -[[OneDriveへのリンク>https://ksumail-my.sharepoint.com/:b:/g/personal/iwata_mail_kyusan-u_ac_jp/EV4Ath-BymBJky3PUF4tGD4BWFb3eCHXQNhHa7MnM-pmbQ?e=ET2Mdj]] ~ ~ **#04：2025.10.09 ***字コンテ -散乱：色パーツがバラバラに漂う -集結：中央に引き寄せられ、回転しながら集まる -形成：丸い形からロゴがくっきり現れる -完成：「OASIS」文字が出現し、全体が安定する ~ ***ストーリーボード -[[OneDriveへのリンク>https://ksumail-my.sharepoint.com/:i:/g/personal/k24as030_st_kyusan-u_ac_jp/Ec6QQ3N4rK1CgXH1sgmYhP4BE0Z06QT4zt0S4E89gly4eg?e=NLBFdn/]] ~ ~ **#03：2025.10.02 ***サイトの整理 -概要の追加と整理 ~ ***先行事例の調査：VIマニュアル -[[ガイドライン>http://www.riis.okayama-u.ac.jp/wp-content/uploads/2016/10/Manual_%E7%95%B0%E5%88%86%E9%87%8E_Blue.pdf]] -[[VIの事例>https://www.lancers.jp/portfolio/tag/vi?srsltid=AfmBOor28NlRkPSkEJ4GCU7vduoZ8prORy8uDS-W7qmTdyOSyDPcqQfJ]] -[[ ロゴデザインの基礎知識>https://www.markdesign.jp.net/manual_item.html]] -[[ 石川県ホームページ>https://www.pref.ishikawa.lg.jp/kikaku/g7kyoiku/documents/vimanual_new.pdf]] -[[海外用 VI マニュアル (Global VI Manual)の基本作成プロセス >https://note.com/at_design/n/nfba8dc20cd08]] ~ ***作図 -[[OneDriveへのリンク>https://ksumail-my.sharepoint.com/my?viewid=cb481ccf%2Df206%2D4501%2Db4b4%2Db3b96ee01ff3&id=%2Fpersonal%2Fk24as030%5Fst%5Fkyusan%2Du%5Fac%5Fjp%2FDocuments%2F%E8%A6%96%E5%AD%A6%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E6%BC%94%E7%BF%92%2Foasis%2Epdf&parent=%2Fpersonal%2Fk24as030%5Fst%5Fkyusan%2Du%5Fac%5Fjp%2FDocuments%2F%E8%A6%96%E5%AD%A6%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E6%BC%94%E7%BF%92]] ~ **#02：2025.09.25 ***概要の整理 -現状 --食券販売機とメニュー掲示が入口に設置されており、利用の流れは分かりやすいが、掲示が散らばっていて初めての人にはやや分かりにくい --座席は広々としているが、昼のピーク時には不足気味で、学生が席を探す光景が見られる -課題 --ブランド感を高めるために、店舗名やロゴをより目立たせ、デザインを統一する必要がある --メニュー掲示がばらけているため、全体を一覧できるデザインに改善することが望ましい --学生の利用数に対して座席数が十分ではなく、混雑時の対応が課題となっている -目的 --初めてでも迷わず使えるシンプルで分かりやすい空間づくり --食堂をキャンパス生活の一部として活用できる場を目指す -コンセプト --座席やメニューの利用効率を高め、混雑時にも快適に食事できる環境を整える。 --「親しみやすさ」と「分かりやすさ」を最優先にした空間デザイン ~ ***アイデアスケッチ -[[OneDriveへのリンク>https://ksumail-my.sharepoint.com/:u:/g/personal/k24as030_st_kyusan-u_ac_jp/ESYhkOLhZNFBrix5bzusfFMBqbyXdJv-3vhDuDgLH9IxtQ?e=cVX9TO]] ~ ***現状調査：記録写真 -[[OneDriveへのリンク>https://ksumail-my.sharepoint.com/:f:/g/personal/k24as030_st_kyusan-u_ac_jp/EjcvhRCqXZhOr_14x9XtEGYBz72LoRD86ZsQIM3fBRhE8A?e=bWlDI0]] ~ ***対象店舗 -オアシス ~ ~ **#01：2025.09.18 ***VIに関する基本情報 -[[PR TIMES CI・VI・BIとは？>https://prtimes.jp/magazine/ci-vi-bi/]] -[[（vi）の目的・作り方>https://ardem.co.jp/archives/blog/]] ~ ***モーションロゴの事例 -[[Motion Design >https://youtu.be/XH9Ev9I21tc?si=xhRdtbeB05yRnLh0]] -[[10 Famous Brands as Animated Logos Motion Graphics>https://youtu.be/HSX4zGnrMwk?si=vRmRPLk_4NMjdiSQ]] ~ ***モーションロゴの制作方法 -[[シェイプエフェクト>https://youtu.be/VxY-Ql4RA8k?si=XbEDM2IJFPlmVNr2]] -[[After Effects Logo Animation – Bouncing Ball on Text (Illustrator to AE)>https://youtu.be/PWsQ52l5pp0?si=duE3oYuOnUKZ2Zle]] ~ ***先行事例の調査：WEB・文献調査 -[[京都精華大学>https://www.kyoto-seika.ac.jp/campuslife/facilities/cafeteria.html]] -[[长崎大学>https://coop.kyushu-bauc.or.jp/nu-coop/info03/index.html]] -[[royal host>https://www.royalhost.jp/]] -[[やよい軒>https://www.yayoiken.com/]] ~ ***現状調査：学食の現在の様子（外観 内観 メニュー 商品） -店舗の概要 --1号館1階「Cafeteria OASIS」 --メニューはうどん・そば・ラーメン、定食、丼、カレーなど多彩で、さらに月ごとのフェアや限定メニューも提供されている --支払い方法は現金のほか、楽天Edyや交通系ICカードにも対応している -VIに関する良い点 --白と赤の椅子で統一された明るい内装で、清潔感がある --食券販売機とメニュー掲示が入口にまとめられており、利用の流れが分かりやすい --フェアメニューや期間限定の工夫があり、学生が飽きずに利用できる --VIに関する改善点 --メニュー掲示がやや散らばっており、初めて利用する人にとっては分かりにくい部分がある --昼のピーク時には座席がやや不足し、学生が席を探すのに時間がかかることがある ~ ~