2015/05/09 第5回g-study発表資料 "動き"を見るポイント
TRANSCRIPT
![Page 1: 2015/05/09 第5回G-Study発表資料 "動き"を見るポイント](https://reader036.vdocuments.pub/reader036/viewer/2022062407/55d0cba0bb61eb227f8b4641/html5/thumbnails/1.jpg)
“動き”を見るポイント 2015/05/09 第5回G-Study
![Page 2: 2015/05/09 第5回G-Study発表資料 "動き"を見るポイント](https://reader036.vdocuments.pub/reader036/viewer/2022062407/55d0cba0bb61eb227f8b4641/html5/thumbnails/2.jpg)
自己紹介 名前 吉田 剛 (ヨシダ ツヨシ) 職業 デベロッパー系 (元Flash使い) スマホUI講師 最近の良い事 初めてのテレビ購入 最近の悪い事 尋常でない疲労感
2
![Page 3: 2015/05/09 第5回G-Study発表資料 "動き"を見るポイント](https://reader036.vdocuments.pub/reader036/viewer/2022062407/55d0cba0bb61eb227f8b4641/html5/thumbnails/3.jpg)
“動き”を見るポイント
3
※ここでの”動き”とは、 アニメーションを指します
![Page 4: 2015/05/09 第5回G-Study発表資料 "動き"を見るポイント](https://reader036.vdocuments.pub/reader036/viewer/2022062407/55d0cba0bb61eb227f8b4641/html5/thumbnails/4.jpg)
“動き”を見るポイント
4
職能を問わず動きを作る/提案する今、 まずは種類に注目して見よう!
![Page 5: 2015/05/09 第5回G-Study発表資料 "動き"を見るポイント](https://reader036.vdocuments.pub/reader036/viewer/2022062407/55d0cba0bb61eb227f8b4641/html5/thumbnails/5.jpg)
動きの種類
5
1. 移動 2. 回転 3. 拡縮 (拡大・縮小) 4. 色 5. 変形
![Page 6: 2015/05/09 第5回G-Study発表資料 "動き"を見るポイント](https://reader036.vdocuments.pub/reader036/viewer/2022062407/55d0cba0bb61eb227f8b4641/html5/thumbnails/6.jpg)
1. 移動
6
動画参照 http://cda244.com/seminar/d150509_gstudy/movie/animation_1.mp4
![Page 7: 2015/05/09 第5回G-Study発表資料 "動き"を見るポイント](https://reader036.vdocuments.pub/reader036/viewer/2022062407/55d0cba0bb61eb227f8b4641/html5/thumbnails/7.jpg)
2. 回転
7
動画参照 http://cda244.com/seminar/d150509_gstudy/movie/animation_2.mp4
![Page 8: 2015/05/09 第5回G-Study発表資料 "動き"を見るポイント](https://reader036.vdocuments.pub/reader036/viewer/2022062407/55d0cba0bb61eb227f8b4641/html5/thumbnails/8.jpg)
3. 拡縮
8
動画参照 http://cda244.com/seminar/d150509_gstudy/movie/animation_3.mp4
![Page 9: 2015/05/09 第5回G-Study発表資料 "動き"を見るポイント](https://reader036.vdocuments.pub/reader036/viewer/2022062407/55d0cba0bb61eb227f8b4641/html5/thumbnails/9.jpg)
4. 色
9
動画参照 http://cda244.com/seminar/d150509_gstudy/movie/animation_4.mp4
![Page 10: 2015/05/09 第5回G-Study発表資料 "動き"を見るポイント](https://reader036.vdocuments.pub/reader036/viewer/2022062407/55d0cba0bb61eb227f8b4641/html5/thumbnails/10.jpg)
5. 変形
10
動画参照 http://cda244.com/seminar/d150509_gstudy/movie/animation_5.mp4
![Page 11: 2015/05/09 第5回G-Study発表資料 "動き"を見るポイント](https://reader036.vdocuments.pub/reader036/viewer/2022062407/55d0cba0bb61eb227f8b4641/html5/thumbnails/11.jpg)
組み合わせ例(移動 + 色)
11
動画参照 http://cda244.com/seminar/d150509_gstudy/movie/comb_1.mp4
![Page 12: 2015/05/09 第5回G-Study発表資料 "動き"を見るポイント](https://reader036.vdocuments.pub/reader036/viewer/2022062407/55d0cba0bb61eb227f8b4641/html5/thumbnails/12.jpg)
組み合わせ例 (移動+回転+拡色)
12
動画参照 http://cda244.com/seminar/d150509_gstudy/movie/comb_2.mp4
![Page 13: 2015/05/09 第5回G-Study発表資料 "動き"を見るポイント](https://reader036.vdocuments.pub/reader036/viewer/2022062407/55d0cba0bb61eb227f8b4641/html5/thumbnails/13.jpg)
まとめ
13
1. 移動 2. 回転 3. 拡縮 (拡大・縮小) 4. 色 5. 変形
![Page 14: 2015/05/09 第5回G-Study発表資料 "動き"を見るポイント](https://reader036.vdocuments.pub/reader036/viewer/2022062407/55d0cba0bb61eb227f8b4641/html5/thumbnails/14.jpg)
まとめ
14
1. 移動 2. 回転 3. 拡縮 (拡大・縮小) 4. 色 5. 変形
複雑な動きはバラして個別に観察!
ありがとうございました