スポンサーサイト

  1. トップ
  2. スポンサー広告
  3. スポンサーサイト
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
スポンサー広告 | コメントを書いてくれる人はこちら(-) | トラックバック(-) | [編集]
このページのトップへ移動する。

職業訓練WEBクリエーター科8日目

  1. トップ
  2. WEB制作ソフトの勉強
  3. 職業訓練WEBクリエーター科8日目

職業訓練WEBクリエーター科8日目

使用教科書

DW&FWトレーニングブックFWスーパーリファレンス

今日の大まかな内容

今日は、Fireworksは、写真の切り抜きについて勉強しました。

ようは、写真の一部の素材を切り出したり、写真を合成する時に使う手法です。

Dreamweaverは、ソフトの基本的な使い方(CSSの使い方以外)を覚えました。

授業の内容

1コマ目

写真のトリミング DW&FWトレーニングブック P69~P73 FWスーパーリファレンス P106

コツ・・・被写体を効果的に見せるには、その周りの空間の見せ方を考える。

トリミングの種類

切り抜きツール・・・選択ツールの切り抜きツールを使用し、切り抜きをしたい部分を選択する。
※写真の一部分しか使用しない場合にしようする

書き出し領域ツール・・・選択ツールの書き出し領域ツールを使用し、切り抜きしたい部分を選択し、その領域を新たなデータとして書き出す。
※元の写真を加工したくない場合、この方法で新たに画像を書き出して切り抜く。

ペンツールを使用して切り抜く方法・・・
※画像の被写体だけを切り出して切り抜く場合にしようします。画像の合成等に使用するテクニックです。

2コマ目

いろいろなマスクの方法 FWスーパーリファレンス P103~P107

マスクとは、自分が表示させてい部分以外を見えなくさせる処理で、いくつかのやりかたがあります。

基本的には見え方は同じなので、この3つのやり方で、シチュエーションに合った方法を用いる。

ベクターツールで使用した場合ベクターツール部分に明暗をつけると透過処理がかかる。
※黒に近づくと透過処理が強くなり、白に近づくと透過処理が弱くなる。

マスクとしてグループ化する方法は3種類

ベクターツール選択した部分と画像を合体させて表示させる方法。

選択した部分が画像より下にあると切り抜きしたい部分が無くなるので注意

内部にペーストする方法

ベクターツールで選択した部分に元の切り取った画像を編集の内部にペーストを選択する方法

選択ツールを使用してマスクをかける方法

これは主に自動選択ツールで選択した時に使用する方法です。

3コマ目

レイヤの基本的な操作 FWスーパーリファレンス P92~P98

レイヤーとはオブジェクト(図形や写真等の素材)が格項目ごとに階層状に分かれて表示されているもの。

Fireworksで制作する場合に覚えておいたほうが役に立つ。

レイヤーの非表示

今まで作った素材なのかで一時的に見えなくして作業をする場合使用する。

レイヤーパレットから目のマークを操作する。

新規レイヤーの作成

これはパソコンのデータをフォルダごとにまとめるように、まとまった素材(キャラクター等)とは別に新たに素材(他のキャラクターや背景等)を作成する際に使用すると便利です。

レイヤーパレットの下の方にあるホルダーのアイコンで作れる。

レイヤーに名前をつける

こらは素材に名前をつけていたほうがわかり易い時にしようします。レイヤーの数が多くなってきた場合につけていた方がわかり易い。

レイヤーパレットのレイヤー名をダブルクリックをすると変えることができる。

レイヤーにロックをかける

背景などの動かしたくないレイヤーを動かさないように設定することができる。

レイヤーパレットのエンピツマークをクリックして鍵マークにする。

レイヤーごとに削除する

作成していったが、必要がなくなった時にレイヤーごと削除することができる

レイヤーパレットの下の方にあるゴミ箱ボタンを消したいレイヤーを選択してクリックする。

地図の作成

地図制作の手順

道路を描く

①ベクター系ツールで道のりを描く

4コマ目

地図の作成続き 道路を描く

②アウトライン化

修正からパスの操作のアウトラインでアウトライン化する。

③パスの結合

修正からパスの結合→合体を選択

④色をつける

プロパティインセペクタから色を選択する。

線路の作成

①ベクター系ツールで路線を描く

②破線の設定

ストロークオプション→破線→詳細設定で設定

③線を重ねる

新たにせんを作成し、破線の線に重ねる。
※僕の場合、破線のパスをコピーしそれをアウトライン化してストロークで色をつけて重ねた。

課題で出された佐藤クリニックの地図の作成

このテクニックで課題でだされたものを作成

5コマ目

Dreamweaverでのページの作成

使用したテクニック

表の作成

ツールバー上にある表の作成から作成する。

表に見出しをつける

表の上段を選択し、プロパティインスペクタにあるヘッダにチェックマークを入れる。

表の幅を指定する。

テーブルタグを選択して、プロパティインスペクタから幅を指定する。

表の列を指定する。

列を指定して、プロパティインスペクタから幅を指定する。

セルの文字位置を設定する。

セルを選択し、プロパティインスペクタから縦・横の位置を指定する。

箇条書き

箇条書きしたい段落<P>を選択し、プロパティインスペクタから箇条書きボタンをクリックする。

下線のつけ方

下線をつけたい文章を選択して、テキスト→スタイル→アンダーラインから指定する。

見出し

見出しにしたい文章を指定し、プロパティインスペクタからフォーマットで見出しを選択する。

文章をページの真ん中にレイアウトする。

文章をテープルで囲い、それを中央揃えにする。

※テーブルに枠をつけると、枠がつくので注意

6コマ目

Dreamweaverで作成したWEBページを装飾しよう。

スポンサーサイト
このページのトップへ移動する。

評価・感想を書いてくれた人の内容

この記事に対する評価・感想を投稿

管理者にだけメッセージを送る

トラックバック トラックバックURL:
http://hamacom.blog4.fc2.com/tb.php/30-17c5b49c
サイズ変更ボタン サイズ縮小ボタン サイズ拡大ボタン サイズリセットボタン
RSSフィード

ブロとも申請フォーム
ブログ内検索

最近のエントリ
ユーザータグ
カレンダー

04 | 2018/05 | 06
- - 1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30 31 - -

ハマーにメールを送る

私ハマーにご意見・ご感想・調べてほしい事・オススメサイト等ありましたら気軽にメールしてください。

最近のコメント
全ての記事を表示する
カテゴリー
QRコード

QRコード

覗いてくれた人

月別アーカイブ
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。