UI / UX

Lottieを使ってみたい

投稿日:2017年8月14日 更新日:

はじめに

AirbnbDesignからAfter Effectsで作成したアニメーションをレンダリングして、iOS・Android・React Native向けのアニメーションに変換してくれる、Lottieが公開されました!

今回は簡単にそちらの紹介をしたいと思います。

概要

In the past, building complex animations for Android, iOS, and React Native apps was a difficult and lengthy process. You either had to add bulky image files for each screen size or write a thousand lines of brittle, hard-to-maintain code. Because of this, most apps weren’t using animation — despite it being a powerful tool for communicating ideas and creating compelling user experiences. One year ago, we set out to change that.

Lottie紹介ページより引用

今まではそれぞれのプラットフォーム、または画面によってイメージを用意しなければなりませんでした。
これは複雑なメンテナンスを必要とし、その結果多くのアプリではアニメーションを使わなくなりました。

Lottieは簡単にアニメーションを実装する強力なツールとして開発されました。

実例

現在、私が使用しているアプリで、お気に入りや、ローディング、いいねボタンなどいたるところにアニメーションが使用されています。

ユーザーにとって、ストレスにもなりうるウォークスルーなどに見てて気持ちの良いアニメーションを作成すると非常に効果的かもしれません。

さいごに

このライブラリがでて非常に良かったのですが、それ以上に事業会社からこういった技術(デザイン)をシェアするという事に毎回興奮します。

日本からもこういうプロダクト(技術)などもっといっぱいでると良いなと思う次第でございます。

また、現在私たちが開発しているアプリケーションでも、このような技術を積極的に採用していきたいと思います!

blog-page_footer_336




blog-page_footer_336




-UI / UX

執筆者:

免責事項

このブログは、記事上部に記載のある投稿日時点の一般的な情報を提供するものであり、投資等の勧誘・法的・税務上の助言を提供するものではありません。仮想通貨の投資・損益計算は複雑であり、個々の取引状況や法律の変更によって異なる可能性があります。ブログに記載された情報は参考程度のものであり、特定の状況に基づいた行動の決定には専門家の助言を求めることをお勧めします。当ブログの情報に基づいた行動に関連して生じた損失やリスクについて、筆者は責任を負いかねます。最新の法律や税務情報を確認し、必要に応じて専門家に相談することをお勧めします。


comment

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA


関連記事

ざっとPWAの概要を調べてみる

1 はじめに2 ProgressiveWebAppsとは3 PWAに必要な技術4 PWAとセットでよく出てくる「AMP」とは5 ネイティブアプリ vs PWA6 さいごに はじめに ここ最近、Andr ...

ブランドを作る – Part1

1 はじめに2 ブランディングって?3 ブランドイメージ=らしさ4 ブランディングの定義の変化5 さいごに はじめに 過去にサービスの新規立ち上げを業務で行う機会があり、どんなデザインで進めるか?を決 ...

名前しか知らなかったクリエイティブ・コモンズライセンスを調べてみる

1 はじめに2 クリエイティブ・コモンズとは3 種類3.1 表示(CC BY)3.2 表示—継承(CC BY-SA)3.3 表示—改変禁止(CC BY-ND)3.4 表示—非営利(CC BY-NC)3 ...

サービスを作る時、最低限必要になりそうな利用規約の考え方

1 はじめに2 3大よくあるドキュメント2.1 利用規約2.2 プライバシーポリシー2.3 特定商取引法に基づく表記3 実装と絡めて考える4 ダメ利用規約の典型4.1 実効性4.2 違法性4.3 同意 ...

icon

RE:ENGINES LOGO

RE:ENGINES ロゴデザイン 1 はじめに2 チームについて2.1 チームガイドライン2.2 キーワード3 RE: というキーワード4 自走できる成長エンジン5 さいごに はじめに こんにちは〜 ...

フォロー

blog-page_side_responsive

2017年8月
 12345
6789101112
13141516171819
20212223242526
2728293031  

アプリ情報

私たちは無料アプリもリリースしています、ぜひご覧ください。 下記のアイコンから無料でダウンロードできます。