異景ikei
写真と美しい字面を組み合わせたものを載せるWebサイト
概要
これは何?
個人的に美しいと感じる字面、意味を持つ言葉と写真を組み合わせたものを
載せるWebサイト
背景と目的
美しいと思う言葉と美しいと思う写真を組み合わせ、相乗効果を狙う
自分が「美しい」と思うものの追求
制作ツール
・Photoshop
・Illustrator
・Visual Studio Code
成果物の仕様
・Webサイト
こだわった部分
- ロゴを自分で制作し、ブラウザのタブでに出るようにした
- Collectionsの写真に触れると写真が大きくなるようにした
- ヘッダーのCOLL.やABOUTを押したらゆっくりとその場所に移動するようにした
進捗記録
2025.07.07
- あえて最初は写真で選んでもらうようにする。
- aboutもcollectionもtopに作る。そして全体を見れるようにする。
- collectionの写真に触れたときに写真が大きくなるようにする
→選択しているのがわかりやすいように
- 写真それぞれに詳細のページを作った。言葉の意味などを載せる
2025.06.30
- SPAとMPAのどちらにするか
- html、cssの制作
- 写真の形、配置を考える
2025.06.23
見出された問題点
- ビジュアルと字について(色・フォント)
- 言葉の意味
好評を得た点 > プロジェクトの特性として
2025.06.16
今回制作したプロトタイプ
プロトタイプの説明
2025.06.09
現状分析
テーマ内容に関する先行事例
- 杉本博司《仏の海》シリーズ
モノクロの写真に極めて短い語が添えられる。
- バーバラ・クルーガー
写真に対して太字でキャッチコピーのようなフレーズを重ねる
- 森山大道
写真集の中に短い文章や日記的なテキストを挿入
表現形式に関する先行事例
時間的情報(歴史)
写真+説明文
→写真が技術的に可能にな理、新聞や雑誌で写真と文字の融合が始まる
視覚詩、写真×詩の融合
→文字を視覚的に扱う表現が発展
コンセプチュアル・アート、メッセージ性強化
→様々なアーティストによる写真×文字の社旗的メッセージ表現が増える
写真集多様化、ポストモダン的解釈
→複数のテキストが組み合わさる複合メディアとしての写真集、言語の不確かさ、意味のずれを意識した写真×文字の組み合わせ
SNS普及、ビジュアルポエトリー、多様表現
→写真とハッシュタグなどの組み合わせの日常化
空間的情報(地理)
- ヨーロッパ→写真発明の地
- アメリカ→ポップアート、コンセプチュアルアート
- 日本→戦後広告、雑誌、現代写真家の詩的表現
- その他の地域→メディアアートでの融合
技術について
- 写真撮影技術
- 画像編集・加工技術
- レイアウト・デザインの基礎
- デジタル媒体への応用
- テキストコンテンツ制作能力(言葉選び)
課題定義
- 1. Webサイトでどのように見せるか(レイアウト)
- 2. タイトルを決める
- 3. 作品を何個作るか
- 4.写真を集める
- 5.使用する文字の決め方
制作上のアイデア(課題ごとに複数のアイデア)
- 1. シングルページにする
トップは動画にして、タイトルを真ん中に入れておく
→タイトルが写真に挿入されている感じにする
- 2. タイトル候補
美意(美しい字面×意味、意思)
目で感じる
よそおいの違い
異景
- 3. 最低の枚数は決めておく(多い分にはいい)
- 4.過去に撮っていた写真を用いる+これからも撮っていく
- 5.自分がお気に入りの字面を書き出してどれだけあるのかを確認する
2025.06.02
テーマ候補
- 写真×美しい字面
- 生活の中での写真
- テキストアニメーション(キネティック・タイポグラフィ)
- Illustrator・Photoshopで作品を作る(自分の成長を可視化するもの)
成果物の仕様
この演習を通して身につけたいスキル
- Photoshopでの画像加工の技術
- 画像と文字のバランス
- Webデザイン