まずはスマホ出席で出席登録を行ってください。
今回の4桁の認証コードは「 」です。
Sponsored Link
前回はそれぞれのデザインの制作を進めましたね。
今回も全体としてレクチャーする内容はなく、これまでの情報を参考にしつつ、みなさんそれぞれのウェブサイトデザインで「この表現をやってみたい」との要望に一つずつ応えていきたいと思っています。
残り2回、3時間あれば、納得のできるサイトデザインを完成させられるはずです。
一緒に作り上げていきましょう！！
この記事の目次
文字詰め課題
早速始めていきたいのですが、これだけは今のうちにみなさんにレクチャーしたい！という内容があります。なお、この工程は実務でのデザイン作業で必須の技術です。
では準備を行いましょう。手順は以下。
- Photoshopを起動する。
- 上部メニューバーの「ファイル→新規作成」の順にクリック（ショートカット：Ctrl + N）で、
新規ドキュメントダイアログボックスを表示する。 - 「Web」タブをクリックし、プリセットの中から「Web一般（1366 x 768 px @72ppi）」を選択する。
- 右下の「作成」ボタンをクリックし、新規ファイルを作成。
- 下記記事を開く。
課題の提出
さて行った文字詰めの課題をjpgに書き出して提出しましょう。提出期限は本日中です。
課題の提出形式はjpg以外は受け付けられないようになっています。
必ずjpgに書き出して提出してください。
書き出しの手順は以下。
- 上部のメニューバーの「ファイル→書き出し→Web用に保存」の順にクリックする。
- 「Web用に保存」のダイアログボックスが出てきたら、
ボックス右上にある「プリセット」の右にあるプルダウンメニューを「JPEG標準」に変更。 - Web用に保存のボックス右下の「保存」ボタンをクリック。
- ファイル名を「学籍番号_文字詰め」とし保存をクリック。
では下のフォームに、書き出したJPGを添付して送信してください。
なお今回の授業回は第14回です。
Photoshopの基本設定
Photoshopの基本設定から行いましょう。
まずはPhotoshopを起動し、前回途中まで制作して保存したPSDファイルを開きましょう。
ファイル名は「学籍番号-wire.psd」としていたかと思います。
プロでも使える素材サイト
私が普段使っていた素材サイトを紹介していきたいと思います。
チラシやバナー、Webサイト以外にも使用用途があるからぜひ覚えていってくださいね！
みんなの力になれば嬉しいです！！
上記のサイトから各素材をダウンロードして使うと簡単にクオリティアップができますが、
教室のPCはそのままだとデータが消えてしまうので、ドキュメントフォルダ内に入れるか、USBに残しておきましょう！
次開いた時に使えなくなっちゃったら困りますからね。
色々まとめ
ウェブデザイン制作に役立つ情報をまとめておきます。
使えそうな情報はあるかな？？
デザインの見本をインプットしたいなら・・・
- 【S5-Style】Webデザインのリンク集・ポータルサイト
- 縦長のwebデザインギャラリー・サイトリンク集｜MUUUUU.ORG
- Web Design Clip | Webデザインクリップ
- WEBデザイン参考サイト bookma! v3
ブロックやディテールなど細かい部分のデザイン表現の実現方法は・・・
[Photoshop]WebサイトのブロックやディテールのデザインパーツをPhotoshopで制作する方法
[Photoshop] 調整レイヤー・塗りつぶしレイヤーで背景を作る
[動画解説]Illustratorを使った流体形シェイプの作り方
[動画解説]カーブしたブロックの作り方
レイアウトに困ったら・・・
配色に困ったら・・・
おしゃれなフォントを使いたかったら・・・
参考URL；【商用利用可＆日本語あり】 無料で使える！ Google フォント を活用しよう！ | Google Workspace 拡張の rakumo（ラクモ）
「どっちがいい？」に迷ったら・・・
Photoshop・Illustratorの加工方法などは・・・
Photoshop | WordPress・jQuery・HTML・CSSのスニペット集 WEBCRE8TOR.COM
Illustrator | WordPress・jQuery・HTML・CSSのスニペット集 WEBCRE8TOR.COM
本日のまとめ
これぞ実習です！
やりたい表現を実現できないとき、そもそも何をすればいいのかが分からない時、
そんな時にもそれ専用の教員が皆さんの目の前にいます（ワタシ）。
こうしたらいいんじゃない？？のアドバイスも、
こうしたらもっとよくなるよ！のアドバイスも、私の知りうる限りを伝えますので、
どんどん教員をツールとして使ってスキル・クオリティアップにつなげてください！
