- 吉良琉汰
- '''Keywords：思い出, 記憶, 切符, QRコード,タイムカプセル
- 目次
概要
人生を生きていくなかでいつの間にか忘れてしまう記憶という大事な思い出を
新しいアプローチで保存する方法を提案するwebサイト
背景と目的
背景
思い出を残す方法として、写真の撮影を行ったり訪れた場所の切符や入場チケット等を残す方法があるが、写真は捨てにくかったり、クラウドストレージ等に保存を行っても実際見返す機会が少ない事に気がついた。
目的
そこで、切符程度の小さなアナログの媒体に、画像や映像、音声等のデジタルな
データをqrコードを通して引き出せるようにし、両方の側面から新しい体験価値を生み出し、思い出を振り返るのが楽しくなるようになる物を作りたいと思ったからです。
コンセプト
普通にアルバムを見るのとちがって、qrコードを開くワクワク感や、アナログとデジタルの側面を活かせる融合を重視して作成する。
成果物
予定
- QR技術を活用した切符
- webサイト
前期制作物
- 切符3種類
- 専用型切符デザイン
画像1枚に対してQRコードの生成を行うので、読み込む事で即座に画像が表示され、見たいものをピンポイントで伝える事が可能なタイプ。
それ以上のデータを追加する事ができない。
使用例：感動した1枚をピンポイントで保存したい場合
QR読み込み後
- ファイル型切符デザイン
ファイルに対してQRコードの生成を行うので、複数のデータをまとめて保存できる上、編集を許可する事でQRを読み取った人達と共有のアルバムとしても使い回す事ができ、追加したいデータがあればオンラインで随時データを追加できるタイプ。
使用例：数人で旅行に行った時の思い出を共有する等、複数のまとまりとして保管したい場合
QR読み込み後
- 音楽メッセージ型切符
「あの時期よく聞いてたな」等、思い出の曲をQR化する事で曲にアナログの情報を持たせる事ができるようなる。
また、メッセージを書けるように大きな余白をとっているので、曲を人におすすめしたい時にメッセージ付きで曲をおすすめしたり、過去にどんな時期にどんな感情でその曲を聴いていたのかのメモ等にも使用する事ができる。
QR読み込み後
※誰でも無料で利用でき、楽曲数も多いYouTubeミュージックを採用
※Mrs.GREEN APPLE
工夫点
- 普通紙だと全体的に発色が悪く不鮮明な感じがしたためQRコードとの相性を考え光沢紙を採用。
- 後々誰でも作れるように機会の提供にも挑戦していきたいので印刷には特別な
ものは使用せず、全てコンビニのシール用紙で印刷を行った。
- また、切符としての没入感を損ねないように裏に黒色のボール紙を張り付け強度をあげつつ切符としてのリアリティーを高めた。
後期制作物
- webサイト
↓以下サイトマップ
- 思い出きっぷ
制作ツール
- フォトショップ
- イラストレーター
- アフターエフェクト
- プレミアプロ
- Html
- css
- JavaScript
まとめ
前期まとめ
- 前期では実際にQRコードを埋め込んだ切符を何パターンか完成させる事ができた。後期では、ここから発展させたQRコードの新たな活用方法や、SNSを通して思い出きっぷのプロモーション等に力を入れていく。
また、可能であれば前期では作成する事が難しかった実際に切符を作成できるWEBサイトの製作にも挑戦して、ゆくゆくは誰でも作成を行えるように機会の提供等も行っていきたい。
後期中間まとめ
- 基本的なwebサイトの制作の実装は終えたので、最終報告に向けてサイトの
見た目や装飾、コードの整理、保存やお問い合わせ機能が動くように力を入れていきたい。
調査
活用事例
QRコードで墓参り
お墓にQRコードを埋め込む事でお墓参りを行った時に故人との思い出を振り返る事が出来る新たな形のお墓
洋服のタグにQRコード
洋服のタグにQRコードを埋め込む事で服に情報を持たせることができ、タグのQRに読み取ればすぐにショップに飛べる。売上の機会も逃さず便利。
技法・技術情報
QRコードの生成
動くWEBデザイン
コーディング参考
ペヤングブランドサイト
covermaker
音楽カード
プロジェクト管理
スケジュール管理
ToDo
テーマの捻出
中間報告
中間報告を受けての制作
切符デザイン制作
サイトマップ制作
Web制作
報告
制作記録
2023.11.24
2023.11.17
webのブラッシュアップ
サイトのuiを変更し見やすくなるようディスプレイの仕方に変更を加えた
**2023.11.10
切符のブラッシュアップ
- 切符のコンセプトを変更し感情に結びつけたデザインへと再編集を加えた。
2023.10.27
中間報告を終えてブラッシュアップ
- メインビジュアルの画像を人物に変更しイメージを湧きやすくするようにした
2023.10.20
中間報告を終えてブラッシュアップ
- 一目見た時にサイトの内容が分かりにくいのでメインビジュアルをわかりやすくする。
- 実際にその切符を使用している様子等をのせてイメージを湧きやすくさせる。
- 内容をわかりやすく噛み砕き本文の調整等を行う。
- テーマと内容のメリハリをしっかりつける。
2023.10.13
状況整理
HTML のフォーム機能要素を使い色や文字を入れるためのフォームを作成する
2023.10.06
作るページを編集
webページを参考にしたり、その他プログラマーとの意見交流でアドバイスを頂く。
HTML css Javascriptで作成していく。
インフラ面をどうするのかを考えていく。
htmlのページ数を増やして作成の工程を細分化していく。
2023.09.29
メインページとなるindexのページを編集
イメージラフを再現するため背景の切符画像の動きは動画を使用。
CSSにて背景に動画を挿入し中央揃えで配置
また最下層のレイヤーに配置
背景動画の上に透過ロゴを配置
透過素材でのサイト説明ページ画像を制作し配置。後々スクロールする事でポップアップアニメーションを設定する可能性あり
その他必要ページを作成。デザインは随時修正予定
2023.09.22
- HTMLを使いサイトを構築ヘッダーとフッダーは使い回す仕様で作成。
- Javascriptを使用しロードアニメーションを追加した。
ロードアニメーションはオリジナルのものを使用。
テーマを考え電車が走っているようなものにした。
またあまり重くならないようにシンプルな描写に収まるように緩めのイラストを制作
2023.09.15
状況整理
2023.07.14
概要集制作
2023.07.07
制作
- 実際に切符を印刷し、どのような見た目になるのか確認を行った。
- いくつかQRのパターンを作る事で使用用途にどのような違いが生まれるのかを検証を行った
2023.06.30
制作
- 実際に切符を印刷し、どのような見た目になるのか確認を行った。
- いくつかQRのパターンを作る事で使用用途にどのような違いが生まれるのかを検証を行った
2023.06.23
web開発・メインビジュアル制作
- ワードプレスを利用しつつ、サイトフレームの制作を行った。
- 切符のデザイン案を考えるために、webサイトやピンタレスト等からデザインの選考調査を行った。
2023.06.16
Web開発
- Html・Css・Javaを使った基本的なホームページを制作を行った。
- A4用紙でPDFファイル印刷を行ったがQRコードとの相性が悪くサイズの変更を行った
2023.06.9
中間報告期間
- 切符をモチーフとした作品をつくるうえで、どのようなデザインのものが存在しているのかを先行事例として調査を行った。
→切符をモチーフにしたデザインナショリー
- すでに実際に使われている切符のデザインを参考にしつつ切符デザインの制作を行った。
QRコードを入れると所々潰れる箇所が発生するので、解像度をあげつつデザインを行った。
2023.06.2
中間報告期間
- 実際に発表をおこないフィードバックを頂いた。
方向性に関しては良い感触をえれたので、テーマに関してはQRコードを活用した新たな記憶の保存方法というアイデアで進めていく
- webサイトを作る場合、技術的問題がクリアできるかを確認しておく必要がある。
- 切符を制作する場合何種類のレイアウトを用意すべきかを考えておく必要がある。
2023.05.26
中間報告期間
- 報告に向けたビジュアル的面での制作をおこなった
- 仮のメインビジュアルの追加
- 切符の制作過程の流れを考えたメモを作成した
2023.05.19
テーマアイデアの捻出
- これまで考えてきたアイデアをソーシャルデザインに関連ずけたうえで
もう一度考え直してみる。社会のゴミ問題とからめていく
↓
SDGsを考える
2023.05.12
テーマアイデアの捻出
「人間がいつの間にか忘れてしまう記憶を大切に保存したい」
を主なテーマとして具体的な案を形にして作品を制作していく。
具体的にこのテーマをもとにしたアイデアを3つ考えました。
- 思い出バンク
本来はすてるような映画の半券やレシートを保存でき、おもいでをほかんできるATM
- 幸せポイントカード
幸せを感じるごとにポイントがたまり、自分の幸福会員れべるがはかれる
- ゴミpay
自分がすてたゴミの値段でpayがチャージされていき、自分が浪費してきた金額が分かる。
2023.04.28
テーマアイデアの捻出
***デジタルベジタブル
普段は混じり合う事がない２つが混ざるとどんな反応が起きるのか試し
たいWebサイトやアプリ開発か、ポーカー形式のボードゲームとして制作
するのも面白いかもしれない。
記憶とは関係のないテーマだったため取り扱わない事にした。
2023.04.21
テーマアイデアの捻出
- デジタルベジタブル
普段は混じり合う事がない２つが混ざるとどんな反応が起きるのか試したい
Webサイトやアプリ開発か、ポーカー形式のボードゲームとして制作するのも面白いかもしれない。
2023.04.14
テーマのアイデア
- フォーマット（グラフィックス）（イラスト）（ショート動画）（絵本）（図鑑）（パンフレット）
- テーマ（ロス問題）（SNS）（AI技術）（遊び心）
