学科 ユーザーインターフェイス基礎③【オンライン】

1限目
学科ユーザーインターフェイス基礎③
作品の制作について

2限目
学科ユーザーインターフェイス基礎③
作品の立案

3限目
学科ユーザーインターフェイス基礎③
作品の立案

4限目
学科ユーザーインターフェイス基礎③
作品の立案

5限目
学科ユーザーインターフェイス基礎③
作品の立案

本日のテーマ

納品する作品の準備です。

アクセスマップ
アクセスマップ制作
レイアウトの５つの法則
アクセスマップ制作で使える基本操作
1. Illustrator「アウトライン」という言葉で覚えておく３つ！

アクセスマップ

アクセスマップとは？

一般的な地図とは違い、アクセスマップは「ある特定の目的地へのアクセス」に特化した地図です。曲がり角や交差点など、ポイントとなるところを大きく目立たせたり、逆に必要でない情報はバッサリ削ってしまうなど、「見せたいもの」「いらないもの」の見極めが重要です。

アクセスマップ制作

「道案内」を具現化してみましょう。

3種類の主語を意識してみましょう。
「私」「あなた」「誰か」を主語に

道案内として必要なのは、まず自分自身が、その道の案内を理解している必要があります。
最初は練習として、土地勘のある場所や、行ったことのある場所を題材にしてみましょう。
次に、「私（自分）」が理解しているものを正確に「あなた（他人）」に正確に伝えることが出来るように考えましょう。
まずは、①目的地に対して、②何処から、③どこを通って、④どのくらいの距離を、⑤どのように、を
ピクトグラムやロゴのように、箇条書きで良いので、文字に起こしていきましょう。
そして、「あなた（他人）」が整理出来たら更に「誰か（不特定多数のひと）」にも伝わる工夫を足してみましょう。
最後に、そのまとめた内容を、どう表現すればよいかを考え、伝わるデザインにしてみましょう。

実際に土地勘がある所をアクセスマップにしてみる☝️💡
文字で箇条書きで描きだす✐

レイアウトの５つの法則

どんなデザインでも内容に即してレイアウトすることが一番大切です。
秩序のないレイアウトは、受け手を混乱させるだけでなく、作品の印象、さらには発信者の印象をも悪くしたりしてしまいます。

レイアウトの目的は情報の明確化

レイアウトの５つの基本原則

情報の構造を明確にするには

余白をとる

揃える

グループ化する

強弱をつける

繰り返す

という法則を守る必要があります

起点は真ん中くらい
ルートを決める
目的地の周りは分かりやすく

レイヤーを綺麗に整理をする

アクセスマップ制作で使える基本操作

線パネル

線パネルでは、線の太さを設定するだけでなく、線の両端の形や、角の形を変える事ができます。また点線や矢印も作る事ができます。

アピアランスパネル

Adobe Illustrator で効果、アピアランスパネルおよびグラフィックスタイルパネルを使用すると、オブジェクト、グループまたは、レイヤーのアピアランスを変えることができます。また、1 つのオブジェクトを複数の必須部分に分割して、オブジェクト要素を個別に修正することもできます。

アピアランスの分割

1つのオブジェクトには塗り、線、効果、不透明度の4つのアピアランス属性があります。例えば”1つのオブジェクトに4つのアピアランス属性”を”1つのアピアランス属性で1つのオブジェクト”にしてくれるのがアピアランスを分割する機能

スタイライズ

【illustrator】オブジェクトに「スタイライズ」効果で影やぼかしをつける「スタイライズ」効果で、選択したオブジェクトに影や角を丸くするなどができます。

クリッピングマスク

クリッピングマスクは、その形状によってほかのアートワークをマスクするオブジェクトです。クリッピングマスクの内側にあるエリアのみが見えるように、アートワークをマスクの形状にクリップします。クリッピングマスクとマスクされたオブジェクトは、クリッピングセットと呼ばれます。

アウトライン

イラレで基本的に入力する文字フォントツールがありますが、そのフォントツールをアウトライン化することでオブジェクトにすることができます。
何が違うのかというと、フォントは文字情報、アウトライン化したのはオブジェクト(図形)情報ということです。
このアウトライン化をすれば、インストールしたフォントで別のパソコンで開く場合置き換わってしまうということを防ぐことができます。