学科 レイアウトデザイン基礎①

-本日のアジェンダ-

1限目
学科 レイアウトデザイン基礎①
コピーライトについて

2限目
学科 レイアウトデザイン基礎①
課題制作

3限目
学科 レイアウトデザイン基礎①
課題制作

4限目
学科 レイアウトデザイン基礎①
課題制作

5限目
学科 レイアウトデザイン基礎①
課題制作・講評

本日のテーマ

LP(ランディングページ)のワイヤーフレームを作成しましょう。

コピーライトとは?

「コピーライト」とは、英語「Copyright」を原語とするカタカナ語で、「著作権」の訳語です。 著作権とは知的財産権の一つで、文芸、学術、音楽など文化的な著作物を保護する権利です。 ですので、著作権に違反すると罰金や懲役の処罰を受けることもあります。

参考サイト

前回のおさらい

LP(ランディングページ)とは?

ランディングページ最適化はコンバージョン最適化、もしくはコンバージョン率最適化と呼ばれるより広範なインターネットマーケティング手法の一つであり、セールスリードや顧客となりうるウェブサイト訪問者の比率を向上させることを目的としている。 ウィキペディア

参考サイト

ワイヤーフレームとは?

ワイヤーフレームとは、webページのレイアウトを定める設計図のことです。
webサイトの制作現場で聞かないことがない、といえる単語であり、サイト制作において決して欠かせない要素です。
単に「ワイヤー」と呼ぶことも多いです。

制作のポイント

・使用ソフトはPhotoshopです。
・サイズはPC基準です。規格は世の中のサイト例を参考にしてみましょう。
【サイズ例】ページ幅1280px、コンテンツ幅960px
・まずは色を入れず、白黒で制作しましょう。
・余白を意識し、サイズバランスもWEBサイトの完成形と同じにしましょう。(実務ではpxピクセル単位で仕上げます)
・バナー制作と同じく、
①掲載が必要な内容(情報)を先にしっかりまとめる
②情報の順番づけ
③レイアウトを考える 手順で制作すると良いでしょう。そのレイアウトが、HTMLとCSSというルールに変わるだけです。

ワンポイントアドバイス

ワイヤーフレームの段階では、お仕事の契約成立に至っていない場合が多いです。逆を言えば、しっかりとしたワイヤーフレームを作成できるという事は、「仕事を獲得できる力がある」という証明にもなります。お客様のご要望(相手の気持ち)をしっかり理解する事を心掛けて制作をしてみましょう。

参考サイト

本日の課題

ワイヤーフレームの作成

白黒のワイヤーフレームを作成し、
5限目までにドロップボックスにUPしてください。講評を行います。
※ファイル名は、work_xxxx_20220718.jpg

学科 レイアウトデザイン基礎⑤

-本日のアジェンダ-

1限目
学科 レイアウトデザイン基礎⑤
成績考査

2限目
学科 レイアウトデザイン基礎⑤
成績考査

3限目
学科 レイアウトデザイン基礎⑤
成績考査

4限目
学科 レイアウトデザイン基礎⑤
成績考査

5限目
学科 レイアウトデザイン基礎⑤
講評

本日のテーマ

成績考査です

第4回成績考査

本日の4限目終了までに、WEBページのデザインラフを提出してください。
WEBページの内容は、自由です。
※是非、就職活動に活かせる作品を作成してみてください。
※提出方法はデータ保存したデザインラフのWordpress投稿です。

WordPressへの成績考査の上げ方

ご自身のWordPressに成績考査用のバナーを投稿していただきます。
手順は以下の通りです。

①固定ページに新規投稿で作成します。

②タイトル(タイトルを追加の部分)に「第四回成績考査」、次のブロックにお名前(漢字フルネーム)を入力して下さい。

③以降のブロックにバナー画像をブロックエディタ「画像」にてアップロードして下さい。

④投稿設定のパーマリンクのURLスラッグに下記を設定して下さい。
http://deau90□□(出席番号).wp.xdomain.jp/grade-check_お名前(ローマ字)_20220128

⑤公開状態をパスワード保護にします。パスワードは「test」と設定して下さい。

⑥公開にして終了です。固定ページ一覧に作成したページが出来ているか確認して下さい。