20世紀ことば展
- 深江沙羅
- Keywords:Web Design(HTML,CSS,Javasprict) / Atom
- 20世紀ことば展
概要
短歌・俳句を展覧会のように魅力的に紹介する
Webサイト制作。
Webサイト制作。
研究背景・目的
背景
- 良いと思った短歌・俳句をメモに書き留めることが多い。
- そこで、それらを展示する静的サイトをつくり、オンラインの常設展示場を作れば同じような趣味の人に見てもらえると考え、テーマ設定した。
目的
- 文字(短歌・俳句)をWeb上で美しく見せる手法について学ぶ。
詩歌に興味がある人にWebサイトを見てもらう。
調査
先行研究
- 新鋭短歌シリーズ
- 作品に対しさまざまなフォントを使い分けている。
余白を十分にとった余裕のある画面。
- 作品に対しさまざまなフォントを使い分けている。
技法/技術の調査
- jquery、JavaSprictの理解
- 展覧会の調査
- オンラインで行われているものは動画やストリートビューの形式をとっていることが多い。
- Webサイトで完結する展覧会は他にない。
制作
コンセプト
- 作品をインタラクティブに楽しめる
Web上の電子美術館。
制作物
まとめ
- いちからJSを構築するのが難しく思うように完成しなかったため、これから学習して完成イメージに近づけていきたい。
- 文字を美しく見せる方法についても改良の余地があるので今後の研究にも関連させていきたい。
Overview
Introduction
短歌・俳句を展覧会のように魅力的に紹介するWebサイト
Background and Purpose
- 良いと思った短歌・俳句をメモに書き留めることが多い。
- そこで、それらを展示する静的サイトをつくり、オンラインの常設展示場を作れば同じような趣味の人に見てもらえると考え、テーマ設定した。
Target
文字言語に興味がある人
〜30代男女
Output
Web
Tools
- Adobe illustrator
Term
3ヶ月間
CurrentStatus
Project Management
Schedule
ToDo
- 過去事例Webサイトの調査
- JavaSprictの学習
- 展覧会の展示方法などを分析する
worklog
[ 2020.12.11]
制作
- レスポンシブの試作
- Webサイト上の現在地の可視化
- fixedした左上のタイトルにページ名を記載することで、ユーザーが今どこにいるか判断しやすくした。
- htmlの名前を統一
- 行間調整の試行
- 和欧混植の調整
- さわらび明朝とRoboto Slabを使用
企画案
- サイトマップの更新
- MVの更新
[ 2020.12.08]
制作
- レスポンシブの試作
- コードエラーの発見、修正
[ 2020.12.07]
制作
- CSSを使ったホバーアニメーションの試作、適用
[ 2020.12.04]
制作
- CSSアニメーション(effect-fade・scroll)を使ったJSの試作、適用
企画案
- ワイヤーフレームの練り直し、更新
[ 2020.12.02]
制作
- Illustrator・ジェネレーターでFV部分のGIF制作
[ 2020.11.30]
制作
- コーディング(HTML/CSS)
[ 2020.11.21]
制作
- コーディング(HTML/CSS)
- メニューボタン作成にかかるJqueryの学習、テスト
- メニューボタン作成にかかるJqueryの学習、テスト
[ 2020.11.17]
制作
- コーディング(HTML/CSS)
[ 2020.11.06]
制作
- コーディング(HTML/CSS)
[ 2020.10.29]
企画案
- 載せる情報の整理
[ 2020.10.26]
調査
- 展覧会のフライヤー・概要の調査
[ 2020.10.20]
調査
- 類似サイトの調査
制作イメージ
[ 2020.10.19]
制作
- コーディング(HTML/CSS)
[ 2020.10.18]
企画案
制作
- コーディング(HTML/CSS)
- 試作(http://bungei.html.xdomain.jp)をサーバーにアップロード
[ 2020.10.17]
調査
- 参考サイト(1カラム)
- 過去事例
[ 2020.10.12 ]
企画案
- ワイヤーフレーム・サイトマップの構想
[ 2020.10.07 ]
企画案
- 素案
- 紹介するコンテンツ量を減らし、「短歌」「俳句」を掲載することに決定。
- 年代を区別し(現代・近現代)、絞り込みやチャートによってWebサイト訪問者に適切な作品を見てもらえるように工夫
- 定型詩の掲載は著作権侵害に抵触する可能性があるため、ごく簡単な批評文を添えて引用する。批評文は展覧会のキャプションっぽく見せる。
[ 2020.10.06 ]
企画案
- 進行管理表の作成
調査
- 類似サイトの調査
文月悠光ポートフォリオサイト
田中ましろポートフォリオサイト - 言葉×映像
- 言葉×写真
[ 2020.10.05 ]
企画案
- サーバー確保(XFREE)
調査
- 類似サイトの調査
- 新鋭短歌シリーズ
似たようなサイトがなかなか見つからなかったが、現在想定している完成イメージに近いもの。(上記)
- 新鋭短歌シリーズ
[ 2020.09.23 ]
企画案
- 練り直し