概要解説
Web サイトや UI デザインにも活用されるグリッドシステム。
紙面のコンテンツを構造化する他に、余白を操作することにも利用できる。
グリッドをガイドラインだけでなく、グリッド自体をデザインの一部とした作品を制作します。
前提知識・技術
- Illustrator の操作
- デザインの四原則
授業目標
グリッドの特性とグリッドを用いたグラフィックデザイン作品の制作。
授業資料
参考資料
近年では、グリッドデザインで検索すると、CSS フレームワークなど Web サイトのレイアウトの記事が多くなります。
ポスター、フライヤー、チラシなどグリッドとデザインするものを合わせて検索してみてください。
もちろんアルファベット（grid）でも検索してみてください。
Broken Grid Layout
今回は直接関係ないですが、ブロークングリッドも調べてみると参考になるかもしれません。
ブロークングリッドレイアウト | Web デザインクリップ【Web Design Clip】
課題「桶狭間の戦い」告知フライヤー
グリッド味が強い、日本の戦国史の一大イベント「桶狭間の戦い」を広告するフライヤーをデザインしてください。
- サイズ：B5（182mm×257mm）を A4 のアートボードに作成して、印刷。
- グリッドはオリジナルを設定するか、もしくは ABC をベースにして、各自アレンジ（グリッドを加えたり、変形したり）してください。
- 色：CMYK（※印刷するので）
- 必須項目 ①〜⑤ は必ず入れてください。※「会場」「日時」などの文言の有無は各自で考えて追加してください。
- 織田信長
- 今川義元
- 1560 年 6 月 12 日
- 尾張国知多郡桶狭間
- 狙うは今川義元、ただ 1 人なり。
- その他：永禄 3 年 5 月 19 日、要予約、自分で調べてテキスト追加可。
- 画像などは、著作権を調査の上利用しても可。
- 文字はアルファベットでも可
- 締め切り：2022 年 6 月 2 日（木）1 限目に印刷・講評
- グリッドテンプレート ABC ダウンロード
- 次回（6/2）、音を出しますので、イヤフォンを持ってきてください。
桶狭間の戦いとは
桶狭間の戦い（おけはざまのたたかい）は、1560 年（永禄 3 年）に尾張国（現在の愛知県）の桶狭間で、尾張国主「織田信長」と、駿河・遠江・三河を領国する「今川義元」との間で起こった合戦です。この合戦で、兵士の数では圧倒的に劣勢だった織田信長が勝利。「甲相駿三国同盟」の一角だった今川義元が討死したことで、戦国大名のパワーバランスが大きく変化。織田信長は、この戦いの勝利で天下取りへと躍進するきっかけをつかみました。
ルーブリック評価票
- 縦軸＝評価項目：観点（提出物、授業態度などに評価対象を分類したもの）
- 横軸＝レベル：尺度（達成レベルをアルファベットや数字で数段階に分けて示したもの）
- 評価ランクの目安
- C：課題意図を理解できていない、または技術が大幅に足りない。
- B：課題意図を理解できているが、表現力・技術が足りない。
- A：課題内容を理解し、適切な表現がされている。
- S：適切な処理がされており、さらに優れたアイデアが取り入れられている。
評価ポイント／評価ランク
| 評価ポイント／評価ランク | C | B | A | S |
|---|---|---|---|---|
| 仕様 | サイズや色数などが適切に作られておらず、仕様通りの作品になっていない。 | 仕様通りに作られている部分と作られていない部分があり、課題内容をすべて理解できていない。 | 全て仕様通りに作成されており、適切な場所にバランスよく配置されている。 | 全て仕様通りに作成されており、仕様内で様々な試みがされており、講師も気付いていないアイデアを提案してある。 |
| 文字の処理 | フォントの選択、サイズ、行間、文字間に処理がされていない。 もしくは、著しく処理が未熟なためバランスが悪くみえる。アイデアがみられない、もしくはアイデアが不適切。 |
フォントの選択、サイズ、行間、文字間のどれかに処理がされているが、適切な処理ではないものも含まれる。アイデアは良いものの技術が未熟。 | フォントの選択、サイズ、行間、文字間のすべてに適切な処理がされており、バランスよくレイアウトされている。よく考えられたアイデアが適切な技術で表現されている。 | フォントの選択、サイズ、行間、文字間の扱いの処理に加えて、その処理を施したことにより、他の要素を引き立てる働きを意識的に加えてある。フォントについても意図的に考えて使用されており説明ができる。 秀逸なアイデアで目を引くものになっている。 |
| グリッドのアイデア | グリッドがわかりづらく、上手く活用されていない。 | グリッドは利用されているが、アイデアが乏しく、試行錯誤の結果としては物足りない。 | グリッドのアイデア・造形に工夫が見られ、タイポグラフィとのバランスも上手くとられている。 | グリッドのアイデア・造形だけでなく、活用の方法にも工夫がされており、バランスも整えられて新しいビジュアルデザインを感じさせる。 |
| トーン＆マナー | 課題の意図を把握しておらず、色の選択、余白、装飾などの統一感がない。クライアントとの雰囲気も合っていないと感じる。 | 要素の一部には、雰囲気を感じるものの、全体的に弱い。統一感は見られるものの、大きさのバランス、配色などが崩れている。 | 課題の意図を把握し、資料などを参考に適切な雰囲気の配色・ビジュアルで統一されている。 | 課題の意図を把握し制作しているだけでなく、さらにテーマに準じた配色・ビジュアルが過不足無く施されている。 |