現役デザイナーによるトレーニング 第一期生募集中!
ゆき2019/08/26 11:25

UIにアニメーションを付けるソフトのおすすめを教えて下さい。

Sketchで基本的にUIを作っています。自分はprotopieとOrigamiStudioを触り始めています。

回答

  • 人間2019/08/26 12:56

    ProtoPie はかなり良い手段だと思います。単なるパラパラアニメーションではなく、UI コンポーネントごとに細かなアニメーションを作ったり変数を割り当てることもできるのも魅力です。あと、長くサービスが続いているのでいきなりサービス終了もなさそうなのもポイントが高いです。

    Origami Studio は iOS / Android アプリに限定しますが、ProtoPie より実物に近い(実装可能な)プロトタイプが作れるのが良いです。特にデバイスの機能(カメラやキーボードなど)にアクセスしたプロトタイプを作るには最適ですが、少しコードを書いたりロジックを設計しなければいけないので ProtoPie より敷居が高いです。

    トレードオフはデザイナーが素早くアイデアを形にすることを優先するか、開発者に実装可能な見た目とコードを共有することを優先するか... にかかってきます。どちらもパーフェクトに実現できるツールはないので何を優先するかによってオススメするものが変わります。

    Keyshape は WYSWYG でアニメーションを作れるだけでなく、Lottie で使えるコードとして書き出せるのでかなり良いセンいっています。
    https://www.keyshapeapp.com/

    しかし、アプリの開発で Lottie を使っていなかったら開発側は何もメリットを感じないと思います。実装を考慮する場合は、まず開発者にどうやってアニメーションやインタラクションを実装しているか聞いたほうが良いかもしれません。

回答する

新規登録してログインすると質問にコメントがつけられます