福井涼/卒業研究 をテンプレートにして作成

開始行:
*集中空間ラボ 集中できる環境を整えるためのwebサイト #image(banner.png) -''Fukui Suzu'' -'''Keywords：sound, space, Immersive Websites''' //-https://www.example.com //-__[[相互評価シート>https://www.example.com]]__ ← ここ... -[[https://fki-sz.github.io/sound-lab./]] ~ //***CONTENTS //#contents2_1 //~ **概要 ***これは何？ //&color(red){これは何か・・を簡潔に}; 集中できる環境作りのサポートをする作業用webサイト ~ ***背景と目的 //&color(red){プロジェクトの背景と目的}; 在宅環境では、空間が変わらない・生活との区切りが曖昧・時... 本研究の目的は、音や視覚的な刺激によって“環境を切り替える... ~ ***コンセプト //&color(red){基本的な考え方、枠組み、視点など}; 作業用途に応じた作業環境を作る ~ ***成果物の仕様 //&color(red){&small(成果物の形式・サイズ・時間尺等);}; webサイト ~ //***メンバー //&color(red){共同プロジェクトの場合のみ｜メンバーと役割... ***制作ツール //&color(red){使用するツール｜ハードウエア・ソフトウエア}; HTML,CSS,JavaScript GarageBand ~ ***プロジェクトの期間 //&color(red){プロジェクトの期間｜20XX.XX.XX - 20XX.XX.XX... 2025.09.15- ~ ***まとめ //&color(red){プロジェクトが完結したら「まとめ」を記載し... ~ ~ **調査 ***現状調査 //&color(red){プロジェクトのテーマに関わる社会の現状と問... -[[サウンドデザインと時間の認識>https://uxdesign.cc/game-... -[[音の感覚の可視化表現>https://www.aichi-fam-u.ac.jp/aca... -[[環境音楽とは？アンビエントミュージックとの違い>https:/... ~ ***先行事例 //&color(red){プロジェクトのテーマに該当する先行事例の紹... -[[timemyflow>https://timemyflow.com/?utm_source=chatgpt.... -[[nature mixer>https://naturemixer.com/?utm_source=chat... ~ ***技法・技術情報 //&color(red){プロジェクトの遂行に必要な技法・技術に関す... -[[ボタンをクリックして背景を切り替えるJavaScript>https:/... -[[web制作：背景アニメーションガイド>https://kekenta-it-b... -[[JavaScriptで水や波、パーティクル等の動きを表現>https:/... -[[CSS/JavaScriptで作られた美しいアニメーション背景8戦>ht... -[[Vanta.js 公式>https://www.vantajs.com/?effect=dots]] -[[JavaScriptのライブラリVanta.jsでインタラクションな背景... -[[浮遊するボタンCSS>https://tabibitojin.com/css-floating... -[[ピクトグラム参考>https://pin.it/GEWXhF8Ps]] ~ ~ **プロジェクト管理 ***スケジュール //&color(red){計画的な遂行のために、進行管理表を作成して... [[ガントチャート>https://docs.google.com/spreadsheets/d/1... ~ ***ToDo //&color(red){やるべきこと（タスク）を箇条書きにします。}; //&color(red){完了後は「%%取り消し線%%」あるいは「// コメ... %%-テーマ案設定%% %%-webサイト参考調査%% %%-ターゲット調査・分析%% %%-サイト機能アイデア出し%% %%-空間構成アイデア出し%% %%-サイトマップ作成%% %%-ワイヤーフレーム作成%% %%-プロトタイプ作成%% %%-サウンド参考調査%% -サイトのフレーム完成 -サウンド試作 -コンテンツの完成 -webサイトへコンテンツ入れ込み //***NotToDo //&color(red){やらないこと：何をするかではなく「何をしな... //&color(red){例：10人以上の会議には出ない。苦手なことは... ~ ~ #hr CENTER:''進捗記録'' //&color(red){最新の情報を一番上に記載して下さい（古い記... #hr ~ ~ **2026.05.15 ***取り組み -サイト試作 -サウンド録音技術調査 -今後の流れ ~ ***サイト試作 -[[https://fki-sz.github.io/sound-lab./]] ~ ***現状調査 -[[フィールドレコーディング>https://www.audio-technica.co... -[[録音方法・機材>https://barbegenerativediary.com/sounds... -[[環境音の作り方や実音録音の例>https://unicorn-blog.jp/a... -[[機材>https://mamorio.biz/blog/field-recording]] ~ ***今後の流れ -サウンド構成について再検討を行う。現在使用している自然環... -実際の環境音を用いたサウンド制作を行うため、録音技術や編... -スマートフォンでの閲覧を想定し、レスポンシブデザインへの... -前回の情報デザイン研究の授業での意見を踏まえ、利用者が自... ~ ~ ~ **2026.05.08 ***取り組み -アイコン試作 -サイト試作 ~ ***サウンドアイコン [[サウンドアイコン試作>https://drive.google.com/file/d/12... ~ ***サイト試作 -[[https://fki-sz.github.io/sound-lab./]] ~ ~ **2026.05.01 ***取り組み -サウンド仮作成 -アイコン試作 ~ ***サウンド仮作成 音の特徴を言語化し、AIで生成。 -[[Pop Pop AI>https://poppop.ai/jp/]] ~ ***サウンドアイコン -[[参考>https://pin.it/16C4TgA2q]] -[[アイデアスケッチ>https://drive.google.com/drive/folder... ~ ~ **2026.04.24 ***取り組み -現状調査 -サウンド構成アイデア出し ~ ***現状調査 -[[集中と落ち着きのための自然音>https://campo.jp/nature-s... -[[タスクをする際に自然音をこうかについて>http://www.hsym... -[[勉強効果を高める音の科学と活用>https://mihata.jp/colum... -[[学びに最適な音環境とは>https://note.com/eps/n/n1af2228... -[[ブラウンノイズとは>https://amix-design.com/tl/tool-chi... -[[ブラウンノイズの効果>https://nntmapp.com/ja/blog/brown... ~ ***サウンド構成 心情を落ち着かせ集中力を高めるために、比較的低い音域のサ... 自然系のサウンドを多種配置することで、リラックス効果を高... 雑音やノイズを追加し、意識的に感じることのない何気ない環... ~ -自然系 --雨音 --流水 --波 --火 --森 --虫の音 --鳥 ~ -人的雑音系 --話し声 --紙の擦れる音 --外風 ~ -ノイズ --ブラウンノイズ ~ ~ **2026.04.17 ***取り組み -テーマ案決め -ワイヤーフレーム改正 ~ ***テーマ案 -集中できる環境を整えるためのwebサイト - ~ ***ワイヤーフレーム |#image(wireframe01.png)|#image(wireframe02.png)| |#image(wireframe03.png)|#image(wireframe04.png)| ~ ~ **2026.04.10 ***取り組み -テーマ案の整理 -現状調査 ~ ***テーマ案候補 -集中できる環境を整えるためのwebサイト //-音の絵本 - ~ ***現状調査 -[[サウンドスケープ>https://www.audio-technica.co.jp/alwa... //-[[音と絵本>https://pages.audiobook.jp/special/mimiehon... ~ ***memo -課題・観点 --環境がもたらす行動力への影響 //--便利が故の想像力の低下 ~ -興味 --言葉では表わせられない情報表現 --音の重なり - ~ ~ ~

終了行:
*集中空間ラボ 集中できる環境を整えるためのwebサイト #image(banner.png) -''Fukui Suzu'' -'''Keywords：sound, space, Immersive Websites''' //-https://www.example.com //-__[[相互評価シート>https://www.example.com]]__ ← ここ... -[[https://fki-sz.github.io/sound-lab./]] ~ //***CONTENTS //#contents2_1 //~ **概要 ***これは何？ //&color(red){これは何か・・を簡潔に}; 集中できる環境作りのサポートをする作業用webサイト ~ ***背景と目的 //&color(red){プロジェクトの背景と目的}; 在宅環境では、空間が変わらない・生活との区切りが曖昧・時... 本研究の目的は、音や視覚的な刺激によって“環境を切り替える... ~ ***コンセプト //&color(red){基本的な考え方、枠組み、視点など}; 作業用途に応じた作業環境を作る ~ ***成果物の仕様 //&color(red){&small(成果物の形式・サイズ・時間尺等);}; webサイト ~ //***メンバー //&color(red){共同プロジェクトの場合のみ｜メンバーと役割... ***制作ツール //&color(red){使用するツール｜ハードウエア・ソフトウエア}; HTML,CSS,JavaScript GarageBand ~ ***プロジェクトの期間 //&color(red){プロジェクトの期間｜20XX.XX.XX - 20XX.XX.XX... 2025.09.15- ~ ***まとめ //&color(red){プロジェクトが完結したら「まとめ」を記載し... ~ ~ **調査 ***現状調査 //&color(red){プロジェクトのテーマに関わる社会の現状と問... -[[サウンドデザインと時間の認識>https://uxdesign.cc/game-... -[[音の感覚の可視化表現>https://www.aichi-fam-u.ac.jp/aca... -[[環境音楽とは？アンビエントミュージックとの違い>https:/... ~ ***先行事例 //&color(red){プロジェクトのテーマに該当する先行事例の紹... -[[timemyflow>https://timemyflow.com/?utm_source=chatgpt.... -[[nature mixer>https://naturemixer.com/?utm_source=chat... ~ ***技法・技術情報 //&color(red){プロジェクトの遂行に必要な技法・技術に関す... -[[ボタンをクリックして背景を切り替えるJavaScript>https:/... -[[web制作：背景アニメーションガイド>https://kekenta-it-b... -[[JavaScriptで水や波、パーティクル等の動きを表現>https:/... -[[CSS/JavaScriptで作られた美しいアニメーション背景8戦>ht... -[[Vanta.js 公式>https://www.vantajs.com/?effect=dots]] -[[JavaScriptのライブラリVanta.jsでインタラクションな背景... -[[浮遊するボタンCSS>https://tabibitojin.com/css-floating... -[[ピクトグラム参考>https://pin.it/GEWXhF8Ps]] ~ ~ **プロジェクト管理 ***スケジュール //&color(red){計画的な遂行のために、進行管理表を作成して... [[ガントチャート>https://docs.google.com/spreadsheets/d/1... ~ ***ToDo //&color(red){やるべきこと（タスク）を箇条書きにします。}; //&color(red){完了後は「%%取り消し線%%」あるいは「// コメ... %%-テーマ案設定%% %%-webサイト参考調査%% %%-ターゲット調査・分析%% %%-サイト機能アイデア出し%% %%-空間構成アイデア出し%% %%-サイトマップ作成%% %%-ワイヤーフレーム作成%% %%-プロトタイプ作成%% %%-サウンド参考調査%% -サイトのフレーム完成 -サウンド試作 -コンテンツの完成 -webサイトへコンテンツ入れ込み //***NotToDo //&color(red){やらないこと：何をするかではなく「何をしな... //&color(red){例：10人以上の会議には出ない。苦手なことは... ~ ~ #hr CENTER:''進捗記録'' //&color(red){最新の情報を一番上に記載して下さい（古い記... #hr ~ ~ **2026.05.15 ***取り組み -サイト試作 -サウンド録音技術調査 -今後の流れ ~ ***サイト試作 -[[https://fki-sz.github.io/sound-lab./]] ~ ***現状調査 -[[フィールドレコーディング>https://www.audio-technica.co... -[[録音方法・機材>https://barbegenerativediary.com/sounds... -[[環境音の作り方や実音録音の例>https://unicorn-blog.jp/a... -[[機材>https://mamorio.biz/blog/field-recording]] ~ ***今後の流れ -サウンド構成について再検討を行う。現在使用している自然環... -実際の環境音を用いたサウンド制作を行うため、録音技術や編... -スマートフォンでの閲覧を想定し、レスポンシブデザインへの... -前回の情報デザイン研究の授業での意見を踏まえ、利用者が自... ~ ~ ~ **2026.05.08 ***取り組み -アイコン試作 -サイト試作 ~ ***サウンドアイコン [[サウンドアイコン試作>https://drive.google.com/file/d/12... ~ ***サイト試作 -[[https://fki-sz.github.io/sound-lab./]] ~ ~ **2026.05.01 ***取り組み -サウンド仮作成 -アイコン試作 ~ ***サウンド仮作成 音の特徴を言語化し、AIで生成。 -[[Pop Pop AI>https://poppop.ai/jp/]] ~ ***サウンドアイコン -[[参考>https://pin.it/16C4TgA2q]] -[[アイデアスケッチ>https://drive.google.com/drive/folder... ~ ~ **2026.04.24 ***取り組み -現状調査 -サウンド構成アイデア出し ~ ***現状調査 -[[集中と落ち着きのための自然音>https://campo.jp/nature-s... -[[タスクをする際に自然音をこうかについて>http://www.hsym... -[[勉強効果を高める音の科学と活用>https://mihata.jp/colum... -[[学びに最適な音環境とは>https://note.com/eps/n/n1af2228... -[[ブラウンノイズとは>https://amix-design.com/tl/tool-chi... -[[ブラウンノイズの効果>https://nntmapp.com/ja/blog/brown... ~ ***サウンド構成 心情を落ち着かせ集中力を高めるために、比較的低い音域のサ... 自然系のサウンドを多種配置することで、リラックス効果を高... 雑音やノイズを追加し、意識的に感じることのない何気ない環... ~ -自然系 --雨音 --流水 --波 --火 --森 --虫の音 --鳥 ~ -人的雑音系 --話し声 --紙の擦れる音 --外風 ~ -ノイズ --ブラウンノイズ ~ ~ **2026.04.17 ***取り組み -テーマ案決め -ワイヤーフレーム改正 ~ ***テーマ案 -集中できる環境を整えるためのwebサイト - ~ ***ワイヤーフレーム |#image(wireframe01.png)|#image(wireframe02.png)| |#image(wireframe03.png)|#image(wireframe04.png)| ~ ~ **2026.04.10 ***取り組み -テーマ案の整理 -現状調査 ~ ***テーマ案候補 -集中できる環境を整えるためのwebサイト //-音の絵本 - ~ ***現状調査 -[[サウンドスケープ>https://www.audio-technica.co.jp/alwa... //-[[音と絵本>https://pages.audiobook.jp/special/mimiehon... ~ ***memo -課題・観点 --環境がもたらす行動力への影響 //--便利が故の想像力の低下 ~ -興味 --言葉では表わせられない情報表現 --音の重なり - ~ ~ ~

ページ名: