#author("2021-12-17T10:58:05+09:00;2021-12-03T21:49:46+09:00","default:member","member") *[[Imagine by Sounds>http://basement.starfree.jp/imaginebysounds/]] 自然環境音を通じて自然の美しさを伝え、環境保護に寄与するデザイン研究 #image(深江沙羅/卒業研究I/mainvisual.jpg,center,100%) //&image(mainvisual.jpg,center,100%); -'''Keywords：Web design(HTML/CSS/jQuery) , DTP''' [[http://basement.starfree.jp/imaginebysounds/>http://basement.starfree.jp/imaginebysounds/]] [[モックアップ>https://xd.adobe.com/view/2f4c5bf6-f4af-4083-8eb6-f1b199d94838-7a1f/?fullscreen&hints=off]] #author("2026-04-02T15:56:32+09:00","default:inoue.ko","inoue.ko") ~ **Overview ~ ~ ***Introduction / What is This //&color(red){これは何か・・を簡潔に}; Webサイトと紙媒体を利用して自然環境の美しさを伝えるサービス ~ ~ ***Background and Purpose -環境問題の深刻化に向けて、近年啓発が盛んに行われている。 -アンケート調査によると環境配慮意識・行動は高まっている傾向が見受けられたので、問題喚起ではなく自然の美しさ、大切さを感じてもらえるものが作りたいと考えた。 ~ ~ ***Concept プロジェクトを構成する要素 ~ -音響(自然環境音) Webサイトで再生。 ~ --自然環境音は心身の疲労回復やストレスの低減効果など、ポジティブな効果を引き起こすことが立証されている。 参考：[[自然環境の映像と音がストレス低減に及ぼす影響 - 立教大学>http://www.myschedule.jp/jpa2014/tex_output/source/jpa2014_poster/90529.pdf]] --人間にとって快く感じ、娯楽ともなりうる音響を取っ掛かりとした。 ~ -ライティング [[ストーリーテリング>https://ja.wikipedia.org/wiki/%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AA%E3%83%BC%E3%83%86%E3%83%AA%E3%83%B3%E3%82%B0]]の手法を用いてショートストーリーをリーフレットに掲載。 写真と合わせて読んでもらうようにし、文章が苦手な人にとっても平易化する。 他人に依頼することも検討。 ~ -写真 リーフレット、Webサイトに掲載。 ~ -映像 Webサイトに掲載。 ~ ~ ***Output -サービスフロー #image(深江沙羅/卒業研究I/flow.jpg,center,100%) ~ -リーフレット ~ &image(lef_1.png,center,100%); &image(lef_2.png,center,100%); &image(lef_3.png,center,100%); ~ -配布用小冊子 ~ &image(m_lef1.JPG,center,100%); &image(m_lef2.JPG,center,100%); ~ -Webサイトのモックアップ ~ [[ユーザーテスト用モックアップ>https://xd.adobe.com/view/2f4c5bf6-f4af-4083-8eb6-f1b199d94838-7a1f/?fullscreen&hints=off]] ~ //#youtube(EJMrEQbHpv4) //&color(red){成果物の直接掲載またはリンク誘導}; //&color(red){&small(プロジェクトの途上では、試作品等、視覚的な資料を掲載・リンクして下さい。);}; //&color(red){&small(成果物の形式・サイズ・時間尺等の基本情報も記載して下さい。);}; ~ ~ -Webサイト用の動画・音声(試作) ~ #youtube(h1hY8CyJb98) #youtube(CIrsJonC0T8) #youtube(S6v25Rq5AwI) ~ ~ ***Tools ''Webサイト'' 音響の再生や、写真・動画の掲載。 ~ ''紙媒体'' リーフレット Webサイトを読み込むためのQRコード、ショートストーリーを記載。 ※複数のパターン ~ -なぜ紙媒体とWeb媒体を併用するのか？ --Webページは検索からの流入など、元々コンテンツに一定の興味がある人が閲覧する傾向にある。 --誰でも閲覧・利用できるサービスというコンセプトから紙媒体を採用。 ~ ''撮影機材'' FUJIFILM X-T30 ~ ''音声録音'' TASCAM DR-07X ~ ''紙素材'' ガイアA クリーム ~ ''ソフト'' Adobe Illustrator Photoshop Premiere pro Audition XD CLIP STUDIO PAINT ~ ~ ***Term 2021.04〜2021.10 ~ //***Conclusion / Summary //&color(red){プロジェクトが完結したら「まとめ」を記載して下さい。}; ~ **Survey ~ ~ ***Present Status -アンケート調査 [[環境意識(環境に配慮した行動)を日頃から意識づけていますか？ -ミルトーク>https://milltalk.jp/boards/95430]] ---20〜60代男女30人に「日頃から環境に配慮した行動をしているか」またその理由を調査した。アンケート日は2021年6月3日。 ---していると回答した人は約87%、していない人は約13%だった。 メディアの影響や社会全体の意識の高まりもあり、多くの人が自覚している範囲内では環境意識を持っているという結果になった。 ~ -環境問題の概要を調査・把握。 --[[環境保全のために普段の暮らしの中でできること -WWF JAPAN>https://www.wwf.or.jp/daily/]] --[[環境のために、できることからはじめよう -さいたま市>https://www.city.saitama.jp/001/009/006/p073875.html]] ~ -五感においての情報判断の優先順位を調査。 --[[産業教育機器システム便覧>https://ci.nii.ac.jp/ncid/BN00843446]] 視覚が最も優先順位として高く(83.0％)、次点が聴覚(11.0％)。 --[[参考：五感情報通信技術>https://www.jstage.jst.go.jp/article/sobim/31/2/31_2_71/_pdf]] ~ ~ ***Precedent //&color(red){先行事例の紹介、傾向分析など}; -先行事例 --[[おととめし>https://www.lumine.ne.jp/tabilumine/ototomeshi/]] ---購入した弁当に記載されたQRコードを読み取り、音を楽しみながら食事をするというサービス。本プロジェクトイメージに近い。 --[[プレミアムモルツ 特別な時間 -サントリー>https://www.suntory.co.jp/beer/thepremiummalts/special/]] --[[TRAIL WORKS -BEAMS>https://www.beams.co.jp/special/happyoutside/trailworks/]] ---写真と文章を構成してストーリー仕立てにしている。 ~ ~ ***Technique / Technology //&color(red){プロジェクトの遂行に必要な技法・技術に関する調査}; -[[何のために「UXデザイン」をするのか - UX MILK>https://uxmilk.jp/79718]] -[[UXデザインプロセスにおける基本的な6ステップ>https://blog.btrax.com/jp/ux-design-process/]] ---UXの基礎知識理解 -[[環境音 - 効果音ラボ>https://soundeffect-lab.info/sound/environment/]] ---環境音の種類把握 -[[電車は遅れておりますが>http://denokure.com]] ---ストーリーテリングのテイストとして参考にしたい。 ~ ~ **Project Management ~ ~ ***Schedule //&color(red){計画的な遂行のために、進行管理表を作成してリンクして下さい。}; [[卒業研究進行表>https://docs.google.com/spreadsheets/d/19Nqnl0hWJtXygmY7f32yG03QVK1geO39nKenB_0vkF0/edit?usp=sharing]] ~ ~ ***ToDo 1.Webサイトのブラッシュアップ 2.Githubにデータをあげる 3.印刷 //&color(red){やるべきこと（タスク）を箇条書きにします。}; //&color(red){完了後は「%%取り消し線%%」あるいは「// コメントアウト」」}; ~ ~ ~ #hr CENTER:''worklog'' #hr ~ ***[ 2021.12.02 ] ***制作 --リーフレットの展示用と配布用のデータを制作した。 --コーディング ~ -成果 --制作を進めた。 ~ ***[ 2021.11.25 ] ***制作 --リーフレットの展示用と配布用のデータを制作した。 ~ -成果 --制作を進めた。 ~ ***[ 2021.11.15 ] ***制作 --コーディング ~ -成果 --制作を進めた。 ~ ***[ 2021.11.09 ] ***制作 --リーフレット制作 横長のB7(マシュマロ200kg)に印刷 ~ -成果 --制作を進めた。 ~ ***[ 2021.11.04 ] ***制作 --リーフレット制作 B7・B6とサイズの異なる紙に印刷し読みやすさを試した。 B6想定で制作していたがB7のほうが読みやすさがあった。 ~ -成果 --制作を進めた。 ~ ***[ 2021.10.29 ] ***制作 --リーフレット制作 実際の紙に印刷し色味やズレなど問題点を確認した。 ~ -成果 --制作を進めた。 ~ ***[ 2021.10.28 ] ***制作 --リーフレット制作 リーフレットを制作した。 ~ -成果 --制作を進めた。 ~ ***[ 2021.10.22 ] ***制作 --コーディング モックアップに従ってHTML/CSSをコーディングした。 ~ -成果 --コーディングを進めた。 ~ ~ ***[ 2021.10.21 ] ***企画 --細かな点の修正 ---制作を進めていくにあたり、Webサイト上では1分間の音声を再生する想定だったが1分間では単調に感じられるため30秒に短縮した。 ~ ***制作 --コーディング モックアップに従ってHTML/CSSをコーディングした。 ~ -成果 --コーディングを進めた。 ~ ***[ 2021.10.20 ] ***制作 --コーディング モックアップに従ってHTML/CSSをコーディングした。 ~ -成果 --コーディングを進めた。 ~ ***[ 2021.10.18 ] ***制作 --コーディング モックアップに従ってHTML/CSSをコーディングした。 ~ -成果 --コーディングを進めた。 ~ ***[ 2021.10.14 ] ***制作 --映像撮影・音声収録 各機材を使用して音声・映像を収録した。 #youtube(S6v25Rq5AwI) ~ -成果 --バリエーションを増やす作業に着手した。 ~ ***[ 2021.10.12 ] ***制作 --映像撮影・音声収録 各機材を使用して焚火の音声・映像を収録した。 #youtube(CIrsJonC0T8) ~ -成果 --バリエーションを増やす作業に着手した。 --コーディングの進捗が遅れているため同時並行で進めるようスケジュールを再調整した。 ~ ***[ 2021.10.6 ] ***制作 --コーディング ~ -成果 --制作を進めた。 ~ ***[ 2021.09.30 ] ***制作 --サンプルサイトをサーバーにアップロード http://basement.starfree.jp/imaginebysounds/ ~ ***企画 --スケジュールの見直し ~ -成果 --進捗を俯瞰しタスクをまとめた。 ~ ~ ***[ 2021.09.23 ] ***調査 --Pintarestなどを利用して紙製の容器について調査を進めた。 ---[[colon coffee roasters>https://coloncoffee.theshop.jp/items/34808644]] ---[[John masters organics ラッピングバッグ>https://www.johnmasters-select.jp/products/gif0183]] ~ --研究事例の参考。 ---[[flerco note>https://trinus.jp/developments/6]] ~ -成果 調査を進めた。 ~ ~ ~ ~