Submit Search
Upload
Design JP vol2 (Motion Design & Animation)
•
13 likes
•
6,261 views
Yukio Andoh
Follow
Design JP vol2 (Motion Design & Animation)
Read less
Read more
Technology
Report
Share
Report
Share
1 of 65
Download now
Download to read offline
Recommended
チームを動かすデザイナー
チームを動かすデザイナー
Keisuke Tsukayoshi
株式会社basicで行われたデザイナー向けイベント"Nextstage Design Nite 〜新しいデザイナーのキャリアを考えよう〜"での発表資料です。 https://nextstage.basicinc.jp/nextstage-nesign-nite -- くれちょん https://twitter.com/redxiii_
新規事業サービス 「おいしい健康」の 機能追加・改善の仮説検証
新規事業サービス 「おいしい健康」の 機能追加・改善の仮説検証
Kanako Sakamoto
12/2「Think User First #2 - Cookpad × Fablic -」で公開した資料です ※一部の情報を編集した上で公開しています
Shin UX 2017 - UX strategy - UX review
Shin UX 2017 - UX strategy - UX review
Yukio Andoh
Shin UX 2017 UX strategy - UX review
UX Strategy 2016/06/18
UX Strategy 2016/06/18
Yukio Andoh
UX Strategy 2016/06/18
UX milk (UX Jam) 20160108
UX milk (UX Jam) 20160108
Yukio Andoh
UX milk (UX Jam) 20160108
BPStudy #111 iOS 10 and iPhone 7
BPStudy #111 iOS 10 and iPhone 7
Yukio Andoh
BPStudy #111 iOS 10 and iPhone 7
UX Jam x UX Sketch 2017 HD
UX Jam x UX Sketch 2017 HD
Yukio Andoh
UX Jam x UX Sketch 2017 HD
Uxマップを使ったサービス改善
Uxマップを使ったサービス改善
Keisuke Tsukayoshi
Think User First - Cookpad × Fablic http://connpass.com/event/17492/ ユーザーファーストを大切にするファブリックとクックパッドの二社合同で行われたデザイン勉強会イベントのスライド資料です。 -- 塚由 恵介(つかよし けいすけ) ファッションフリマアプリフリル プロダクトオーナー兼デザイナー @redxiii_
Recommended
チームを動かすデザイナー
チームを動かすデザイナー
Keisuke Tsukayoshi
株式会社basicで行われたデザイナー向けイベント"Nextstage Design Nite 〜新しいデザイナーのキャリアを考えよう〜"での発表資料です。 https://nextstage.basicinc.jp/nextstage-nesign-nite -- くれちょん https://twitter.com/redxiii_
新規事業サービス 「おいしい健康」の 機能追加・改善の仮説検証
新規事業サービス 「おいしい健康」の 機能追加・改善の仮説検証
Kanako Sakamoto
12/2「Think User First #2 - Cookpad × Fablic -」で公開した資料です ※一部の情報を編集した上で公開しています
Shin UX 2017 - UX strategy - UX review
Shin UX 2017 - UX strategy - UX review
Yukio Andoh
Shin UX 2017 UX strategy - UX review
UX Strategy 2016/06/18
UX Strategy 2016/06/18
Yukio Andoh
UX Strategy 2016/06/18
UX milk (UX Jam) 20160108
UX milk (UX Jam) 20160108
Yukio Andoh
UX milk (UX Jam) 20160108
BPStudy #111 iOS 10 and iPhone 7
BPStudy #111 iOS 10 and iPhone 7
Yukio Andoh
BPStudy #111 iOS 10 and iPhone 7
UX Jam x UX Sketch 2017 HD
UX Jam x UX Sketch 2017 HD
Yukio Andoh
UX Jam x UX Sketch 2017 HD
Uxマップを使ったサービス改善
Uxマップを使ったサービス改善
Keisuke Tsukayoshi
Think User First - Cookpad × Fablic http://connpass.com/event/17492/ ユーザーファーストを大切にするファブリックとクックパッドの二社合同で行われたデザイン勉強会イベントのスライド資料です。 -- 塚由 恵介(つかよし けいすけ) ファッションフリマアプリフリル プロダクトオーナー兼デザイナー @redxiii_
デザインのリファクタリング (慣れを大切に)
デザインのリファクタリング (慣れを大切に)
Yukio Andoh
デザインのリファクタリング (慣れを大切に) Refactoring Design (Without Being Noticed)
SIGGRAPH ASIA 2020 みどころ紹介
SIGGRAPH ASIA 2020 みどころ紹介
Yukio Andoh
SIGGRAPH ASIA 2020 みどころ紹介 by シーグラフ東京
UX MILK All Night 2020 (Yukio Andoh)
UX MILK All Night 2020 (Yukio Andoh)
Yukio Andoh
The art of increasing the resolution of eyes, hands and movement in UX design.
Ethical UX / uxmilk fukuoka 2019/12/17
Ethical UX / uxmilk fukuoka 2019/12/17
Yukio Andoh
Ethical UX / uxmilk fukuoka 2019/12/17
Ethical UX
Ethical UX
Yukio Andoh
Ethical UX
SIGGRAPH 2019 preparation
SIGGRAPH 2019 preparation
Yukio Andoh
SIGGRAPH 2019 preparation
SIGGRAPH ASIA 2018 : BOF : SIGGRAPH ASIA 2018の歩き方
SIGGRAPH ASIA 2018 : BOF : SIGGRAPH ASIA 2018の歩き方
Yukio Andoh
SIGGRAPH ASIA 2018 : BOF : SIGGRAPH ASIA 2018の歩き方
VoiceUIのデザインと音声サービスの勘所
VoiceUIのデザインと音声サービスの勘所
Yukio Andoh
Voice UI, Voice UX, VUI : Apps Japan 2018
VUIテクノロジーアップデート& VUIビジネストレンド紹介
VUIテクノロジーアップデート& VUIビジネストレンド紹介
Yukio Andoh
#inevitableja 【VUIテクノロジーアップデート& VUIビジネストレンド紹介】INEVITABLE ja night 4 での発表資料を公開しました!
Voice UI Designer Meetup Tokyo 「 VUIデザインの勘所」
Voice UI Designer Meetup Tokyo 「 VUIデザインの勘所」
Yukio Andoh
#vuijp Voice UI Designer Meetup Tokyo 「 VUIデザインの勘所」音声UI/UXに関する情報満載の発表資料を公開しました!
Voice UI/UX Design Guideline
Voice UI/UX Design Guideline
Yukio Andoh
Voice UI/UX Design Guideline 音声/会話インタフェースのUXの勘所
DesignJP prototyping 20160825
DesignJP prototyping 20160825
Yukio Andoh
DesignJP prototyping 20160825
Google Cardboard and VR Tips (at KL)
Google Cardboard and VR Tips (at KL)
Yukio Andoh
Google Cardboard and VR Tips (at KL)
google cardboard and VR tips
google cardboard and VR tips
Yukio Andoh
google cardboard and VR tips
WebGL Performance Tuning Tips
WebGL Performance Tuning Tips
Yukio Andoh
ハードウェア特性に基づいた WebGL 高速化手法 WebGL fast method that is based on hardware characteristics
HTML5 Conference 2015 Design Sprint
HTML5 Conference 2015 Design Sprint
Yukio Andoh
Google Design Sprint at HTML5 Conference (2015/1/25) 「Googleベンチャーズの手法に学ぶ、デザインスプリントのワークショップ」
3Dプリンタ関連論文(SIGGRAPHより)
3Dプリンタ関連論文(SIGGRAPHより)
Yukio Andoh
3Dプリンタ関連論文(SIGGRAPHより)
3Dプリンタを活用したアート作品100選
3Dプリンタを活用したアート作品100選
Yukio Andoh
3Dプリンタを活用したアート作品100選
BPStudy #87 (iOS8 & iPhone6)
BPStudy #87 (iOS8 & iPhone6)
Yukio Andoh
BaaS study 0530
BaaS study 0530
Yukio Andoh
ReonHata_便利の副作用に気づかせるための発想支援手法の評価---行為の増減の提示による気づきへの影響---
ReonHata_便利の副作用に気づかせるための発想支援手法の評価---行為の増減の提示による気づきへの影響---
Matsushita Laboratory
我々はこれまで,新たなモノを産出する過程において「便利にすること」によって副次的に生じる課題を「便利の副作用」と定義し,その低減を目的としてアイディアの発想支援手法を提案してきた. これまでの研究では,便利前後の行為の増減に着目することにより便利の副作用への気づきの誘発が示唆されたものの,行為の増減の提示による便利の副作用への気づきへの影響は十分に検討できていなかった. そのため,本稿では行為の提示により便利の副作用に気づき,それを防いだアイディアの発想の支援が可能かの検証を目的として実験を行い,その有効性について検証する. 実験では,行為の増減の提示の有無によりアイディア発想にどのような影響を与えるか検証を行う.
This is the company presentation material of RIZAP Technologies, Inc.
This is the company presentation material of RIZAP Technologies, Inc.
chiefujita1
RIZAPテクノロジーズ株式会社の会社説明資料です。
More Related Content
More from Yukio Andoh
デザインのリファクタリング (慣れを大切に)
デザインのリファクタリング (慣れを大切に)
Yukio Andoh
デザインのリファクタリング (慣れを大切に) Refactoring Design (Without Being Noticed)
SIGGRAPH ASIA 2020 みどころ紹介
SIGGRAPH ASIA 2020 みどころ紹介
Yukio Andoh
SIGGRAPH ASIA 2020 みどころ紹介 by シーグラフ東京
UX MILK All Night 2020 (Yukio Andoh)
UX MILK All Night 2020 (Yukio Andoh)
Yukio Andoh
The art of increasing the resolution of eyes, hands and movement in UX design.
Ethical UX / uxmilk fukuoka 2019/12/17
Ethical UX / uxmilk fukuoka 2019/12/17
Yukio Andoh
Ethical UX / uxmilk fukuoka 2019/12/17
Ethical UX
Ethical UX
Yukio Andoh
Ethical UX
SIGGRAPH 2019 preparation
SIGGRAPH 2019 preparation
Yukio Andoh
SIGGRAPH 2019 preparation
SIGGRAPH ASIA 2018 : BOF : SIGGRAPH ASIA 2018の歩き方
SIGGRAPH ASIA 2018 : BOF : SIGGRAPH ASIA 2018の歩き方
Yukio Andoh
SIGGRAPH ASIA 2018 : BOF : SIGGRAPH ASIA 2018の歩き方
VoiceUIのデザインと音声サービスの勘所
VoiceUIのデザインと音声サービスの勘所
Yukio Andoh
Voice UI, Voice UX, VUI : Apps Japan 2018
VUIテクノロジーアップデート& VUIビジネストレンド紹介
VUIテクノロジーアップデート& VUIビジネストレンド紹介
Yukio Andoh
#inevitableja 【VUIテクノロジーアップデート& VUIビジネストレンド紹介】INEVITABLE ja night 4 での発表資料を公開しました!
Voice UI Designer Meetup Tokyo 「 VUIデザインの勘所」
Voice UI Designer Meetup Tokyo 「 VUIデザインの勘所」
Yukio Andoh
#vuijp Voice UI Designer Meetup Tokyo 「 VUIデザインの勘所」音声UI/UXに関する情報満載の発表資料を公開しました!
Voice UI/UX Design Guideline
Voice UI/UX Design Guideline
Yukio Andoh
Voice UI/UX Design Guideline 音声/会話インタフェースのUXの勘所
DesignJP prototyping 20160825
DesignJP prototyping 20160825
Yukio Andoh
DesignJP prototyping 20160825
Google Cardboard and VR Tips (at KL)
Google Cardboard and VR Tips (at KL)
Yukio Andoh
Google Cardboard and VR Tips (at KL)
google cardboard and VR tips
google cardboard and VR tips
Yukio Andoh
google cardboard and VR tips
WebGL Performance Tuning Tips
WebGL Performance Tuning Tips
Yukio Andoh
ハードウェア特性に基づいた WebGL 高速化手法 WebGL fast method that is based on hardware characteristics
HTML5 Conference 2015 Design Sprint
HTML5 Conference 2015 Design Sprint
Yukio Andoh
Google Design Sprint at HTML5 Conference (2015/1/25) 「Googleベンチャーズの手法に学ぶ、デザインスプリントのワークショップ」
3Dプリンタ関連論文(SIGGRAPHより)
3Dプリンタ関連論文(SIGGRAPHより)
Yukio Andoh
3Dプリンタ関連論文(SIGGRAPHより)
3Dプリンタを活用したアート作品100選
3Dプリンタを活用したアート作品100選
Yukio Andoh
3Dプリンタを活用したアート作品100選
BPStudy #87 (iOS8 & iPhone6)
BPStudy #87 (iOS8 & iPhone6)
Yukio Andoh
BaaS study 0530
BaaS study 0530
Yukio Andoh
More from Yukio Andoh
(20)
デザインのリファクタリング (慣れを大切に)
デザインのリファクタリング (慣れを大切に)
SIGGRAPH ASIA 2020 みどころ紹介
SIGGRAPH ASIA 2020 みどころ紹介
UX MILK All Night 2020 (Yukio Andoh)
UX MILK All Night 2020 (Yukio Andoh)
Ethical UX / uxmilk fukuoka 2019/12/17
Ethical UX / uxmilk fukuoka 2019/12/17
Ethical UX
Ethical UX
SIGGRAPH 2019 preparation
SIGGRAPH 2019 preparation
SIGGRAPH ASIA 2018 : BOF : SIGGRAPH ASIA 2018の歩き方
SIGGRAPH ASIA 2018 : BOF : SIGGRAPH ASIA 2018の歩き方
VoiceUIのデザインと音声サービスの勘所
VoiceUIのデザインと音声サービスの勘所
VUIテクノロジーアップデート& VUIビジネストレンド紹介
VUIテクノロジーアップデート& VUIビジネストレンド紹介
Voice UI Designer Meetup Tokyo 「 VUIデザインの勘所」
Voice UI Designer Meetup Tokyo 「 VUIデザインの勘所」
Voice UI/UX Design Guideline
Voice UI/UX Design Guideline
DesignJP prototyping 20160825
DesignJP prototyping 20160825
Google Cardboard and VR Tips (at KL)
Google Cardboard and VR Tips (at KL)
google cardboard and VR tips
google cardboard and VR tips
WebGL Performance Tuning Tips
WebGL Performance Tuning Tips
HTML5 Conference 2015 Design Sprint
HTML5 Conference 2015 Design Sprint
3Dプリンタ関連論文(SIGGRAPHより)
3Dプリンタ関連論文(SIGGRAPHより)
3Dプリンタを活用したアート作品100選
3Dプリンタを活用したアート作品100選
BPStudy #87 (iOS8 & iPhone6)
BPStudy #87 (iOS8 & iPhone6)
BaaS study 0530
BaaS study 0530
Recently uploaded
ReonHata_便利の副作用に気づかせるための発想支援手法の評価---行為の増減の提示による気づきへの影響---
ReonHata_便利の副作用に気づかせるための発想支援手法の評価---行為の増減の提示による気づきへの影響---
Matsushita Laboratory
我々はこれまで,新たなモノを産出する過程において「便利にすること」によって副次的に生じる課題を「便利の副作用」と定義し,その低減を目的としてアイディアの発想支援手法を提案してきた. これまでの研究では,便利前後の行為の増減に着目することにより便利の副作用への気づきの誘発が示唆されたものの,行為の増減の提示による便利の副作用への気づきへの影響は十分に検討できていなかった. そのため,本稿では行為の提示により便利の副作用に気づき,それを防いだアイディアの発想の支援が可能かの検証を目的として実験を行い,その有効性について検証する. 実験では,行為の増減の提示の有無によりアイディア発想にどのような影響を与えるか検証を行う.
This is the company presentation material of RIZAP Technologies, Inc.
This is the company presentation material of RIZAP Technologies, Inc.
chiefujita1
RIZAPテクノロジーズ株式会社の会社説明資料です。
JSAI_類似画像マッチングによる器への印象付与手法の妥当性検証_ver.3_高橋りさ
JSAI_類似画像マッチングによる器への印象付与手法の妥当性検証_ver.3_高橋りさ
0207sukipio
JSAI2024の発表スライドです.
TaketoFujikawa_物語のコンセプトに基づく情報アクセス手法の基礎検討_JSAI2024
TaketoFujikawa_物語のコンセプトに基づく情報アクセス手法の基礎検討_JSAI2024
Matsushita Laboratory
浜松で開催されたJSAI2024(第38回)での発表.
CS集会#13_なるほどわからん通信技術 発表資料
CS集会#13_なるほどわからん通信技術 発表資料
Yuuitirou528 default
CS集会でお話した、通信技術のひとつである「変調」について解説した資料です。 https://x.com/vrc_cpu_science/status/1724784316738355560
遺伝的アルゴリズムと知識蒸留による大規模言語モデル(LLM)の学習とハイパーパラメータ最適化
遺伝的アルゴリズムと知識蒸留による大規模言語モデル(LLM)の学習とハイパーパラメータ最適化
t m
オープンエンドな進化から着想を得て、個々の大規模言語モデル(LLM)が、グループとして学習を進めながら、ノームエージェントとして機能するという概念を探求しています。これは、単一のモデルでは難しい複雑な問題を解決することを目的としています。具体的な方法として、遺伝的アルゴリズムと知識蒸留を組み合わせた学習プロセスを提案しています。知識蒸留によって学習を進め、同時に遺伝的アルゴリズムでハイパーパラメータを最適化することで、より効率的な学習を目指します。ドメインタスクとして、指示からPythonコードを生成するコード生成タスクを選択しました。実験では、学習に3つの学習モデルと1つの教師モデルを使用しました。その結果、HumanEvalのpass@1で精度が1.2%向上し、学習が進むにつれて学習率が最適化された兆候が見られました。しかし、大幅な精度向上を達成し、さまざまなハイパーパラメータを最適化するには、まだ課題が残っています。
論文紹介:When Visual Prompt Tuning Meets Source-Free Domain Adaptive Semantic Seg...
論文紹介:When Visual Prompt Tuning Meets Source-Free Domain Adaptive Semantic Seg...
Toru Tamaki
Xinhong Ma, Yiming Wang, Hao Liu, Tianyu Guo, Yunhe Wang, "When Visual Prompt Tuning Meets Source-Free Domain Adaptive Semantic Segmentation" NeurIPS2023 https://proceedings.neurips.cc/paper_files/paper/2023/hash/157c30da6a988e1cbef2095f7b9521db-Abstract-Conference.html
LoRaWAN 4チャンネル電流センサー・コンバーター CS01-LB 日本語マニュアル
LoRaWAN 4チャンネル電流センサー・コンバーター CS01-LB 日本語マニュアル
CRI Japan, Inc.
LoRaWAN 4チャンネル電流センサー・コンバーター CS01-LB 日本語マニュアル
Recently uploaded
(8)
ReonHata_便利の副作用に気づかせるための発想支援手法の評価---行為の増減の提示による気づきへの影響---
ReonHata_便利の副作用に気づかせるための発想支援手法の評価---行為の増減の提示による気づきへの影響---
This is the company presentation material of RIZAP Technologies, Inc.
This is the company presentation material of RIZAP Technologies, Inc.
JSAI_類似画像マッチングによる器への印象付与手法の妥当性検証_ver.3_高橋りさ
JSAI_類似画像マッチングによる器への印象付与手法の妥当性検証_ver.3_高橋りさ
TaketoFujikawa_物語のコンセプトに基づく情報アクセス手法の基礎検討_JSAI2024
TaketoFujikawa_物語のコンセプトに基づく情報アクセス手法の基礎検討_JSAI2024
CS集会#13_なるほどわからん通信技術 発表資料
CS集会#13_なるほどわからん通信技術 発表資料
遺伝的アルゴリズムと知識蒸留による大規模言語モデル(LLM)の学習とハイパーパラメータ最適化
遺伝的アルゴリズムと知識蒸留による大規模言語モデル(LLM)の学習とハイパーパラメータ最適化
論文紹介:When Visual Prompt Tuning Meets Source-Free Domain Adaptive Semantic Seg...
論文紹介:When Visual Prompt Tuning Meets Source-Free Domain Adaptive Semantic Seg...
LoRaWAN 4チャンネル電流センサー・コンバーター CS01-LB 日本語マニュアル
LoRaWAN 4チャンネル電流センサー・コンバーター CS01-LB 日本語マニュアル
Design JP vol2 (Motion Design & Animation)
1.
インタラクションデザインの 調整のコツと、 それにまつわる コミュニケーションの仕⽅ Design-JP #2 2017.5.10 @yukio_andoh 1
2.
2 安藤幸央(あんどうゆきお)@yukio_andoh
3.
本⽇のインタラクションデザイン 3 + ≒モーション、アニメーション ≠ 相互作用 (Inter
+ Action)
4.
本⽇のインタラクションデザイン 4 + Motionディレクション/テスト/コツ Communicationと対話/⾔葉/コツ
5.
Motion & Animation 5
6.
7.
アニメーションとは? 7 Norman McLaren アニメーションは動くものを 描くのではなく 描かれたものを動かす芸術です
8.
アニメーションは装飾ではなく機能である Pasquale DʼSilva(アニメーター) “ 8
9.
なぜアニメーションさせるのか? 9 ●画⾯や要素が切り替わったことを知らせる ●変化をより把握しやすいものにする ●⼩さなものにも注意を促す注⽬してもらう ●動きによって楽しみを感じてもらう ●正しい情報構造の理解を⼿助けする
10.
フリクション = 意図的違和感 10 Bad
Friction / フローがスタックしてしまうこと Unseen Friction / フローをジャンプすること Boundary Friction / タッチポイント間を継ぐこと Intentional Friction / あらかじめ事前に防ぐこと Learning Friction / 学んでわかりやすくなること External Friction / 条件や規制をふまえること
11.
なぜアニメーションさせるのか? 11
12.
アニメーションとは? 12 + 時間 と 位置や形の変化 時間
と ⾊や透明度の変化 ※透明処理は、処理負荷が⾼く、不⾃然に遅くなりがち
13.
瞬間 履歴 同時性 速度 ⼀時的 13 持続遷移 変化 繰返し 軌跡
転換 リズム 蓄積 密度 予測
14.
14
15.
15
16.
16 実際のUIアニメーションは 300ms〜400ms(最少で150ms) 触ってから動くのが素早すぎると、 ⾃分が操作して動かした実感がしない 触った直後は指で隠れているかもしれない ⽌まったと認識するには、 時間がかかる。0秒では無い 実際のアニメーションの前後も重要
17.
17 次に起こることが予想 できるのが良い。 反応が速すぎるのも 良くない。不安になる
18.
18240fps ハイスピードカメラでの分解して確認!
19.
19 RemoteTestKit がオススメ 15fps
20.
ディズニーのアニメーションの法則 20 ■ スクオッシュ(潰し)とストレッチ(伸ばし) ■ アンチシペーション(予備動作) ■
ステージング(舞台演出) ■ ストレート・アヘッド・アクション(逐次描き)と ポーズ・トゥ・ポーズ(原画による設計) ■ フォロースルーとオーバーラッピングアクション (あと追いの⼯夫) ■ スロー・インとスロー・アウト(両端づめ) ■ アーク(運動曲線) ■ 副次アクション ■ タイミング ■ 誇張 ■ 実質感のある絵 ■ アピール(訴える⼒)
21.
21 ディズニーアニメーション ⽣命を吹き込む魔法 ― The
Illusion of Life
22.
22 https://vimeo.com/93206523
23.
23
24.
24
25.
25 気に⼊ったアニメーションのサンプルを蓄えておく https://sparanoid.com/lab/path-menu/# https://uimovement.com
26.
26 実際のUIアニメーションは 300ms〜400ms(最少で150ms) 触ってから動くのが素早すぎると、 ⾃分が操作して動かした実感がしない 触った直後は指で隠れているかもしれない ⽌まったと認識するには、 時間がかかる。0秒では無い 実際のアニメーションの前後も重要
27.
27 動き過ぎ、酔ってしまうような UI Motion
?! VS.
28.
28
29.
29
30.
30
31.
Communication Design x Tech. 31
32.
× 32
33.
× var c=document.getElementById("myCanvas"); var ctx=c.getContext("2d"); ctx.beginPath(); ctx.arc(100,75,50,0,2*Math.PI); ctx.stroke(); 33
34.
× 34
35.
var c=document.getElementById("myCanvas"); var ctx=c.getContext("2d"); ctx.beginPath(); ctx.arc(100,75,50,0,2*Math.PI); ctx.stroke(); ○ 35
36.
○ 36
37.
○ 37
38.
○ 38
39.
×○ 39
40.
× 40
41.
○ 41
42.
○ Futura42
43.
○ Futura43
44.
44
45.
コミュニケーションとは、お互いの別々の体験がひ とつの共有財産となるまで、その体験を貸し借りす るプロセスのことを⾔う。 ジョン・デューイ(哲学者) “ 45
46.
46
47.
47
48.
48 ディレクター: そこもっとス〜っといって スカっと動かないかな〜 いい具合にやってよ〜 ※フィクションです 「拡⼤する」「展開する」みたいな ⼀般的すぎ、解釈があいまいな⾔葉 は使わない。必ず補⾜を加える。
49.
■すいすい 滞ることなく移動したり、物事が進⾏する様⼦。 タッチパネルなど、操作に体する反応が素早く、遅延なく画⾯が変化する様。 ■すかっ じゃまになるものがなく、壮快な様⼦ 指やマウスで操作し始めてからの動き始め、⽴ち上がりが素早く、引っかかりが無い様。 ■すこん 軽めのもの同⼠が、勢い良く当たったり、はまったりする様⼦ [類語] すぽん 移動後の⾏き先があらかじめ予想でき、その予想先にぴったりと、素早くはまる様。 ■すっ ⾳もなく物が移動する様⼦。 反応や抵抗が少ない状態で、移動させることが可能なこと、また移動距離は短め。
49
50.
■ずっしり ⾮常に重たいものの、重さが伝わる様⼦。 ⼤きめの部品や、素材を動かす際の反応のし始めや移動などが遅く重たさを感じる様。 ■すっぱり 鋭い刃物で、直線的にものを切断する様⼦。転じて、潔く未練無く物事を処理する様⼦。 今まで表⽰されていたものが必要なくなった場合、奇麗に画⾯から消えてなくなったりする 様⼦。 ■すっぽり ものが完全にはまりこむ様⼦。またそれによって完全に覆われる様⼦。 ⼤きめの部品に⼩さめの部品がはまり込み、⼤きめの部品で覆われる様⼦。 ■すとん ものが急に落ちる様⼦。 画⾯の上⽅から、下⽅に向かって、勢いづいて部品が移動する様。 50
51.
51 ※ツールによって、easing の名前が異なる場合あり
52.
52 「動き」の ひらめき ⼈に伝えられるくらい ⼗分に「動き」がこなれている段階 「動き」の批評をするのが適切な段階 (早すぎても、遅すぎても良く無い) その時点の「動き」を提⽰して 実装に進めるくらいの段階 「動き」を実装された プロダクト 「動き」の試作/検討 調整 ディレクション ディレクション
53.
53 ⽐較検討する 単体では判断できないことも⽐べると解る 短い時間で素早く動くもの、ゆったり動くものなど。 作った本⼈は思⼊れが強く⻑くしがち。客観的に!
54.
54
55.
55 +動画 実際に作ってみると、 誤差やもたつきは必ず 有る →何度も調整
56.
56 複数機種向けに 開発する場合 対応する⼀番古い、 ⼀番遅い機種を最初 に調整し、⾼性能に なるに従いリッチで 滑らかな体験に!
57.
アニメーションとは? 57 John Lasseter (Pixar) アートは技術に挑戦し 技術はアートに インスピレーション与える
58.
オススメのツール紹介 58 Keynote Kite ComposerProcessing
59.
ツールの将来? 59 React+Sketch.app via. AirBnB
60.
60
61.
61
62.
62
63.
Google I/O 2017 63May 17 May 18 May 19
64.
Thank You @yukio_andoh 64
65.
Break Time 0 Minutes 65
Download now