Framer Studio

Framer Studio は、ラピッドプロトタイピングのためのオープンソースフレームワーク「Framer.js」に基づいて構築されています。Framer を使用すると、アニメーションやインタラクションを定義できます。モバイルデバイス上でも実行可能です。

GitHub 上のソースコード｜ハードウェアアクセラレーション対応イベント＆3D アニメーション｜スプリング物理エンジン

Framer.js を採用している企業：Google、Facebook、Instagram、Stripe

生成：Sketch や Photoshop からアセットを自動生成し、新しいプロジェクトを素早くセットアップできます。

アニメーション：スプリング物理とベジェ曲線を活用して、3D スペース内の任意のレイヤーをアニメーション化できます。

パフォーマンス：CSS Transform を用いたハードウェアアクセラレーションにより、高フレームレートでの滑らかな描画を実現します。

柔軟性：デスクトップ、モバイル、タブレットのすべてに対応。WebKit とも良好に連携します。

統合ワークフロー：Photoshop および Sketch との連携機能を内蔵しており、静的なデザインからレイヤーを直接インポートし、インタラクティブなプロトタイプへと変換できます。

インタラクションの創造：コードによる柔軟な制御を可能にするエディタで、効率的かつ快適なコーディング体験を提供します。

CoffeeScript：Framer Studio は、JavaScript よりも簡潔で読みやすい CoffeeScript を採用しています。

スニペット：内蔵のスニペットライブラリにより、ワンクリックでレイヤーやインタラクションを追加できます。

自動補完：Framer 専用に最適化されており、すべての関数、プロパティ、変数、およびユーザーが設定したレイヤー名をサポートします。

インラインエラー表示：問題箇所を即座に特定できます。内蔵 JavaScript コンソールで詳細なデバッグが可能です。

無限の創造性：即時インタラクティブなビジュアルフィードバック、複数デバイス対応、フルスクリーンプレゼンテーションモードを備えています。

プレゼンテーション：没入感のあるデモのために、フルスクリーンプレゼンテーションモードをご利用ください。

プレビュー：作成中にリアルタイムでピクセルパーフェクトなプレビューを確認できます。プロジェクトごとに表示モードをカスタマイズ可能です。

デバイスプレビュー：iPhone、iPad、Android、またはフルスクリーンでプロトタイプをプレビューできます。

共有：プロジェクトをすばやくエクスポートして、どこへでもアップロードできます。Framer プロジェクトを簡単に共有し、共同作業を促進します。