山田洸太/卒業研究 をテンプレートにして作成

開始行:
*Mutedscapes ビルの窓ガラスに映る時間軸と空間を記録するタイムラプスと... #image(mockup_16-9.jpg) //メインビジュアル、あるいは //プロジェクトの最新の状態を視覚的に掲載 -''Kota Yamada'' -'''Keywords：Building, Reflection, Time Lapse, Photo, We... -https://adamay-design.github.io/mutedscapes/ -https://www.youtube.com/@mutedscapes //-__[[アンケート調査>https://forms.gle/rUDMoEjV5q68pagU9... //-__[[相互評価シート>https://www.example.com]]__ ← ここ... ~ **概要 //***これは何？ //タイムラプスと写真でガラスに反射する世界の魅力を伝えるW... //&color(red){これは何か・・を簡潔に}; ***背景 近年、福岡市は大規模な再開発により、多くの主要なビルの外... ~ ***目的 そこで本研究では、無機質なビルにも存在する時間の流れをタ... //&color(red){プロジェクトの背景と目的}; ~ ***成果物の仕様 -タイムラプス サイズ：3840×2160px 長さ：20秒程度（ループ再生） 本数：6本 -写真 アスペクト比：3:2 枚数：52枚 -Webサイト 形式：マルチページ //&color(red){&small(成果物の形式・サイズ・時間尺等);}; ~ ***制作ツール -ハードウェア --一眼レフカメラ（Sony α7 III） -ソフトウェア --Lightroom --Illustrator --After Effect --Visual Studio Code //&color(red){使用するツール｜ハードウエア・ソフトウエア}; ~ ***プロジェクトの期間 プロジェクトの期間｜2023.04.14 - 2023.12.22 //&color(red){プロジェクトの期間｜2023.04.14 - 2023.12.22... ~ ***現状調査 被写体となる高層建築の現状（ガラス張りのビルの増加した要... -電気代の削減 自然光を取り込めるため電力の使用を軽減でき、結果として省... -ビルの軽量化 コンクリート外壁は重量があるため、ビルを支えるのに膨大な... -カーテンウォールの採用 構造上の荷重を負担しない間仕切り壁と同様の非耐力壁である... ~ ***コンセプト -ロゴタイプ 幾何学的な窓のフレームを意識して制作。窓が反射する様子か... |#image(mutedscapes-logo.png)| -タイトル 『Mutedscapes』は、英語で無音や抑制されたを意味する「mute... //&color(red){基本的な考え方、枠組み、視点など}; ~ ***コンテンツ制作 -タイムラプス 被写界深度を深く設定することで景色の奥行きを表現し、2秒間... -写真 映像では見逃してしまうような微細な部分や、タイムラプスと... #image(before-after.jpg) ~ ***Webサイト -サイトマップ |#image(sitemap.png)| -トップページ サイトの閲覧者が何のサイトであるのか瞬時に分かるようにタ... |#image(mockup-top.jpg)| -タイムラプスページ 試作ではYouTubeのiframeでの埋め込みを試したが、コントロー... |#image(mockup-timelapse1.png)|#image(mockup-timelapse2.j... -マップページ 作品に関心を持った方が、実際にビルに映る景色を現地で観察... |#image(mockup-map.png)| -フォトギャラリーページ 撮影場所ごとに写真をカテゴリ分けできるボタンを導入するこ... |#image(mockup-photo.jpg)|#image(iphone-mockup.png)| ~ ***YouTube #youtube(Zs8Gb-7_q4g) -動画内容 YouTube内でループ再生の設定しなくてもゆったりと映像を観る... -投稿テンプレート --サムネイル #image(ksubldg2-thumbnail.jpg) --タイトル Mutedscapes #1 - Kyushu Sangyo University Bldg.2 (4K Time... --説明 Equipment：Sony ILCE-7M3, FE 24-70mm F4 ZA OSS Settings：ISO 100, 40mm, f/22 DateTime：6 July, 2023 - 16:29-17:36 Address：2-3-1, Matsukadai, Fukuoka-Shi Higashi-Ku, Fukuo... Website：https://adamay-design.github.io/mutedscapes/ ~ ***まとめ 本研究及び制作を通じて、「人工物であるビルと自然物である... //&color(red){プロジェクトが完結したら「まとめ」を記載し... ~ ~ **調査 ***先行事例 -[[光のパブリックポリシー4 夜間景観照明1>https://alg.jp/b... ALG‐建築照明計画株式会社による建築照明デザインによって景... -[[Moraine Lake Sunrise Timelapse - 4K>https://youtu.be/d... カナダ･アルバータ州にあるモレーン湖をタイムラプスで記録し... -[[神戸港クルーズ船ポータルサイト>https://cruise-kobe.com... Webサイトのトップページに映像を配置することで、訪問者が短... ~ ***被写体となる高層建築の現状（ガラス張りの増加） -ガラス張りのビルの増加した要因 --電気代の削減 自然光を取り込めるため電気の使用を軽減でき、結果として省... --ビルの軽量化 コンクリート外壁は重量があるため、ビルを支えるのに膨大な... --カーテンウォールの採用 構造上の荷重を負担しない間仕切り壁と同様の非耐力壁である... ~ ***技法・技術情報 -タイムラプス｜用語集｜細胞×画像ラボ https://www.healthcare.nikon.com/ja/ss/cell-image-lab/glo... -タイムラプス動画を作成する| 使いかた | Imaging Edge Desk... https://support.d-imaging.sony.co.jp/app/imagingedge/ja/i... -構図で写真が見違える！カメラ初心者が本当に使える６つの基... https://camera-web.jp/beginner/kouzu/kouzu-basic -Lesson20：高層ビル群 - レンズレッスン https://www.nikon-image.com/enjoy/phototech/lenslesson/le... //&color(red){プロジェクトの遂行に必要な技法・技術に関す... ~ 【参考】 -高層ビルがガラス張りな理由 https://www.takabonblog.com/entry/building -1970年代に総ガラス張りの建物を建てるのがいかに大変だったか https://www.gizmodo.jp/2011/03/1976.html -東建コーポレーション"カーテンウォール - 建築用語" https://www.token.co.jp/estate/useful/archipedia/word.php... -都市景観と巨大建築 https://www.10plus1.jp/monthly/2013/12/issue02.php -高層建築物が景観価値に与える影響に関する研究 https://tsukuba.repo.nii.ac.jp //&color(red){プロジェクトのテーマに関わる社会の現状と問... ~ ~ ~ **プロジェクト管理 ***スケジュール [[__スプレッドシート__>https://docs.google.com/spreadshee... //&color(red){計画的な遂行のために、進行管理表を作成して... ~ //***ToDo //-%%タイムラプス制作方法調査%% //-%%試作の制作%% //-%%サイトマップの制作%% //-%%Webサイトの大まかな枠組みの作成%% //-%%フォトギャラリーページの制作%% //-%%Instagramの開設%% //-%%Youtubeチャンネルの開設%% //-Webサイトの動画の埋め込み //-Webサイトの概要ページの更新 //-ロゴマークの制作 //&color(red){やるべきこと（タスク）を箇条書きにします。}; //&color(red){完了後は「%%取り消し線%%」あるいは「// コメ... //***NotToDo //&color(red){やらないこと：何をするかではなく「何をしな... //&color(red){例：10人以上の会議には出ない。苦手なことは... ~ ~ #hr CENTER:''進捗記録'' //&color(red){最新の情報を一番上に記載して下さい（古い記... #hr ~ ~ **2023.12.22 ***説明パネル -2枚目のパネルは一枚ではなく複数枚の写真を組み合わせる形... -背景は画像でも可 -数字の下の余白が1マスになっているため2マスに修正 ***卒展日程 期間：2月16日〜2月23日 搬入：2月14日, 15日 撤収：2月23日 ***ブラッシュアップ 締切：1月15日までに学科サイト更新 ~ ~ **2023.12.15 ***Webサイト -Aboutページに制作者情報を記載 -タイムラプスの詳細に建築物の高さ・竣工日・デザイナー等を... -PhotoページとTimeLapseページのコンテンツ同士のmarginを合... -トップページの縦スクロールを誘導する工夫 https://www.leadplus.co.jp/blog/design-pattern-for-user-e... -トップページレイアウトの改善 -https://www.webcreatorbox.com/tech/video-background ***YouTube掲載する際のテキスト例 -タイトル Mutedscapes - Solaria Terminal Building (4K TimeLapse) -説明欄 [Equipment] Sony ILCE-7M3, FE 24-70mm F4 ZA OSS [Settings] ISO 640, 52mm, f/20 [DateTime] 12 September, 2023 - 8:52-10:12 [Address] 2-1-1, Tenjin, Fukuoka-Shi Chuo-Ku, Fukuoka, 810-0001, Ja... ~ ~ **2023.12.8 ***最終審査 -トップページのバグ -英語表記に統一 -ページごとの世界観の統一（TimeLapseページとPhotoページ） -サイトの情報やコンテンツの拡充 -マップページのブラッシュアップ（レスポンシブ対応、ピンの... -タイムラプスの奥行きを意識した撮影をより強く ***フォントの再調整 -Afacad（Regular 400） -Roboto Condensed（Regular 400） -Teko（Light 300） -Rajdhani（Regular 400） ~ ~ **2023.12.1 ***Webサイト -マップページ 作品に関心を持った方が、実際にビルに映る景色を現地で観察... |#image(imac-mockup-map.jpg)| ~ ~ **2023.11.24 ***Webサイト -タイムラプスページ 試作ではYouTubeのiframeでの埋め込みを試したが、コントロー... |#image(imac-mockup-timelapse2.jpg)|#image(imac-mockup-ti... -フォトギャラリーページ 撮影場所ごとに写真をカテゴリ分けできるボタンを導入するこ... |#image(imac-mockup-photo.jpg)|#image(iphone-mockup.png)| ~ ~ **2023.11.17 ***YouTube掲載する際のテキスト例 -タイトル Mutedscapes - No.001 (4K TimeLapse) -説明欄 『九州産業大学』 ［場所］〒813-0004 福岡県福岡市東区松香台2丁目3−1 ［日時］2023年9月24日 16:29-17:36 ［機材］Sony ILCE-7M3, FE24-70mm F4 ZA OSS (LENS) ［設定］ISO 100, 40mm, f/22 ~ ~ **2023.11.10 ***Webサイト -トップページ背景に流れる映像の画質を向上 これまで圧縮の際にフルHDに縮小していたところを映像サイズ... -ヘッダー等にグラスモーフィズムを採用 ヘッダーやセクション部分の背景にブラーや影をつけることで... ~ ~ **2023.10.27 ***Webサイト -タイムラプスページのタイトルのサイズ変更 文字要素を小さくし、映像以外の要素は控えめに表示する。 ~ ~ **2023.10.20 ***中間審査 -タイムラプス掲載ページの調整 --各動画ごとに1ページ --YouTubeの動画タイトルの検討 --サイト上でのタイトルのサイズ感 --動画タイトルとサイト上での文字サイズや文字情報のメリハリ --大画面で楽しめるように幅いっぱいで表示する --動画埋め込みの方法の研究 --4Kでの掲載 -ヘッダーの文字サイズの縮小 ~ ~ **2023.10.13 ***タイムラプス -書き出した画像素材をタイムラプスへ変換・編集 --映像のブレをワープスタビライザーを使い軽減。 --変化の心地よい部分を抜粋。 --フェードによってループ再生にしても違和感がないよう調整。 ~ ~ **2023.10.06 ***タイムラプス -撮影した画像素材のレタッチ・書き出し --雲が鮮明に見えるように、コントラストやハイライト、シャ... ~ ~ **2023.09.29 ***Webサイト -概要ページ等のレスポンシブ対応 --フレックスボックスを使用し、横並びのキャプションと画像... ~ ~ **2023.09.22 ***Webサイト 誘目性の向上を目的としたスライドショーを設置。 ***タイムラプス 西鉄福岡駅で撮影を実施。 ~ ~ **2023.09.15 ***Webサイト パララックスを活用し、トップページ下部に概説の配置を実施。 ~ ~ **2023.07.21 ***Webデザイン案 -概要ページをトップページ下部に配置 パララックスを用いて、トップページより手前に概要ページを... ~ ~ **2023.07.14 ***各種アカウントの登録・開設 -YouTube 動画を高画質で視聴してもらうために使用する。当初は、Webサ... -Instagram 写真は通常投稿、タイムラプスはリールで投稿を行う。ただし... -Vimeo Youtubeに比べ、動画埋め込みの際の自由度が高い。しかし、フ... ~ ~ ***メモ -サイトの世界観の妨げになる埋め込み機能の再検討 -バグの原因になるためフォルダ名にスペースを使用しない 「Time Lapse」▶「TimeLapse」 -タイムラプスと写真の役割の明確化 -GIFやシネマグラフの検討 -長時間撮影や日没の撮影で時間の変化を強調 -タイムラプスと写真の同一項目で表示 -キャプションに撮影場所時間の明記 -ビルの歪みをPhotoshopで修正 -映像の自動再生 -受動的なサイトづくり ~ ~ **2023.07.07 ***Webサイト進捗 -トップページ #image(mutedscape0714.jpg) -ハンバーガーメニューの実装 #image(web-menu.png) -フォトギャラリー #image(web-photo.jpg) ~ ***タイムラプス試作 #Youtube(9vvYAffKw1Q) 場所：九州産業大学2号館 撮影間隔：2秒 #Youtube(w34AXRHpbIg) 場所：福岡ダイヤモンドビル 撮影間隔：3秒 ~ ***写真試作 |#image(DSC00810.jpg)|#image(DSC00893.jpg)| |#image(DSC00751.jpg)|#image(DSC07239.jpg)| ~ ***メモ -最終的にプロジェクト概要のスライドを制作 ~ ~ **2023.06.30 ***メインタイトル案 -Muted Realities（静かな現実） -Muted Existences （静かな存在） -Muted Realms（静かな領域） -Alternate Realities（別の現実） -Mutedscape（静かな景色）※造語 ~ ~ ***Webデザイン案 -ヘッダーを黒・透明度50%に設定 ~ ~ **2023.06.23 ***撮影のアイデア -構図 上を見上げるような構図 #image(DSC00901.jpg) -撮影詳細 間隔：2秒 撮影枚数：1800枚程度 撮影時間：1時間 映像時間：1分程度 ~ ***背景と目的の修正 -背景 近年、福岡市では都市開発が進み、天神ビッグバンや福岡コネ... -目的 情報量が多く騒がしい世の中、私たちは気付かぬうちに数多く... ~ ~ **2023.06.16 ***Webデザインのコンセプト ビルのイメージとして直線や直角など無機質な雰囲気を基調に... ~ ~ **2023.06.09 ***中間報告メモ -試作 --写真の試作掲載 --窓ガラスの狭いビルを撮影した試作動画の掲載 -Webサイト --撮影場所をマップにまとめる --方角を記載 -背景・目的 --ガラスの多いビルが増えること＝景観向上にはならない --地震などのリスク面も最終レポートでは記載 -撮影・編集 --時間経過を遅くすることで見る人に気づきを与える --窓ガラスを切り取り撮影すると比較にならないため全体像と... --枚数を多く撮影し、心地よい部分を切り取る --雨上がりや雨の降り始めは雲の動きがあるためその時間を狙... --北に背を向けて撮るなど方角を意識して撮影 --エリア別に撮影 ~ ***ガラス張りのビルの増加した要因 -電気代削減 自然光を取り込めるため人工光の使用を減らせる。 省エネ効果が期待できる。 -ビルの軽量化 コンクリートの外壁は重く膨大なコストを要する。 ガラスを使用することでコスト削減になる。 -安全性 地震や台風の影響を受けにくいカーテンウォール*¹の採用。 ガラス張りのビルを建設しやすくなった。 ~ *** *¹カーテンウォール 建物において構造上の荷重を負担しない、間仕切り壁などと同... 引用元：東建コーポレーション"カーテンウォール - 建築用語" https://www.token.co.jp/estate/useful/archipedia/word.php? ~ ***ガラス張りのビルの増加による弊害 -反射光によるトラブル https://www.nikkei.com/article/DGXNASFK2801Q_Y0A720C10000... -防音性の低下 視界が遮られるタイプの壁と比較してガラス壁は50～100％も音... https://www.estie.jp/products/finder/magazine/article/gla... -プライバシー面での懸念 ~ ~ **2023.06.02 ***試作 #Youtube(slGUC4uGmaw) -撮影設定 撮影間隔：10秒 撮影枚数：600枚 動画秒数：20秒 ~ **2023.05.26 ***試作 #Youtube(WVrbd3NVYko) -撮影設定 F値：F/9 ISO：500 露出プログラム：絞り優先 撮影間隔：15秒 撮影枚数：600枚 動画秒数：20秒 ~ #Youtube(ebfYH1IycC4) -撮影設定 F値：F/10 ISO：500 露出プログラム：絞り優先 撮影間隔：7秒 撮影枚数：500枚 動画秒数：17秒 ~ ~ **2023.05.19 ***コンセプト //ここ数年で福岡は、航空規制の緩和などもあり都市開発が加... //そこで景観保全 //ビルが増えることは果たして、景観の向上なのか。それとも... //一面ガラス張りなど、窓の面積が比較的広いビルが増えてい... ~ ***アイデア案 -都市高速をタイムラプスで撮影 ~ ***試作 #Youtube(3IhFJA01lhg) -撮影情報 F値：F/8 ISO：400 露出プログラム：絞り優先 撮影間隔：20秒 撮影枚数：150枚 動画秒数：6秒 -撮影機材 本体：Sony α7 III レンズ：SAMYANG AF 75mm F1.8 FE -メモ 少し移り変わりが速く感じたため、一枚あたりの秒数を長くす... 動画の時間が10秒以下だと物足りないため、20秒から30秒は欲... 600枚から900枚撮影する必要がある。 ~ ***技法・技術情報 -絞り優先モードの使用 画角に入る建物のどこまでピントを合わせるのか調整するため -Lightroomでレタッチの同期 まとめて同じ設定で現像が可能になる ~ ~ **2023.05.12 ***アイデア案 -Webサイト上でビル巡りマップを制作 -タイムラプスで雲の動きを撮影 --30分程度、試験的に撮影 -ビルに映る月や雨の水滴の撮影 ~ ~ **2023.04.29 ***試作 |#image(IMG_1929.jpg)|#image(IMG_1926.jpg)|#image(IMG_193... -撮影機材：iPhone 12 -撮影場所：博多区 （05.11更新） ~ ***アイデア案 -ビルの窓ガラスに反射を生かした写真 --なぜビルなのか？ →格子状、垂直、窓の面積が広い --何が反射している様子を撮るのか？ →日常、天候、時間、色相、明暗 --なぜ福岡で撮るのか？ 全国の都市で撮影するうちの一つとして、今回は福岡を取り上... （05.10更新） ~ ***メモ -写真 --錆 --トタン -3DCG --日常品に芝生を 便利な世の中になる一方で、緑を見る機会が減っている。 緑はストレスを緩和したり、目の疲れを和らげる効果もあると... 3DCGであればBlender。写真合成ならPhotoshop使用。 ~ **2023.04.21 ***アイデア案 -都市高散歩ブラッシュアップ案 --撮影機材をiPhoneから一眼レフカメラに変更 --ロゴやフォントのリデザイン --写真集の文字情報等の拡充 --Webサイトの再構築 --Googleアナリティクスの活用 --写真の世界観の統一 --老朽化をより感じ取れる写真集 →老朽化を強調したい写真はモノクロで表現 →新しい建物等との対比 ~ -緑だけを集めた図鑑 or 写真集 --緑には目の緊張を緩和させたり、心を穏やかにする効果がある --写真として取り上げることで日常に隠れる緑を意識するよう... ~ ***現状調査 -新緑の季節　緑色を見るとどんな効果がある？ https://weathernews.jp/s/topics/202104/270295/ -「緑を見ると目にいい」って本当？ https://weathernews.jp/s/topics/201905/200125/ ~ ***先行事例 -青い生きもの図鑑 →色を統一する面白さ https://amzn.asia/d/fopU4pu ~ **2023.04.14 ***アイデア案 -写真 --環境に配慮された建築の図鑑制作 →フォトギャラリーサイト、図鑑（写真集）、マップ --落とし物をひたすら撮る //--都市開発で変わりゆく福岡を記録 --自動販売機・バリアフリー・踏切・廃墟 →写真集、マップ（例）自動販売機でいうとどこに何が売ってい... -グラフィックデザイン --福岡都市高速 インター出入り口等のシンボルマーク制作 →パンフレット等 （04.14更新） ~ -メモ 工事現場、鉄骨、足場 看板、標識、ピクトグラム、ロゴ、タイポグラフィ 福岡っぽい 色別やジャンルで分類 色で見る福岡「福岡×色」 サイトは白を基調とする →写真の色彩を引き立たせる （04.18更新） ~ ***現状調査 -海外事例に学ぶ。“色”で社会問題に光を当てた啓発動画 https://insights.amana.jp/article/24273/ -シンボルカラー…病気や障害、色で啓発 https://yomidr.yomiuri.co.jp/article/20160615-OYTET50039/ ~ //***XXXXXXX //- //~ //~ //**20XX.XX.XX //***XXXXXX //- //~ //***XXX //- //~ //~ 参考 -https://www-w3schools-com.translate.goog/html/html_intro... [[Google:html5 semantic template]] ~ ~ ~

終了行:
*Mutedscapes ビルの窓ガラスに映る時間軸と空間を記録するタイムラプスと... #image(mockup_16-9.jpg) //メインビジュアル、あるいは //プロジェクトの最新の状態を視覚的に掲載 -''Kota Yamada'' -'''Keywords：Building, Reflection, Time Lapse, Photo, We... -https://adamay-design.github.io/mutedscapes/ -https://www.youtube.com/@mutedscapes //-__[[アンケート調査>https://forms.gle/rUDMoEjV5q68pagU9... //-__[[相互評価シート>https://www.example.com]]__ ← ここ... ~ **概要 //***これは何？ //タイムラプスと写真でガラスに反射する世界の魅力を伝えるW... //&color(red){これは何か・・を簡潔に}; ***背景 近年、福岡市は大規模な再開発により、多くの主要なビルの外... ~ ***目的 そこで本研究では、無機質なビルにも存在する時間の流れをタ... //&color(red){プロジェクトの背景と目的}; ~ ***成果物の仕様 -タイムラプス サイズ：3840×2160px 長さ：20秒程度（ループ再生） 本数：6本 -写真 アスペクト比：3:2 枚数：52枚 -Webサイト 形式：マルチページ //&color(red){&small(成果物の形式・サイズ・時間尺等);}; ~ ***制作ツール -ハードウェア --一眼レフカメラ（Sony α7 III） -ソフトウェア --Lightroom --Illustrator --After Effect --Visual Studio Code //&color(red){使用するツール｜ハードウエア・ソフトウエア}; ~ ***プロジェクトの期間 プロジェクトの期間｜2023.04.14 - 2023.12.22 //&color(red){プロジェクトの期間｜2023.04.14 - 2023.12.22... ~ ***現状調査 被写体となる高層建築の現状（ガラス張りのビルの増加した要... -電気代の削減 自然光を取り込めるため電力の使用を軽減でき、結果として省... -ビルの軽量化 コンクリート外壁は重量があるため、ビルを支えるのに膨大な... -カーテンウォールの採用 構造上の荷重を負担しない間仕切り壁と同様の非耐力壁である... ~ ***コンセプト -ロゴタイプ 幾何学的な窓のフレームを意識して制作。窓が反射する様子か... |#image(mutedscapes-logo.png)| -タイトル 『Mutedscapes』は、英語で無音や抑制されたを意味する「mute... //&color(red){基本的な考え方、枠組み、視点など}; ~ ***コンテンツ制作 -タイムラプス 被写界深度を深く設定することで景色の奥行きを表現し、2秒間... -写真 映像では見逃してしまうような微細な部分や、タイムラプスと... #image(before-after.jpg) ~ ***Webサイト -サイトマップ |#image(sitemap.png)| -トップページ サイトの閲覧者が何のサイトであるのか瞬時に分かるようにタ... |#image(mockup-top.jpg)| -タイムラプスページ 試作ではYouTubeのiframeでの埋め込みを試したが、コントロー... |#image(mockup-timelapse1.png)|#image(mockup-timelapse2.j... -マップページ 作品に関心を持った方が、実際にビルに映る景色を現地で観察... |#image(mockup-map.png)| -フォトギャラリーページ 撮影場所ごとに写真をカテゴリ分けできるボタンを導入するこ... |#image(mockup-photo.jpg)|#image(iphone-mockup.png)| ~ ***YouTube #youtube(Zs8Gb-7_q4g) -動画内容 YouTube内でループ再生の設定しなくてもゆったりと映像を観る... -投稿テンプレート --サムネイル #image(ksubldg2-thumbnail.jpg) --タイトル Mutedscapes #1 - Kyushu Sangyo University Bldg.2 (4K Time... --説明 Equipment：Sony ILCE-7M3, FE 24-70mm F4 ZA OSS Settings：ISO 100, 40mm, f/22 DateTime：6 July, 2023 - 16:29-17:36 Address：2-3-1, Matsukadai, Fukuoka-Shi Higashi-Ku, Fukuo... Website：https://adamay-design.github.io/mutedscapes/ ~ ***まとめ 本研究及び制作を通じて、「人工物であるビルと自然物である... //&color(red){プロジェクトが完結したら「まとめ」を記載し... ~ ~ **調査 ***先行事例 -[[光のパブリックポリシー4 夜間景観照明1>https://alg.jp/b... ALG‐建築照明計画株式会社による建築照明デザインによって景... -[[Moraine Lake Sunrise Timelapse - 4K>https://youtu.be/d... カナダ･アルバータ州にあるモレーン湖をタイムラプスで記録し... -[[神戸港クルーズ船ポータルサイト>https://cruise-kobe.com... Webサイトのトップページに映像を配置することで、訪問者が短... ~ ***被写体となる高層建築の現状（ガラス張りの増加） -ガラス張りのビルの増加した要因 --電気代の削減 自然光を取り込めるため電気の使用を軽減でき、結果として省... --ビルの軽量化 コンクリート外壁は重量があるため、ビルを支えるのに膨大な... --カーテンウォールの採用 構造上の荷重を負担しない間仕切り壁と同様の非耐力壁である... ~ ***技法・技術情報 -タイムラプス｜用語集｜細胞×画像ラボ https://www.healthcare.nikon.com/ja/ss/cell-image-lab/glo... -タイムラプス動画を作成する| 使いかた | Imaging Edge Desk... https://support.d-imaging.sony.co.jp/app/imagingedge/ja/i... -構図で写真が見違える！カメラ初心者が本当に使える６つの基... https://camera-web.jp/beginner/kouzu/kouzu-basic -Lesson20：高層ビル群 - レンズレッスン https://www.nikon-image.com/enjoy/phototech/lenslesson/le... //&color(red){プロジェクトの遂行に必要な技法・技術に関す... ~ 【参考】 -高層ビルがガラス張りな理由 https://www.takabonblog.com/entry/building -1970年代に総ガラス張りの建物を建てるのがいかに大変だったか https://www.gizmodo.jp/2011/03/1976.html -東建コーポレーション"カーテンウォール - 建築用語" https://www.token.co.jp/estate/useful/archipedia/word.php... -都市景観と巨大建築 https://www.10plus1.jp/monthly/2013/12/issue02.php -高層建築物が景観価値に与える影響に関する研究 https://tsukuba.repo.nii.ac.jp //&color(red){プロジェクトのテーマに関わる社会の現状と問... ~ ~ ~ **プロジェクト管理 ***スケジュール [[__スプレッドシート__>https://docs.google.com/spreadshee... //&color(red){計画的な遂行のために、進行管理表を作成して... ~ //***ToDo //-%%タイムラプス制作方法調査%% //-%%試作の制作%% //-%%サイトマップの制作%% //-%%Webサイトの大まかな枠組みの作成%% //-%%フォトギャラリーページの制作%% //-%%Instagramの開設%% //-%%Youtubeチャンネルの開設%% //-Webサイトの動画の埋め込み //-Webサイトの概要ページの更新 //-ロゴマークの制作 //&color(red){やるべきこと（タスク）を箇条書きにします。}; //&color(red){完了後は「%%取り消し線%%」あるいは「// コメ... //***NotToDo //&color(red){やらないこと：何をするかではなく「何をしな... //&color(red){例：10人以上の会議には出ない。苦手なことは... ~ ~ #hr CENTER:''進捗記録'' //&color(red){最新の情報を一番上に記載して下さい（古い記... #hr ~ ~ **2023.12.22 ***説明パネル -2枚目のパネルは一枚ではなく複数枚の写真を組み合わせる形... -背景は画像でも可 -数字の下の余白が1マスになっているため2マスに修正 ***卒展日程 期間：2月16日〜2月23日 搬入：2月14日, 15日 撤収：2月23日 ***ブラッシュアップ 締切：1月15日までに学科サイト更新 ~ ~ **2023.12.15 ***Webサイト -Aboutページに制作者情報を記載 -タイムラプスの詳細に建築物の高さ・竣工日・デザイナー等を... -PhotoページとTimeLapseページのコンテンツ同士のmarginを合... -トップページの縦スクロールを誘導する工夫 https://www.leadplus.co.jp/blog/design-pattern-for-user-e... -トップページレイアウトの改善 -https://www.webcreatorbox.com/tech/video-background ***YouTube掲載する際のテキスト例 -タイトル Mutedscapes - Solaria Terminal Building (4K TimeLapse) -説明欄 [Equipment] Sony ILCE-7M3, FE 24-70mm F4 ZA OSS [Settings] ISO 640, 52mm, f/20 [DateTime] 12 September, 2023 - 8:52-10:12 [Address] 2-1-1, Tenjin, Fukuoka-Shi Chuo-Ku, Fukuoka, 810-0001, Ja... ~ ~ **2023.12.8 ***最終審査 -トップページのバグ -英語表記に統一 -ページごとの世界観の統一（TimeLapseページとPhotoページ） -サイトの情報やコンテンツの拡充 -マップページのブラッシュアップ（レスポンシブ対応、ピンの... -タイムラプスの奥行きを意識した撮影をより強く ***フォントの再調整 -Afacad（Regular 400） -Roboto Condensed（Regular 400） -Teko（Light 300） -Rajdhani（Regular 400） ~ ~ **2023.12.1 ***Webサイト -マップページ 作品に関心を持った方が、実際にビルに映る景色を現地で観察... |#image(imac-mockup-map.jpg)| ~ ~ **2023.11.24 ***Webサイト -タイムラプスページ 試作ではYouTubeのiframeでの埋め込みを試したが、コントロー... |#image(imac-mockup-timelapse2.jpg)|#image(imac-mockup-ti... -フォトギャラリーページ 撮影場所ごとに写真をカテゴリ分けできるボタンを導入するこ... |#image(imac-mockup-photo.jpg)|#image(iphone-mockup.png)| ~ ~ **2023.11.17 ***YouTube掲載する際のテキスト例 -タイトル Mutedscapes - No.001 (4K TimeLapse) -説明欄 『九州産業大学』 ［場所］〒813-0004 福岡県福岡市東区松香台2丁目3−1 ［日時］2023年9月24日 16:29-17:36 ［機材］Sony ILCE-7M3, FE24-70mm F4 ZA OSS (LENS) ［設定］ISO 100, 40mm, f/22 ~ ~ **2023.11.10 ***Webサイト -トップページ背景に流れる映像の画質を向上 これまで圧縮の際にフルHDに縮小していたところを映像サイズ... -ヘッダー等にグラスモーフィズムを採用 ヘッダーやセクション部分の背景にブラーや影をつけることで... ~ ~ **2023.10.27 ***Webサイト -タイムラプスページのタイトルのサイズ変更 文字要素を小さくし、映像以外の要素は控えめに表示する。 ~ ~ **2023.10.20 ***中間審査 -タイムラプス掲載ページの調整 --各動画ごとに1ページ --YouTubeの動画タイトルの検討 --サイト上でのタイトルのサイズ感 --動画タイトルとサイト上での文字サイズや文字情報のメリハリ --大画面で楽しめるように幅いっぱいで表示する --動画埋め込みの方法の研究 --4Kでの掲載 -ヘッダーの文字サイズの縮小 ~ ~ **2023.10.13 ***タイムラプス -書き出した画像素材をタイムラプスへ変換・編集 --映像のブレをワープスタビライザーを使い軽減。 --変化の心地よい部分を抜粋。 --フェードによってループ再生にしても違和感がないよう調整。 ~ ~ **2023.10.06 ***タイムラプス -撮影した画像素材のレタッチ・書き出し --雲が鮮明に見えるように、コントラストやハイライト、シャ... ~ ~ **2023.09.29 ***Webサイト -概要ページ等のレスポンシブ対応 --フレックスボックスを使用し、横並びのキャプションと画像... ~ ~ **2023.09.22 ***Webサイト 誘目性の向上を目的としたスライドショーを設置。 ***タイムラプス 西鉄福岡駅で撮影を実施。 ~ ~ **2023.09.15 ***Webサイト パララックスを活用し、トップページ下部に概説の配置を実施。 ~ ~ **2023.07.21 ***Webデザイン案 -概要ページをトップページ下部に配置 パララックスを用いて、トップページより手前に概要ページを... ~ ~ **2023.07.14 ***各種アカウントの登録・開設 -YouTube 動画を高画質で視聴してもらうために使用する。当初は、Webサ... -Instagram 写真は通常投稿、タイムラプスはリールで投稿を行う。ただし... -Vimeo Youtubeに比べ、動画埋め込みの際の自由度が高い。しかし、フ... ~ ~ ***メモ -サイトの世界観の妨げになる埋め込み機能の再検討 -バグの原因になるためフォルダ名にスペースを使用しない 「Time Lapse」▶「TimeLapse」 -タイムラプスと写真の役割の明確化 -GIFやシネマグラフの検討 -長時間撮影や日没の撮影で時間の変化を強調 -タイムラプスと写真の同一項目で表示 -キャプションに撮影場所時間の明記 -ビルの歪みをPhotoshopで修正 -映像の自動再生 -受動的なサイトづくり ~ ~ **2023.07.07 ***Webサイト進捗 -トップページ #image(mutedscape0714.jpg) -ハンバーガーメニューの実装 #image(web-menu.png) -フォトギャラリー #image(web-photo.jpg) ~ ***タイムラプス試作 #Youtube(9vvYAffKw1Q) 場所：九州産業大学2号館 撮影間隔：2秒 #Youtube(w34AXRHpbIg) 場所：福岡ダイヤモンドビル 撮影間隔：3秒 ~ ***写真試作 |#image(DSC00810.jpg)|#image(DSC00893.jpg)| |#image(DSC00751.jpg)|#image(DSC07239.jpg)| ~ ***メモ -最終的にプロジェクト概要のスライドを制作 ~ ~ **2023.06.30 ***メインタイトル案 -Muted Realities（静かな現実） -Muted Existences （静かな存在） -Muted Realms（静かな領域） -Alternate Realities（別の現実） -Mutedscape（静かな景色）※造語 ~ ~ ***Webデザイン案 -ヘッダーを黒・透明度50%に設定 ~ ~ **2023.06.23 ***撮影のアイデア -構図 上を見上げるような構図 #image(DSC00901.jpg) -撮影詳細 間隔：2秒 撮影枚数：1800枚程度 撮影時間：1時間 映像時間：1分程度 ~ ***背景と目的の修正 -背景 近年、福岡市では都市開発が進み、天神ビッグバンや福岡コネ... -目的 情報量が多く騒がしい世の中、私たちは気付かぬうちに数多く... ~ ~ **2023.06.16 ***Webデザインのコンセプト ビルのイメージとして直線や直角など無機質な雰囲気を基調に... ~ ~ **2023.06.09 ***中間報告メモ -試作 --写真の試作掲載 --窓ガラスの狭いビルを撮影した試作動画の掲載 -Webサイト --撮影場所をマップにまとめる --方角を記載 -背景・目的 --ガラスの多いビルが増えること＝景観向上にはならない --地震などのリスク面も最終レポートでは記載 -撮影・編集 --時間経過を遅くすることで見る人に気づきを与える --窓ガラスを切り取り撮影すると比較にならないため全体像と... --枚数を多く撮影し、心地よい部分を切り取る --雨上がりや雨の降り始めは雲の動きがあるためその時間を狙... --北に背を向けて撮るなど方角を意識して撮影 --エリア別に撮影 ~ ***ガラス張りのビルの増加した要因 -電気代削減 自然光を取り込めるため人工光の使用を減らせる。 省エネ効果が期待できる。 -ビルの軽量化 コンクリートの外壁は重く膨大なコストを要する。 ガラスを使用することでコスト削減になる。 -安全性 地震や台風の影響を受けにくいカーテンウォール*¹の採用。 ガラス張りのビルを建設しやすくなった。 ~ *** *¹カーテンウォール 建物において構造上の荷重を負担しない、間仕切り壁などと同... 引用元：東建コーポレーション"カーテンウォール - 建築用語" https://www.token.co.jp/estate/useful/archipedia/word.php? ~ ***ガラス張りのビルの増加による弊害 -反射光によるトラブル https://www.nikkei.com/article/DGXNASFK2801Q_Y0A720C10000... -防音性の低下 視界が遮られるタイプの壁と比較してガラス壁は50～100％も音... https://www.estie.jp/products/finder/magazine/article/gla... -プライバシー面での懸念 ~ ~ **2023.06.02 ***試作 #Youtube(slGUC4uGmaw) -撮影設定 撮影間隔：10秒 撮影枚数：600枚 動画秒数：20秒 ~ **2023.05.26 ***試作 #Youtube(WVrbd3NVYko) -撮影設定 F値：F/9 ISO：500 露出プログラム：絞り優先 撮影間隔：15秒 撮影枚数：600枚 動画秒数：20秒 ~ #Youtube(ebfYH1IycC4) -撮影設定 F値：F/10 ISO：500 露出プログラム：絞り優先 撮影間隔：7秒 撮影枚数：500枚 動画秒数：17秒 ~ ~ **2023.05.19 ***コンセプト //ここ数年で福岡は、航空規制の緩和などもあり都市開発が加... //そこで景観保全 //ビルが増えることは果たして、景観の向上なのか。それとも... //一面ガラス張りなど、窓の面積が比較的広いビルが増えてい... ~ ***アイデア案 -都市高速をタイムラプスで撮影 ~ ***試作 #Youtube(3IhFJA01lhg) -撮影情報 F値：F/8 ISO：400 露出プログラム：絞り優先 撮影間隔：20秒 撮影枚数：150枚 動画秒数：6秒 -撮影機材 本体：Sony α7 III レンズ：SAMYANG AF 75mm F1.8 FE -メモ 少し移り変わりが速く感じたため、一枚あたりの秒数を長くす... 動画の時間が10秒以下だと物足りないため、20秒から30秒は欲... 600枚から900枚撮影する必要がある。 ~ ***技法・技術情報 -絞り優先モードの使用 画角に入る建物のどこまでピントを合わせるのか調整するため -Lightroomでレタッチの同期 まとめて同じ設定で現像が可能になる ~ ~ **2023.05.12 ***アイデア案 -Webサイト上でビル巡りマップを制作 -タイムラプスで雲の動きを撮影 --30分程度、試験的に撮影 -ビルに映る月や雨の水滴の撮影 ~ ~ **2023.04.29 ***試作 |#image(IMG_1929.jpg)|#image(IMG_1926.jpg)|#image(IMG_193... -撮影機材：iPhone 12 -撮影場所：博多区 （05.11更新） ~ ***アイデア案 -ビルの窓ガラスに反射を生かした写真 --なぜビルなのか？ →格子状、垂直、窓の面積が広い --何が反射している様子を撮るのか？ →日常、天候、時間、色相、明暗 --なぜ福岡で撮るのか？ 全国の都市で撮影するうちの一つとして、今回は福岡を取り上... （05.10更新） ~ ***メモ -写真 --錆 --トタン -3DCG --日常品に芝生を 便利な世の中になる一方で、緑を見る機会が減っている。 緑はストレスを緩和したり、目の疲れを和らげる効果もあると... 3DCGであればBlender。写真合成ならPhotoshop使用。 ~ **2023.04.21 ***アイデア案 -都市高散歩ブラッシュアップ案 --撮影機材をiPhoneから一眼レフカメラに変更 --ロゴやフォントのリデザイン --写真集の文字情報等の拡充 --Webサイトの再構築 --Googleアナリティクスの活用 --写真の世界観の統一 --老朽化をより感じ取れる写真集 →老朽化を強調したい写真はモノクロで表現 →新しい建物等との対比 ~ -緑だけを集めた図鑑 or 写真集 --緑には目の緊張を緩和させたり、心を穏やかにする効果がある --写真として取り上げることで日常に隠れる緑を意識するよう... ~ ***現状調査 -新緑の季節　緑色を見るとどんな効果がある？ https://weathernews.jp/s/topics/202104/270295/ -「緑を見ると目にいい」って本当？ https://weathernews.jp/s/topics/201905/200125/ ~ ***先行事例 -青い生きもの図鑑 →色を統一する面白さ https://amzn.asia/d/fopU4pu ~ **2023.04.14 ***アイデア案 -写真 --環境に配慮された建築の図鑑制作 →フォトギャラリーサイト、図鑑（写真集）、マップ --落とし物をひたすら撮る //--都市開発で変わりゆく福岡を記録 --自動販売機・バリアフリー・踏切・廃墟 →写真集、マップ（例）自動販売機でいうとどこに何が売ってい... -グラフィックデザイン --福岡都市高速 インター出入り口等のシンボルマーク制作 →パンフレット等 （04.14更新） ~ -メモ 工事現場、鉄骨、足場 看板、標識、ピクトグラム、ロゴ、タイポグラフィ 福岡っぽい 色別やジャンルで分類 色で見る福岡「福岡×色」 サイトは白を基調とする →写真の色彩を引き立たせる （04.18更新） ~ ***現状調査 -海外事例に学ぶ。“色”で社会問題に光を当てた啓発動画 https://insights.amana.jp/article/24273/ -シンボルカラー…病気や障害、色で啓発 https://yomidr.yomiuri.co.jp/article/20160615-OYTET50039/ ~ //***XXXXXXX //- //~ //~ //**20XX.XX.XX //***XXXXXX //- //~ //***XXX //- //~ //~ 参考 -https://www-w3schools-com.translate.goog/html/html_intro... [[Google:html5 semantic template]] ~ ~ ~

ページ名: