UIアニメーション– category –

UIデザインの制作をmennmiさんに作ってもらい、今回はUIアニメーションについての記事を書いていきます。UIアニメーションを作るときに考えていることややり方などを簡単に紹介します。 まずは動きのイメージを作り、その後にパーツ分割をしています。今回...

イージングとは何か？ イージング（Easing）とは、アニメーションの速度変化のカーブのことで、動きに緩急をつけることができます。同じ時間、同じ距離でもイージングをかけることで印象は全く変わります。また、イージングをかけていない状態をリニアとい...

はじめに アニメーションの気持ちよさは時間(タイミング)、変化量、緩急で表現 アプリゲームのUIアニメーションをさせる時に気持ちが良いと感じる要素が時間(タイミング)、変化量、緩急です。 時間(タイミング)が遅すぎたり早すぎると違和感があり、変化量...

「なぜ動かすのか？」から始める モーション設計の最初の一歩は「どう動かすか」ではなく「なぜ動かすか」を定義することです。UIアニメーションは派手さよりも、動きがユーザーに何を伝えるかが本質です。 目的の整理（UIアニメーションの5つの役割）以下...

こんにちは、UIアニメーションデザイナーのたかゆです。前回のUIデザインの制作をmennmiさんに作ってもらい、今回はUIアニメーションをつけたので、UIアニメーションについての記事を書いていきます。UIアニメーションを作るときに考えていることややり方...

前回は「フィードバック（反応）」「 ナビゲーション（案内）」「 状態変化の可視化」について解説をしました。今回はその続きとして、「演出・感情変化」と「演出・体験強化」について詳しく見ていきます。 4. 演出・感情変化 UIアニメーションのゲームな...

なぜUIに“動き”が必要なのか？ スマホアプリゲームにおけるUIの「動き」はただの賑やかしではなく、様々な意味を持って動きを取り入れています。 一見すると見た目を華やかにするための装飾のように感じるかもしれませんが、実際にはユーザーの体験を大き...

blenderを使いメッシュを作成し、Unityでメッシュに沿ったテクスチャアニメーションを作ります。 また、blenderのカーブを使い、Unityのparticleをカーブの上を走るようにエフェクトも作ってみます。 平面がカーブに対してくっつくようにする Shift + Aで...

獲得(出現)系演出で表示されるエフェクトには様々な種類があります。レアリティによる出し分けの仕方や、ゲームの世界観に合わせたエフェクトの見せ方、アイテム、キャラ、ガチャ石などの種類に対するエフェクトの分け方など、アイテム獲得(出現)時には色...

UIデザイナーの方がUIアニメーションや遷移アニメーション、レベルアップアニメーション(総合してUI演出と呼ぶ)などをつけることもあると思いますが、UI演出をやったことがない方が初めて演出をつけようと思った場合、何をすればいいか迷うかと思います。 ...

演出の出し方が多様化する中で、演出がどういう役割を持つのか複雑でよくわからなくなることもあるかと思いますが、今回は演出と感情ということにフォーカスしていこうと思います。 演出は現実にない感情表現を視覚化しているものでもあり、感情にどう紐づ...

これからアニメーション(UIアニメーション/演出)を学んでいきたいという方向けにゲームの演出に使われるアニメーションについて、動きをつける時に何を考えるのか、どう動かすのが良い動きになるのか、その考えを書いていきます。 良い動き、悪い動き アニ...