9月の授業日記

8/25　Web画像の編集ソフトFireworks

ページに張り付ける画像の編集ソフト

既存の画像の編集

• コピー＆ペーストでブラウザから持ってくることもできる
• 画像をコピーしFWで新規を選ぶとコピーした画像のサイズが入力されている

画像のサイズ

• キャンバス＝書類（紙）の大きさ
• イメージ＝そのなかの画像の大きさ（リサンプリングでキャンバスごと）

保存

編集するときには編集可能なファイルを、webページ貼り付け用とは別に保存しておく必要

ツール

編集に使用する道具

選択ツール

• 画像やオブジェクトを選択したり移動したりする基本ツール

テキストツール

• 画像に文字が打てる
• テキストツールに切り替えクリックすると（ドラッグするとそのエリア内で改行してしまう）そこから文字が打てる

パネル

必要に応じてウィンドウメニューから補完するパネルを表示する

• レイヤー
  • 可視状態・上下関係
• 最適化
  • 画像に合わせた軽量化方法を選ぶ
• 整列
  • キャンバスか選択させたものどうしかで整列させる

今日のひとこと

画像にも文字が打てて驚いた

9/1　FWでの描画

クローン

コピーして同じ位置にペーストしてくれる

レイヤー

• FW上のすべてのオブジェクトは前後関係（レイヤー）を持ち、レイヤーパネルで上下関係を入れ替えたり可視・不可視を目のアイコンで切り替えられる
• 最適化されたファイルはレイヤーが残らないためもう編集はできない

描画ツール（+shiftで縦横同比率）

• 矩形
• 楕円
• 角丸（半径はカーソルキーで調整）
• 多角形/星形

キャンバスにフィット

大きめの大きさで描いてオブジェクトに合わせて書類サイズを調整できる

透過gif

• 矩形以外の図形で背景を透かしたい場合透過gifを用いる
• 透明のキャンバスで描画し、書き出し時に最適化パネルで透明を選ぶ

DWとFWの連携

DWに貼り付けたFW画像は連携され簡単に編集できる

1. 画像を選択し、FWで編集ボタンを押すとオリジナルファイルが開かれる
2. 画像に編集を行い終了ボタンを押すと保存と書き出しが行われDWに戻る

今日のひとこと

いろんな形を使って絵が描けた

９/８　さまざまな効果とピットマップ

決められたサイズでオブジェクトを作成する

適当なサイズで描画したオブジェクトを選択し、プロパティインスペクタで幅と高さを入力すればそのサイズにすることができる

ビットマップ

写真などはドットの組み合わせでできていて一部分を選択するには選択範囲

選択範囲作成のためのツール

マーキーツール

四角や丸で選択範囲を作成

投げ縄ツール

フリーハンドでドラッグして選択範囲を作成

自動選択ツール

• 特定の色をクリックで選択
• 選択範囲の反転で背景が単色の場合背景以外が選択できる

エフェクタとフィルタ

全体にレベル補正エフェクトでメリハリをだし花の部分を色相フィルタで色替えした

今日のひとこと

写真のいろも変えられて驚いた

9/22　アニメgif

マスク

画像の一部分を一時的に隠すことができる

修正>マスク>選択範囲を表示/非表示

• レイヤーに選択範囲が保存されるので編集も可能
• マスクをぼかすとふちがぼけ自然な合成ができる

アニメGIF

一枚の画像の中に複数のフレームがあり切り替えることでアニメーションにしている（表示>フレームパネルで管理）

• フレームを追加するにはパネルメニューもしくはアイコンからフレームの追加/複製
• フレームパネルで切り替えフレームを編集
• 書き出しはプリセットよりアニメGIF
• フレーム名の右の数字をクリックし再生時間を調整

同じような状態の一部分が変わる場合フレームの複製から編集する

今日のひとこと

投げ縄ツールは結構難しかったです