-本日のアジェンダ-
1限目
実技 ユーザーインターフェイス作成実習②
成績考査
2限目
実技 ユーザーインターフェイス作成実習②
成績考査
3限目
実技 ユーザーインターフェイス作成実習②
作品発表
4限目
実技 ユーザーインターフェイス作成実習②
Webサイトデザインについて
5限目
実技 ユーザーインターフェイス作成実習②
Webサイトデザインについて
本日のテーマ
第2回成績考査
カテゴリー: ECサイトについて
実技 ユーザーインターフェイス作成実習①
-本日のアジェンダ-
1限目
実技 ユーザーインターフェイス作成実習①
GIFアニメーションについて
2限目
実技 ユーザーインターフェイス作成実習①
GIFアニメーション作成
3限目
実技 ユーザーインターフェイス作成実習①
GIFアニメーション作成
4限目
実技 ユーザーインターフェイス作成実習①
GIFアニメーション作成
5限目
実技 ユーザーインターフェイス作成実習①
作品発表
本日のテーマ
GIFアニメーション
GIFアニメーションについて
GIFアニメーションは、Graphics Interchange Format の「マルチイメージ」を使ったアニメーション。アニメーションGIF ともいう。 マルチイメージは GIF87a で導入された機能で、複数のフレームを順に表示できる。
本日のキーワード
- GIF画像で保存
- GIFアニメ
- Photoshop「タイムライン」
- トゥイーン
- レイヤーパネル
- パペットワープ
- カンバスサイズ
参考サイト
- 最近よくみるGIF動画って何？ | ウェブラボ（株）スタッフブログ
- Photoshop でGIFアニメを作成する方法｜Photoshop マスター｜週刊 …
- 【Photoshop】トゥイーン機能を使って滑らかなGIFアニメを作る方法
- ゆっくりじわじわ、フシギな色変化。GIFアニメを使った目を引くサイトロゴの ..
- Webデザインにも取り入れたい、クリエイティブなGIFアニメーションまとめ
- 表現の幅がめちゃくちゃ広がる！GIFアニメーションのTwitter 活用事例12選
パペットワープ（Photoshop）
加工で写真のポーズを自由に変えたい人必見。Photoshop cs5で実装された「パペットワープ」で簡単にポーズが変えられます！座っている人が立ったり、ジャンプしたり。自由に動かして、写真の人物を元気に動き回らせることもできます。
参考サイト
- Photoshopのパペットワープで自由自在に写真加工する方法 | 東京上野の …
- Photoshop パペットワープがもっと上手くなる簡単テクニック | パソコン
- パペットワープツールを使用したベクターグラフィックの変形
パペットワープ（Illustrator）
パペットワープの機能はPhotoshopやAfterEffectsではおなじみの機能となりますが、ついにIllustratorにも搭載されました。もともとパペットとは「人形」の意味で、ワープは「歪み」となり、主に人や動物など、関節の可動を再現する変形に使用すると便利なツールになります。何かの軸を起点に歪みや回転を適用させる変形に非常に便利ですので、その使い方をご紹介します。