LogoMarkWhite.png

諸琳/博士前期/デザイン総合研究II のバックアップ(No.31)


日日是好日

自然のパターンを活用したWebカレンダーの制作

#image(): File not found: "sample.gif" at page "諸琳/WorkLog2022"




CONTENTS




第1章 序論

1.1. 研究目的

自然に隠されたパターン探究し、応用することは、視覚と機能に新しい可能性を持っていると考える。私はグラフィック、動くアイコン、ウィブサイトによってその表現方法を試行錯誤していきたい。それは私たちが見落としていた自然の真の美しいスペクタクルの再発見になり、新しい表現につながるだろう。

時間計画は常に重要である。自分に実用的なカレンダーがあれば便利だ。どのように自分に合うカレンダーを選ぶか、 アンケートを通じてユーザーのニーズを理解し、より多くのユーザーにとって可用性・実用性の高いカレンダーをデザインする。視覚的にユニークなデザインを実現するために、自然に隠されたパターンを探究し、これをインターフェイスに応用する研究を行う。

本研究では、自然のパターンを利用して視覚的、機能的なユーザー体験を実現するカレンダーを制作する。


1.2. 研究の背景

1.3. 国内外研究現状(先行研究)

(文章解説)


1.4. 検討項目

本研究では、以下の3点を主な検討項目として設定する。

第2章 調査研究

2.1. アンケート調査

カレンダーのユーザー体験を目的として、アンケート調査を行った。以下にその概要を記す。

2.2. アンケートの結果

アンケートの結果を図XXに示す。

2w.jpg
3w.jpg
4w.jpg
6w.jpg
5w.jpg
7w.jpg

図.XX

2.3. アンケートの分析

分析の結果、以下のことがわかった。

2.4. 自然物の調査と収集

自然物をデジタル写真として記録した。

#image(): File not found: "x1.jpg" at page "諸琳/デザイン総合研究I"

#image(): File not found: "x2.jpg" at page "諸琳/デザイン総合研究I"

#image(): File not found: "x3.jpg" at page "諸琳/デザイン総合研究I"

1月-梅の花2月-椿3月-チューリップ

#image(): File not found: "x4.jpg" at page "諸琳/デザイン総合研究I"

#image(): File not found: "x5.jpg" at page "諸琳/デザイン総合研究I"

#image(): File not found: "x6 .jpg" at page "諸琳/デザイン総合研究I"

4月-桜5月--タンポポ6月-紫陽花

#image(): File not found: "x7.jpg" at page "諸琳/デザイン総合研究I"

#image(): File not found: "x8.jpg" at page "諸琳/デザイン総合研究I"

#image(): File not found: "x9.jpg" at page "諸琳/デザイン総合研究I"

7月-アサガオ8月-ひまわり9月-ラベンダー

#image(): File not found: "x10.jpg" at page "諸琳/デザイン総合研究I"

#image(): File not found: "x12.jpg" at page "諸琳/デザイン総合研究I"

#image(): File not found: "x11.jpg" at page "諸琳/デザイン総合研究I"

10月-モクセイの花11月-かえで12月-イチョウの葉




第3章 制作概要

自然のパターンの視覚における可能性を広げる目的で、自然のパターンが普段用いられていないWebカレンダーにインターフェイス要素として展開する。

3.1. 時間の分類

一月一植物 、一週一色、 一日一籤

3.2. 一月一植物

12ヶ月の代表的な植物、動的パターンが出現し期待感を増加させる演出を行う。代表的な植物は以下のとおり。

3.3. 一週一色(いっしゅういっしょく)

週の違いは色で区別する。

3.4. 一日一籤(いちにちいちくじ)

「ことわざ」を收集、日日是好日のコンセプトを掲載する。面白さを増やす。

W7.jpeg
W8.jpeg




第4章 制作方法

4.1. 制作環境 

Webカレンダーの制作に関わるアプリケーションと開発言語は以下のとおり。

4.2. グラフィック表現の研究

(文章解説)

4.2.1 イラストの作成

(文章解説)

hh.jpg

制作ツール:Adobe Illustrator


4.2.2.カレンダーの制作

(文章解説)

4.2.3. アイコンの作成

(文章解説)

#image(): File not found: "LG01.jpg" at page "諸琳/WorkLog2021"

size:210x 297cm
制作ツール:Adobe Illustrator
写真やイラスト、認識度の高い図形をアイコンとして描く。

4.3. Webの表現の研究

4.3.1. 動くイラスト作成

植物の自然状態の特徴に応じて動するイラスト、自然物の状態に基づいて作られている。例えば:梅の花が一輪ずつ咲いている、ツバキの花が一輪ずつ落ちている、桜の花びらが散る、朝顔の朝に花が咲いて夜に閉じるなど。

梅の花|1月
椿(つばき)|2月
チューリップ|3月
桜|4月
タンポポ|5月
紫陽花|6月
アサガオ|7月
ひまわり|8月
ラベンダー|9月
モクセイの花|10月
かえで|11月
イチョウ|12月
制作ツール:Adobe Illustrator、Adobe After Effects

4.3.2. 動くアイコンの作成

(文章解説)

#image(): File not found: "sample.gif" at page "諸琳/WorkLog2022"

制作ツール:Adobe Illustrator、Adobe After Effects

第5章 研究成果(制作物の現状)

5.1. サイトの仕様

サイトマップと、主たるページの概要を以下に示す。

5.2. 成果の公開

#image(): File not found: "sample.gif" at page "諸琳/WorkLog2022"

制作したカレンダーは、GitHub上にソースを公開するとともに、以下のURLから閲覧できるよう公開している。






第6章 結論と展望

6.1. まとめ

自然のパターンに隠された形の魅力を改めて探究して、現代のwebデザインと組み合わせて表現する。自然のパターンをデザインに落とし込み、自然のパターの知られていない魅力を表現する。人間と自然には共通性があるので、自然に注目することは、人間に注目することと同じです。

6.2. 今後の課題




参考文献・資料

APPENDIX

レイアウトサンプル

論文執筆に利用するソフトウエアには指定はありません。InDesign、Word等、以下を参考に執筆して下さい。

InDesign 入力用

上記のサンプルの InDesign(idml)データです。表題等を書き換えるとともに、ページを追加する形でご利用下さい。