fc2ブログ

Home > ユーティリティ > オンラインでカンプのミーティングができる「Invision」が便利。

オンラインでカンプのミーティングができる「Invision」が便利。

1_20141115233839764.png

Invisionというオンラインカンプ共有アプリが便利です。
お客さまのディレクターさんが使っていて、最近やっと理解して、伝染しました。(笑)
ちょっとどういう風に便利なのか、というのが私自身理解するのに時間がかかったので、どこが便利なのかまとめてみます。

ワイヤーフレーム作成アプリではなく、コミュニケーションツール。

Invisionで検索すると、ワイヤーフレーム作成のカテゴリで紹介されていることが多いですが、ワイヤーフレーム作成アプリではないです。

画像ファイルをアップロードすると中央揃えで背景色を指定して、と
実際のサイトで表示した場合に近い見せ方ができるので、
ワイヤーフレームのカテゴリに入ってるのだとおもいます。

ワイヤーフレームも見せられますし、カンプでも可能です。
スマホアプリもいけそうです。
さらに、打ち合わせができます。

ワイヤーフレームや、デザインカンプを他のアプリで作って、
ここをこうしたい!」
ここを文言変更」
っていうような、「ここ」をわかりやすく、スレッド化するようなアプリです。

メール内のやりとりで発生する、
たとえば

「真ん中のバナーを◯◯に変えてください」
「真ん中って3つありますけどどれですか」
「Aの写真のやつです」
「Aの写真2種類ありますが」
「えー・・もういいです。。」

みたいなやりとりを「この部分」と指示しておけるために
コミュニケーションが省略され、的確に行える可能性のあるものです。

(ワイヤーフレーム作成アプリで、オンラインならmoqupsなどがおすすめです。)

使い方サンプルケース

使用のながれのサンプルです。
だいたいこういう流れを想定しているのかな、と思いました。


Invisionアカウントを持っている人がワイヤーフレームやカンプをアップロード

コメントなどを記入してURLをシェア

シェアされたひとがコメントを返す

互いにやりとりをおこないながらファイルを更新していく

コメントを消しこんで完成


わたしは、コメント場所を指定できるのを生かして、
デザイン意図などをシェアする際にも使ってみています。


変更箇所・相談箇所ごとにスレッドを立てる→作業完了消し込みを共有


画像のように、変更箇所や相談箇所に対してスレッドを立てられるため、
見落としがありません。
共有アドレスの設定でコメントを許可しておけば、
連絡を取り合い、最終形まで進んだら消しこむ、という作業まで完結できます。

スレッド途中のコメントでは、
メール通知をONにしておけば、変更希望箇所の一部スクリーンショットと
コメントがメールで届き、メールを確認しただけでどんな指示かわかります。

カンプやワイヤーフレームのバージョンを保存。コメントレイヤーは維持。

「管理者側」のカンプ表示で、カンプ画像部分にファイルをドラッグ&ドロップすると、新しいバージョンのカンプを上書きできます。(ドラッグした時点でグレーアウトした上記のような表示になります。)
過去のバージョンもログとして残りますので比較も簡単です。

その際、やりとりしていたコメントレイヤーは残るので、
再度確認してもらう際にズレが少なくなります。

内容の変更でコメントとの位置が移動したなら、コメントのピンクの数字アイコンをドラッグして位置調整することができますので、コミュニケーションのズレが起きにくいです。

アップロードするカンプやWFはプロジェクトごとに管理できる

アップロードするファイルはプロジェクトごとに管理できます。
プロジェクト管理数は、契約状況によります。フリーアカウントだと1プロジェクトだとおもいます。
カンプベースのプロジェクト管理ツールっぽい一面もあるように感じます。

InvisionのURLをメールでもらったら。

Invisionの共有URLからアクセスしたときに
シンプルに作りすぎててとっつきにくい方も多いかとおもいます。

1)右下の「comments」と書いてある、グレーになっている部分をクリック。
2)ピンクの数字アイコンが現れるので、各数字をクリック
3)コメントエリアが現れるので、確認して(必要であれば)返事を書く
4)完了したものを確認したい場合は右上の「Show Completed」をクリック。

もうすこしわかりやすかったらいいんですけどねー。
ただ、一度わかれば、迷うことはないとおもいます。

URLを共有する方は、簡単な使い方を一緒に
送ってあげると、よいかもしれません。


すべて直感的な操作を狙っているようで、使っていくうちに発見がたくさんあるウェブアプリなので、また発見があったら書きますね。離れていても、デザインやレイアウトに対して互いに「ココ!」と言えるのは
考える以上に快適だったりします。

アカウント作成はフリーですので、使ってみて
便利だったら課金検討というのもいいとおもいます。

*すべて英語ですが、日本のウェブではよく使われる簡単なものしか出てきませんので、そのあたりは敷居低いと思います。敷居が高いとすれば、コメントを出すために2アクションあるところくらい。

*こういうアプリのコメント全般で有効なのは、「AをBしてください」→「BはCだからDしました」みたいに目的と結果を的確に書くこと。日本語でよくある曖昧な表現や感情は向かないかもっておもいます。

Invisionはこちらから試せますよ。
関連記事

Comments: 0

Comment Form
サイト管理者にのみ通知する

Trackback+Pingback: 0

TrackBack URL for this entry
http://vanidesign.blog.fc2.com/tb.php/116-b055d36e
Listed below are links to weblogs that reference
オンラインでカンプのミーティングができる「Invision」が便利。 from バニデザノート

Home > ユーティリティ > オンラインでカンプのミーティングができる「Invision」が便利。

Sponsored Link
【WebDesign】Photoshopでプロになる!オシャレ&クールなWebデザイン作成講座
▲Udemy講座第二弾!Photoshopデザインカンプ作成の流れをレクチャーします。クーポンコード【PS_BANIDESIGN】
はじめよう!Wordpressで作るおしゃれサイト【デザイン入門】
▲WordPress初心者向けに、ばにが書きおろしたオンライン授業です。上記バナーから受講いただくと、お得な価格で受講可能!
ホームページ・ウェブサイトデザイン・制作ならバニレートデザイン事務所まで。10年以上に渡りオールラウンドウェブクリエイターとして活動した経験を活かして高品質なPhotoshopデータでの「デザインカンプ作成」のお仕事を主に行っています。業務提携いただける企業さま、ウェブディレクターさまを随時募集中です。Wordpress(ワードプレス)、レスポンシブ、スマホ用サイトもできます♪
Books - 寄稿させていただいた本たち
WordPressデザイン 仕事のネタ帳 見た目と効果を向上させるプロのテクニック
WordPressを利用して、趣味〜お仕事が可能なレベルの実践的な内容になっています。 ブログ風、Pinterest風、CMSとしてWordPressを利用する方法の3つをメインに、さらにこれらを拡張していきやすいような考え方や、きっかけを掴んでいただければという想いで書かせていただきました。担当Chapter:9chapter (メイン3、サブ6。110ページ前後ぐらい。)
【Amazon.co.jp限定】神速Photoshop [Webデザイン編] CC対応 特製PSショートカットステッカー for Mac 付
Photoshopの作業をすばやく行って、デザイン自身に集中できるように。基本動作であっても、考え方としてどのように持っていくか、ということをテーマに書かせていただきました。(担当:本編の全体89のテクニックのうち、23ぐらいのテクニックと、特典PDFの中にもいくつか。)
レスポンシブWebデザインテクニックブック プロが教えるマルチデバイス対応の手法
「レスポンシブWebデザインテクニックブック プロが教えるマルチデバイス対応の手法」にてCase Studyの1つを寄稿させていただきました!
Popular Posts
Recent Entry
Category
about:vanillate
vanillate

author: vanillate(バニレート)

フリーランスのウェブクリエイター。
wordpressやカラーミーショップのデザインなど、シンプルで可愛いサイトを作っています。






Link
Recommend
レンタルサーバー 【ヘテムル】 なら、 独自ドメイン【無制限】、データベース【50 個まで】を追加費用無料で設定できます。 しかも、サーバー容量は余裕の 42.195GB! 1 つの契約でたくさんのサイトを運営したい方にぴったりのサービスです。
★【カラーミーショップ】なら本当に安心!★
かわいいテンプレートが続々登場するから、初心者のあなたにも安心!
オンラインショップ・ショップブログ・モバイルショップなど、こんなに揃って月額875円~!
有名ショップ様にも多数ご利用をいただいているから、どんどん参考にしちゃおう!
Design Items