Product Showcase

【これは便利!】Webのレビューに使えるオンライン付箋(アノテーション)ツール9+α個まとめ

Webのレビューをオンラインで効率化できるアノテーションサービスについて紹介する。これはスゴい!
[Sponsored]
Products Showcase

Webのレビューに便利なオンライン付箋

このコーナーでは、ネットビジネスを強力に支援する製品について、それを支える技術や市場動向を説明し、さらに各社から提供されている製品を紹介する。競合がひしめく市場で、他社に差を付けるための武器として、ぜひ導入を検討してみてほしい。 今回は、Webのレビューをオンラインで効率化できるアノテーションサービスについて紹介する。

Webレビューのよくある悩み

Webのレビューはサイト立ち上げ後に事業者側のスタッフが地道に行っていく運用業務であり、立ち上げに関わる制作・コンサル側はあまりケアしていないのが実情だ。印刷物や各種資料と同じようにWebのレビューを行ってしまいがちだが、実はWebのレビューには課題が多く、改善の余地が多いのだ。

  • メールやワークフロー画面で修正指示を出すが、テキストのみで表現すると伝わらない。
  • せっかくCMSでワークフローを実装したのに、紙に手で赤字を入れている。
  • 紙だとバイク便の時間やコストがかかる。FAXだと字がつぶれて読めないことも。
  • 画面キャプチャーをPowerPointに貼り付けてデジタル校正(?)している。クールだけど紙よりも面倒。
  • 大勢から戻ってくる修正依頼や指摘・質問に、矛盾や重複が多く、取りまとめるのが大変。

こんな場合は、オンラインでWebページ(やPDFやOfficeドキュメント)に付箋でコメントを入れたり、線で修正指示を入れたり、テキストの差し替え指示ができる「アノテーションツール」を活用してみよう。

アノテーション=付箋+コラボレーション

コンピュータを教育や研究活動に活用する方法については、Webが普及する前から、学術的な研究が行われてきた。マルチメディアやハイパーメディアはCD-ROMコンテンツとして一般化し、その後のWebの土台となった。また、コラボレーションを支援するための研究は、後のグループウェアや共有ホワイトボード、ソーシャルなサービスのUIなどにつながっていった。この流れを汲み、遠隔地にいる複数のユーザーが同じドキュメントを共有し、リアルタイムでレビューやディスカッション、編集を行うことができるサービスがいろいろ実用化されてきた。

米国でドットコムバブルが起こった90年代後半、いくつかのアノテーションサービスが開始され、ネットの新しい活用方法として話題になった。ところが当時はまだ時期尚早だったため、iMarkupはB2B事業にシフト、e-QuillはMicrosoftによって買収され、Third Voiceは事業を停止した。

そしてソーシャルブックマーキングやSNS、ブログ、Wikiなどが普及してきた今、数多くのベンチャー企業がアノテーションサービスを提供するようになってきた。日本ではいまひとつ普及していないが、実はアノテーションのサービスはすでに数多く存在する。印刷物のレビューでさえ、最近はオンライン化が進んでいるのだ。

今回は厳選した9つのアノテーションサービスと、Webのレビューにも使える3つのアプリケーションやCMSを紹介する。それぞれのサービスを実際に使ってサンプルページに赤字を入れた画面写真も掲載してある。どれも直感的に使えるので、実際にアノテーションやコメントを追加するなど、ぜひ体験してみてほしい。

ShiftSpace
SharedCopy

これらを比べてみると、商用サービス/製品の完成度の高さが際立つが、重要なのはネットを活用してコラボレーションすることで効率を高められる、という意識を組織の中で育てていくことだろう。まずは手軽なものを実験的に導入し、現場がメリットを感じるようになったらグレードアップしていくのもオススメだ。Webの運用を標準化し効率よく回していくための1つの手段として、ぜひアノテーションツールの活用を検討してみてほしい。

この記事で紹介しているサービス一覧

各リンクをクリックすると、この記事内でそのサービスを解説している部分にジャンプします。

オンラインサービス【Web専用タイプ】

いつものブラウザを使って、閲覧中のページの一部をマーカーでハイライトしたり、付箋を貼り付けたり、線でドローしたりできるため使い勝手が良く、手軽に導入できる。

オンラインサービス【アップロードタイプ】

ファイルをアップロードするタイプの場合は、Webページに加えてWordやExcel、PDF、画像なども共有・レビューが可能だ。

参考:アノテーションが可能な関連ソフトウェアやCMS

情報セキュリティなどのポリシーのために、社外のオンラインサービスを利用できない場合でも、社内ネットワークの中でアノテーションを実現する方法はいくつかある。

オンラインサービス【Web専用タイプ】

Diigo(ディーゴ)
http://diigo.com/

内容ツールバーをインストールしたWebブラウザ上で、閲覧中ページのテキストを選択してハイライトしたり、付箋を追加できる。アノテーションを開始すると自動発行されるURLを相手に伝えれば、他のユーザーとアノテーションを共有することも可能だ。通常はアノテーションのみがDiigoサーバー経由で共有されるが、WebページとアノテーションをまるごとDiigoサーバーに送信できるので、ツールバーをインストールしていないユーザーもアノテーションを閲覧できるようになる。

アノテーションの種類ハイライト、付箋、コメント

対応フォーマットHTML

共有方法ランダムURL

インストール必要(閲覧のみのゲストは不要)

ユーザー登録必要(閲覧のみのゲストは不要)

Diigo
Diigo
アノテーションを加えた状態

DrawHere(ドロー・ヒア)
http://drawhere.com/

内容アノテートしたいページをブラウザで表示させてブックマークレットを実行すると自由にドローができる状態になる。インストール不要のシンプルなツールだ。名前のとおりドローのみが可能で、ペンの色と太さ、透明度を変更できる。テキストを打ち込むことができないため、文字の差し替え指示や意見・提案を伝えるには不向きだ。文字情報はメールやワークフローで伝えるので、DrawHere上ではレイアウトやデザインの指示のみを伝えられれば良い、という場合に適している。

アノテーションの種類ペン

対応フォーマットHTML

共有方法ランダムURL

インストール不要

ユーザー登録必要

DrawHere
DrawHere
アノテーションを加えた状態

SharedCopy(シェアド・コピー)
http://sharedcopy.com/

内容付箋やハイライトに加えて、線や丸、四角形をWebページ上にドローできるので、レビュー結果を伝えやすい。DrawHereと同じように、URLを指定すると該当ページをロードして表示するタイプのWebアプリケーションだ。インストールは不要で、ブラウザ上ですべての機能が利用できる。アノテーション情報のみがサーバーを経由して共有されるため、ファイルサーバー上のHTMLファイルやテスト環境のページもアノテートできる。

アノテーションの種類付箋、ハイライト、直線・丸・四角形、テキスト

対応フォーマットHTML

共有方法ランダムURL

インストール不要

ユーザー登録必要(閲覧のみのゲストは不要)

SharedCopy
SharedCopy
アノテーションを加えた状態

ShiftSpace(シフト・スペース)
http://shiftspace.org/

内容閲覧中にShiftキーを押すとメニューが表示され、さらにスペースキーを押すとアノテーションが可能になる。オープンソースのブラウザであるFirefoxのアドオン「Greasemonkey(グリースモンキー)」から利用するスクリプトなので、対応はFirefoxのみ。アノテーションとしては、付箋とハイライトが基本だ。画像の差し替えやHTMLソースの変更機能もあるが、UIが独特で敷居が高い。同じURLのページを閲覧するユーザーは、そのページに対するアノテーションをすべて閲覧できる。社内からのアクセスしかできない環境でアノテーションを行えば、社内限定の共有も可能だ。他のサービスでもいえることだが、うっかり本番環境で個人情報・機密情報を書かないように注意したい。

アノテーションの種類付箋、ハイライト、画像差し替え、HTMLソース編集

対応フォーマットHTML

共有方法全公開

インストール必要(Firefoxのみに対応、Greasemonkeyというアドオンも別途必要)

ユーザー登録必要

ShiftSpace
ShiftSpace
アノテーションを加えた状態

Stickis(スティッキーズ)
http://stickis.com/

内容アノテーションは付箋のみに対応している。付箋とはいえ、その中でスタイル指定や画像追加もできるなど、表現力は高い。付箋はチャンネルとして束ねられ、他のユーザーはチャンネルごとに購読できる。ブラウザで閲覧中のページに購読中のチャンネルに属する付箋があれば、それが表示されるのだ。同じページのアノテーションを初校と再校などの時間軸、または部署ごと、などに分類するという使い方が考えられる。アノテーションに対しては、タグを付けることができる。

アノテーションの種類付箋

対応フォーマットHTML

共有方法RSS、タグ

インストール必要

ユーザー登録必要

Stickis
Stickis
アノテーションを加えた状態

Twiddla(ツィドラ)
http://www.twiddla.com/

内容付箋やハイライトに加えて、線や丸、四角形をWebページ上にドローできるので、レビュー結果をグラフィカルに伝えやすい。対象ページのURLをTwiddlaのサイト上のフォームに入力すると、そのコンテンツが背景として表示されてアノテート可能な状態になる。プラグインやアドオンのインストールは不要だ。ユーザー登録でさえ不要で、自動生成されるURLを相手に伝えればリアルタイムでコラボレーションできる。特定の指定ユーザーのみと共有する設定はできないが、今回紹介したサービスの中ではもっとも手軽に利用できる。参加ユーザーによって追加されるアノテーションの状態をスナップショットとしてバージョン管理できるのが意外と便利だ。

アノテーションの種類ペン、図形、付箋、スタンプ

対応フォーマットHTML

共有方法ランダムURL

インストール不要

ユーザー登録不要

Twiddla
Twiddla
アノテーションを加えた状態

オンラインサービス【アップロードタイプ】

A.nnotate(ア・ノテート)
http://a.nnotate.com/

内容共有したいコンテンツのURLを指定するだけでなく、PDFやWordなどのファイルをアップロードすることができ、幅広いレビューに活用できる。ただし、アノテーション方法としては付箋を貼り付けるだけなので、画像の位置やレイアウトなどのグラフィカルな修正指示には向かない。無料アカウントは月間アップロード数に制限がある。また、自社サーバーに自分でインストールすることもできるため(10ユーザーで2,000ドルから)、セキュリティのポリシーのために外部ネットワーク上のサービスを利用できない企業でも導入できる。APIが公開されているため、他のシステムとの連携も可能だ。

アノテーションの種類付箋

対応フォーマットHTML、PDF、Word、PowerPoint、Excel、OpenOffice、画像

共有方法ランダムURL

インストール不要

ユーザー登録必要(閲覧のみのゲストは不要)

A.nnotate
A.nnotate
アノテーションを加えた状態

ShowDocument(ショウ・ドキュメント)
http://www.showdocument.com/

内容アップロードしたドキュメントをFlashのビューワーで閲覧しながらアノテートできる。他ユーザーのマウスの動きが見えたり、レビュー参加者とチャットができたりするなど、リアルタイムのコラボレーションを想定して作られている。アップロード後に自動発行されるURLを入力すると、誰でもセッションに参加できる。ただし、主催者がログアウトするとセッションが終了するため、同時参加する必要がある。画像共有機能つきメッセンジャーのような位置づけだ。

アノテーションの種類ハイライト、ペン、テキスト

対応フォーマットPDF、Word、Excel、PowerPoint、TEXT、画像など多数

共有方法ランダムURL

インストール不要

ユーザー登録不要

ShowDocument
ShowDocument
アノテーションを加えた状態

Vyew(ビュー)
http://vyew.com/site/

内容URL指定に加えて、HTMLやPDF、Wordなどのファイルをアップロードできる。アノテーションとしてはハイライトとペン、付箋が使えるため、表現力は高い。リアルタイムのコラボレーションが強力で、同時参加者のマウスの動きの表示、チャット/音声チャットなどにも対応する。無料版は広告が表示され、アップロード数などに制限がある。他と比べてかゆいところに手が届く機能が多く、全体的に完成度が高い。

アノテーションの種類ハイライト、ペン、付箋

対応フォーマットWord、Excel、PowerPoint、Flash、画像

共有方法全公開または指定ユーザーのみ

インストール不要

ユーザー登録必要

Vyew
Vyew
アノテーションを加えた状態

参考:アノテーションが可能な関連ソフトウェアやCMS

アノテーションが可能な関連ソフトウェアで代表的なのはAdobe Acrobatだ。またアノテーションが組み込まれたCMSもある。レビューや承認のワークフローを流すと、レビュー者はブラウザ上で鉛筆ツールや付箋を使ってレビュー結果を入力できるのだ。それ以外のCMSでも、運用を工夫すれば上記のようなサービスを併用できる。

Adobe Acrobat (アドビシステムズ)
http://www.adobe.com/jp/products/acrobat/

WebページをPDF化すれば、Acrobatの共有レビュー機能を使ってマルチユーザーで同時に注釈を入れることができるようになる。PDF上でテキストを選択してDeleteキーを押すと削除を指示したことになり、取り消し線が表示される。テキストの途中をクリックしてタイプすれば、テキスト追加を表す記号と吹き出しが表示される。それぞれの修正依頼に対して、確認済み・未確認、承認・却下などのステータスを設定することもできるなど、印刷物で培われた校正のノウハウが詰まっている。

Adobe Acrobat

EMC Documentum Web Publisher(EMCジャパン)
http://japan.emc.com/products/detail/software/web-publisher.htm

iiMarkupサーバーのSDKを組み込めば、ワークフローからアノテーション機能を呼び出すことが可能になる(別途ライセンスが必要)。ペン、付箋、ハイライト、テキスト差し替えが可能だ。

EMC Documentum Web Publisher

TeamSite(インターウォーブン・ジャパン)
http://www.interwoven.co.jp

Visual Annotateと呼ばれるアノテーション機能がワークフローに組み込まれている。付箋、ハイライト、ペンが利用可能だ。

TeamSite
用語集
CMS / HTML / RSS / SNS / Webブラウザ / Wiki / アップロード / アノテーション / セッション / リンク / レビュー / ワークフロー / 付箋 / 共有
[Sponsored]
この記事が役に立ったらシェア!
メルマガの登録はこちら Web担当者に役立つ情報をサクッとゲット!

人気記事トップ10(過去7日間)

今日の用語

リーチ
Web広告の効果指標のひとつで、「広告の到達率」を意味する。ある特定の期間にその ...→用語集へ

インフォメーション

RSSフィード


Web担を応援して支えてくださっている企業さま [各サービス/製品の紹介はこちらから]