大井このか/情報デザイン演習IIA

Photo Story

写真を見て物語を考えるサイト
　

• 大井　このか
• Keywords：写真、物語、SS（ショートストーリー）
• https://konokaume.github.io/photostory/
  
  
  
  

概要

これは何？

　写真を見ながら物語を「そうぞう」するサイトです！

目的と背景

　写真を見た時、これはどこだろう？何をしているのだろう？写っているものは何なのだろう？など、想像を膨らませたことはありませんか？もしくはこの切り取られて静止した世界が、”もし”動き出したらどうなるのだろう、とか。

　このサイトは、そんな想像や”もし”を物語に昇華してまとめれたら素敵じゃないかなと思って作ることにしました。


　『写真を見て物語を考える』ということについて、私は小学校５年生の時の国語の授業から思いつきました。今では写真から物語を想像することは少なくなりましたが、私の文章を書くという行為の原点となっています。

成果物の仕様

• サイトを作る
• 同人誌的な冊子まで作れたら作る
  
  

制作ツール

• カメラ
• Wordかメモか、文章が書けるソフト
• Illustrator
• Photoshop
• Visual Studio Code
  
  

プロジェクトの期間

2023.04.10 - 2023.07.10

プロジェクト管理

𝕤𝕔𝕙𝕖𝕕𝕦𝕝𝕖

リンク

𝕋𝕠𝔻𝕠

• 写真集め
  • 写真を撮る
  • 写真を借りる
• 画像編集
• サイトを作る
• 物語を書く
• 冊子を作る
  
  
  
  
  
  
  
  
  
  

  ---

  進捗記録

  ---

  
  
  
  

2023.06.26

• SSを三つ追加しました！
  
  
  
  
  
  
  
  

2023.06.19

• SSを一つ追加しました！
• githubに再投稿しました！
  
  
  
  
  
  
  
  

2023.06.12

• githubに投稿したが写真がうまく表示されなかった
  ↪︎ファイル管理が問題
  　　↓
  作り直しました！
  
  
  
  
  
  
  
  

2023.06.05

• サイトのページを増やしました！
• 子ページのcssを設定しました！
• 物語を書き始めました！
  
  
• 子ページ
  
  
  
  
  
  
  
  
  

2023.05.29

• サイトのページを増やしました！
• パソコン版とタブレット版とスマホ版を作りました！
  
  
  
  
  
  
  
  

2023.05.22

• 使用する写真の選定
  
  リンク
  
  
  
  
• 写真の編集
  リンク
  
  
  
  
  
  
  
  

2023.05.15

プロトタイプ評価シート　皆様コメントありがとうございました。
案１のようなイメージで作ろうと思います。

• サイトの進捗
  
  htmlファイルとcssファイルを作りました。
  
  
• 画像の編集（16:9に編集済み）
  
  
  
  
  

𝕄𝕖𝕞𝕠

• 使用フォント
  • 漢字・カタカナ：セプテンバーＮ３
  • ひらがな：筑紫A丸ゴシック
    
    
    
    
    
    
    
    

2023.05.08

”はじめに”のプロトタイプ

※下記のサイトマップの黄色の部分に載せる画像です。

案１／案２

𝕄𝕖𝕞𝕠

• 使用フォント
  • 案１
    アルファベット：FOTBrexia
    日本語：A-OTF トーキング Std R
  • 案２
    アルファベット：Hubballi
    日本語：タイムマシンわ号
    
    
    
    
    
    
    
    

2023.05.01

今回制作したプロトタイプ

• Web
  サイトマップ／サイトのワイヤーフレーム
  
  
  
• 冊子
  台割り
  
  リンク
  
  

プロトタイプ制作の方法

• Googleスプレッドシート
• Illustrator
  
  
  
  
  
  
  
  

2023.04.24

コンテンツの公開方法

• Webサイトを作る
• htmlを頑張る
  
  

SSの内容（ネタ）

• 日常の中の非日常
  
  

サイトの構成

• 写真とタイトルを並べて、クリックをしたらSSがある子ページに飛ぶ
• 写真が増えてきたら、写したものごとに分けてみる…？
  
  

コンテンツの制作環境と方法

• 制作方法
  １．写真を撮る
  ２．写真を見ながら想像を膨らませる
  ３．物語を書く（100〜500字くらい？）
  ４．IllustratorやPhotoshopを使って綺麗な画像にまとめる
  ５．サイトに掲載する
  
  
  
  
  
  
  
  

2023.04.17

現状調査｜テーマ内容の先行事例

• 写真とSS
• ブログ例
  
  

現状調査｜表現形式の先行事例

• The PERFUME OIL FACTORY
  
  

現状調査｜時間軸（対象の歴史的知見）

• 小学校の国語の授業で、写真を見て物語を考える授業があった。
  
  

現状調査｜空間軸（対象の地理的知見）

• 自宅
• 通学路
• 学校
• お出かけ先
  
  

現状調査｜技術

• スマホ（カメラ）
• Illustrator、Photoshop
  
  
  
  

𝕄𝕖𝕞𝕠

• やりたいプロジェクトの概要
  １．狐かわいい
  　→日本の狐の伝承、アイテム（私物他）、スポットをまとめる。（妖から実在の狐にまつわる話まで）
  　⇨一番好きのもののまとめサイトを、隅から隅まで自分で作れたら楽しいよね。
  
  現状調査｜テーマ内容の先行事例
• キツネ村
• 北キツネ牧場
• wiki／妖狐
• wiki／キツネ
• レッドデータブック
• 図鑑
• イラストでのまとめ1
• 参考サイト
  ↑
  難しそう

  
  
  ２．鉱物まとめ、薬草（花）まとめ、小咄集、空の色、石・土の色
  　→”アイテム”と神話や伝承、物語の関わりをまとめてみる。
  　　もしくは、空や石の写真と名前、自作SSをまとめてみる。
  　⇨すでに本になってたりするネタではある。
  　　自分で作りやすいのは空と石？
  
  
  ３．学内の植物や動物マップ
  　→学内マップに植物、動物の写真を合わせて掲載してみる。動植物にまつわる動画を作っても楽しいかも。
  　⇨オリジナルのものができそう。
  　　でも、今期は忙しいから一人でやるのは無理そう。

  
  
  ４．おすすめのラノベ
  　→自分の好きなラノベをまとめてみる。
  　⇨自分の好きなラノベ、ジャンル偏りすぎ問題。
  
  ５．ネタ帳、科学の擬人化まとめ、手作りした小物の紹介、ファンアートまとめ、作っているゲームの紹介
  　→自分の作っている作品の、今までやったこととこれからやりたいことをまとめてみたり、写真やアイデアを少しづつ掲載していったりする。
  　⇨他の人もやってない？
  
  
  
  
  
  
  
  

2023.04.10

プロジェクトのテーマ候補（10件以上）

• 小説やイラスト、漫画、動画など媒体によって映える物語の違い
• 小咄集（笑える話や怖い話のまとめ）
• ネタ帳
• 学内の植物や動物マップ
• 空の色、石・土の色
• 鉱物まとめ
• 科学の擬人化まとめ
• 手作りした小物の紹介
• ファンアートまとめ
• おすすめのラノベ
• 作っているゲームの紹介
• 薬草まとめ
• 狐かわいい

  
  

参考リンク

• 面白い話
• 植物マップ
• 生物多様性センター／植生と植生図
• 結晶美術館
• 結合男子
• 妖狐／wiki