新たなUIデザインツールとして期待の「InVision Studio(early access版)」を導入してみる
Adobe XDやSketchといったUIデザインツールに新たなアプリケーションが登場するとのことで注目されている「InVision Studio」ですが、現在はearly access版ながらもかなり期待できそうな感じでしたので早速テストで導入してみたいと思います。
なお、InVision Studio自体はまだベータ版段階のため、具体的な機能レビューなどは本記事では控えておきたいと思いますのでご了承ください。
ダイアログが表示されて、名前とメールアドレスの入力を求められられますので、入力し、送信ボタンをクリックします。間も無くインストーラーのダウンロードが始まりますので、インストールしたらアプリケーションフォルダに追加します。
初回立ち上げの場合はInVisionへのログインが必要になります。すでにアカウントを持っている場合はログイン情報を入力しますが、無い場合には下部にあるアカウント作成のリンクから新規アカウントを作成していきます。
メールアドレスとユーザーネーム、パスワードを入力し「CONTINUE」ボタンをクリックして先に進めていきます。
簡単なアンケートが続けて表示されますので答えていきます。その後「START USING INVISION」ボタンをクリックします。
再び、InVision Studioに戻り、先ほど作成したアカウントでサインインします。
サインインに成功するとアプリのスタート画面が表示されます。メジャーなデバイスの解像度に合わせたキャンバスをあらかじめ選べるのは助かりますね。また、Sketchファイルを選択してファイルを開けるようですね。
キャンバスを選択したらワークスペースが表示されます。ここから画面デザインを作成していく形になります。
まだそこまで触っていないのですが、概ねSketchに似た感触でした。まだ、early access版なのでこれからいろんな機能が実装されていくと思いますので期待して見守っていきたいですね。製品バージョンがリリースされたら使用感などのレビューも上げていきたいと思います。
InVision Studioとは
InVision Studioは、オンライン上でデザインのフィードバックができるWebサービスを提供しているInVisionからリリース予定のUIデザインツールです。 【InVision Studio(early access)】 https://www.invisionapp.com/studio 現在はまだベータ版のみ使える状況ですが、いずれ正式バージョンがリリースされるのではないでしょうか。競合となるAdobe XDやSketchなどのUIデザインツールですが、アプリのようなアニメーションのあるUIが表現できたり、InVisionとの親和性といった点が注目されているようです。またWindows版もリリースされるっぽい感じですね。またUIも未来感溢れるかっこいいデザインで、制作中もテンションが上がりそうですね! 現在使えるベータ版という位置付けのearly access版は無料で使えるので、ぜひこの機会にインストールして触ってみたいと思います。アプリ立ち上げにはInVisionのアカウントが必要
InVision Studio early access版のインストールですが、まずは公式サイトにアクセスします。画面中央に「GET EARLY ACCESS NOW」のボタンがあるのでクリックします。







まだそこまで触っていないのですが、概ねSketchに似た感触でした。まだ、early access版なのでこれからいろんな機能が実装されていくと思いますので期待して見守っていきたいですね。製品バージョンがリリースされたら使用感などのレビューも上げていきたいと思います。
sponserd
keyword search
recent posts
- Figmaで柔らかな印象のメッシュグラデーションを作成する
Figmaで柔らかな印象のメッシュグラデーションを作成する
- Photoshopで光沢と透明感のあるぷるっとしたテキストを作成する
Photoshopで光沢と透明感のあるぷるっとしたテキストを作成する
- Photoshopでサイバー感のあるレトロフューチャーなイメージを作成する
Photoshopでサイバー感のあるレトロフューチャーなイメージを作成する
- デザイン制作に数学的なアプローチを取り入れてみる #1(グラデーション、カラースケール)
デザイン制作に数学的なアプローチを取り入れてみる #1(グラデーション、カラースケール)
- 【実践テクニック#6】ウェブデザインやバナー制作でグラデーションマスクや光彩の効果を扱う時の注意点
【実践テクニック#6】ウェブデザインやバナー制作でグラデーションマスクや光彩の効果を扱う時の注意点
- 安さやチープな印象を強調させるデザインを考えてみる
安さやチープな印象を強調させるデザインを考えてみる
- メリハリを付けにくいトーナル配色でセパレートカラーを効果的に使う
メリハリを付けにくいトーナル配色でセパレートカラーを効果的に使う
- 【実践テクニック#5】2色の線形グラデーションで中間色をくすませず鮮やかに見せる
【実践テクニック#5】2色の線形グラデーションで中間色をくすませず鮮やかに見せる
categories