【分野別】Webディレクションの仕事効率が上がるツールを紹介
ニジボックスの案件事例をご紹介!
Webディレクションのツールは、仕事で生じるさまざまな作業を管理したり実施したりできます。
最近では数多くのツールが開発され、多くの作業工程を短縮できるようになってきました。
そこで、本記事ではWebディレクションで活用できるツールに関して、分野ごとに分けて詳しく紹介していきます。
目次
PCに搭載されているツール
まず、PCに搭載されている、Webディレクションで使えるツールについて解説していきます。
1. 単語登録
「単語登録」とは、PCに標準搭載されている機能で、よく使う言葉やフレーズを登録し、打ち込みを簡略化できるものです。
ディレクターのように多くの人とコミュニケーションをとり、頻繁にメールや指示書を作成する人にとっては、タイピングの時間短縮や誤字脱字の防止に役立ちます。
Windowsの場合、タスクバーの右下にある「あ」や「A」のアイコンの上で右クリックし、「単語の登録」を選択し、単語を入力して登録します。上手に使いこなすとかなりの時間短縮につながるので、ぜひ試してみてください。
2. プレビュー.app
プレビュー.appはMacに標準搭載されているアプリです。
画像やPDFを閲覧するだけでなく、画像の加工や編集、PDFの結合やメモの追加なども行えます。
標準搭載の機能で、インストールの手間などなくすぐに利用できるため、Macユーザーの方はぜひ利用してみてください。
オンラインストレージツール
次に代表的なオンラインストレージツールについて解説していきます。
オンラインストレージとは、インターネット上に文書ファイルや画像などを保存して、他者と共有できるサービスです。
クラウドストレージとも呼ばれます。
代表的なツールには、以下のようなものが挙げられます。
1. Dropbox
Dropboxは、初心者でも利用しやすいオンラインストレージです。
関係者が自由なタイミングで資料を閲覧できる環境を提供し、共有フォルダーやファイルを簡単に作成できて、外部のパートナーやクライアントにファイルを共有できます。
普段使い慣れているエクスプローラーと同じようなUIとなっているため、操作も覚えやすいです。
また、リンクに一時的なパスワードを設定できるので、セキュリティー面でも安心です。
Dropboxを使うことで、プロジェクトマネジメントの効率向上が期待できます。
無料トライアルもあるので、まずは試してみるのも良いでしょう。
2. Googleドライブ
Googleドライブは、Googleが提供するオンラインストレージです。
Gmailを利用している人などGoogleのアカウントを持っている人なら無料で使用できます。
GoogleドライブではGoogleスプレッドシートやGoogleスライドなどのオンラインの文書ツールが利用可能なため、定例会議で使用するスライドなど、複数人で扱うファイルを共有してオンライン上で共同編集できて便利です。
無料で利用できる容量もあるため、まず手軽に使用を開始したい方や、Googleスプレッドシートなどを利用したい方におすすめです。
また、法人向けのGoogle G-Suitもあるため、企業単位・プロジェクト単位で導入することもできます。
3. OneDrive
OneDriveは、Microsoftが提供するオンラインストレージです。
Microsoftのサービスのため、WordやExcelといったOfficeアプリとの連携に優れています。
Word、Excel、PowerPointをOneDriveに格納することで、オンライン上でファイルの共有や共同編集が可能です。
また、Microsoftのアカウントを持っている人なら5GBまで無料で使用でき、有料のプランを契約するとさらに大容量のストレージを利用できます。
セキュリティー面でも配慮がされており、データの暗号化や2段階認証などが利用できます。
コミュニケーションツール
次に、コミュニケーションツールについて解説していきます。
ツールには、以下のようなものが挙げられます。
1. Slack
Slackはスレッドやワークスペースごとにチャットを展開できるコミュニケーションツールです。
ブラウザー上でも、PCやスマートフォンのアプリでも利用できます。
チャンネルというワークスペースをプロジェクト単位や部署単位など用途ごとに作成して、用途に応じたメンバーがそのチャンネル内で会話をします。
雑談用のチャンネルを作って、同じ趣味の方が集まって会話を展開するといった使い方もできます。
スタンプ機能もあり、デフォルトのスタンプに加えてオリジナルのスタンプも作成可能なため、投稿にリアクションしやすくなっています。
プロジェクト全体のタスクや進捗管理にはBacklogなどの管理ツールを利用して、ライトな会話を繰り広げるためにはSlackを利用するなど、用途に応じて他のツールと合わせて使うことも多いです。
また、Slackの「ハドルミーティング」を利用すれば、チャンネル内のメンバーと音声・ビデオ通話をすることも可能です。
2. Gmail
GmailはGoogleが提供する無料のWebメールサービスです。
カレンダーやドライブなどのGoogleが提供するさまざまなサービスとの連携もスムーズで、ビジネスでもプライベートでも幅広く利用されています。
さらに、Gmailは多様なプラットホームに対応しておりWebブラウザーからのアクセスはもちろん、スマートフォンやタブレットからのアクセスも簡単です。
無料で利用できるため個人でも企業でも手軽に導入が容易で、その普及率は非常に高いです。
3. ChatWork
ChatWorkは、ビジネスチャットに特化したコミュニケーションツールです。
グループチャットや個人チャット、ファイル共有など他のコミュニケーションツールと同等の機能に加えてタスク管理機能も備えています。
タスク管理機能はチャット上のメッセージをそのままタスクとして設定できるので、他のツールと合わせて使うことなく、ビジネスでのコミュニケーションをよりスムーズに効率的に行えます。
また、ChatWorkを利用している人であれば、外部の取引先や顧客とも手軽にチャットできます。
さらに、スマートフォンやタブレットなど複数のデバイスからも利用できるため、オフィス外でもコミュニケーションをとることが可能です。
ビジネスに必要なコミュニケーション機能を網羅したChatWorkは、多くの企業やビジネスパーソンに利用されています。
スケジュール・プロジェクト管理ツール
次にスケジュール・プロジェクト管理ツールについて解説していきます。
スケジュール・プロジェクト管理ツールには、以下のようなものが挙げられます。
1. Backlog
Backlogは、チームがタスクの進捗状況を追跡するのに便利な、プロジェクト・タスク管理ツールです。課題のステータス管理だけでなく、ナレッジをまとめられるwiki機能なども利用できます。
課題管理には親子課題機能もあり、メインのタスクにサブタスクを紐づけて、細かくタスクの進捗状況を管理することが可能です。
また、Backlogにはカンバンスタイルのボードやガントチャートも備わっており、プロジェクトの進捗状況やタイムラインを視覚的に確認できます。
さらに、GitやJenkins、Slackなどの他のツールと連携することも可能で、異なるプラットホーム上でシームレスに作業ができます。
2. Trello
Trelloはビジュアル志向なプロジェクト管理ツールです。
視覚的に分かりやすいカード型のタスクとガントチャートで、個人やチームが自分たちの仕事を整理して優先順位をつけるのを手助けします。
直感的なUIが特徴で、タスク管理ツールを使用したことがない人でも使いやすいツールです。
各ボードはプロジェクトの特定のニーズを反映するようにカスタマイズでき、必要に応じてカードを移動し、ラベルを付け、チームメンバーに割り当てられます。
ユーザーはより詳細な整理のために、チェックリスト、期日、添付ファイルをカードに追加することもできます。
また、GoogleドライブやSlack、Dropboxなどの幅広いツールと統合できるため、複数ツールの情報を一元的に管理可能です。
3. Jira
Jiraは、ソフトウエア開発を中心としたプロジェクト管理ツールです。
アジャイル開発に適した機能を備えており、タスク管理や進捗管理、バグトラッキング、チームコラボレーションなど、開発に必要なさまざまな機能を提供しています。
また、豊富なカスタマイズ機能で、チームのニーズに合わせて柔軟な設定をすることが可能です。
大規模な開発プロジェクトにも対応しており、複数のチームで協力しながら開発を進める際に使いやすいツールです。
Jiraはエンジニアや開発者に人気の高いツールの1つで、多くの企業や組織で利用されています。
4. Redmine
Redmineは、無料で使えるオープンソースのプロジェクト管理ツールです。掲示板のようなニュース機能を搭載しており、この機能でメンバー全員へのお知らせを伝えることが可能です。
また、ツールのダウンロードやカスタマイズには一定のプログラミングの知識が必要ですが、プロジェクトに応じて高度なカスタマイズが可能なため、導入時の対応が可能な方には使いやすいツールでしょう。
さらに、RedmineはGitやJenkins、Slackなどのプラグインやサードパーティーのツールと統合できます。
5. Mammoth Project
Mammoth Projectは、5つのビューでタスクを管理できるプロジェクト管理ツールです。
リスト・カンバン・プロジェクトマップ ・ガントチャート・カレンダーの5つの見方でタスクを管理できるため、全体像を把握しやすく、タスクの抜け漏れを防げます。
Mammoth Projectは、クラウド版、オンプレミス版に加えて、プライベートクラウド版を選択することが可能です。
プライベートクラウド版はクラウド上に企業専用のネットワークを構築するプランで、他の2タイプよりもさらにセキュアな状況で利用できます。
テキストエディターツール
次に、テキストエディターツールについて解説していきます。テキストエディターツールには、以下のようなものが挙げられます。
1. Dropbox Paper
Dropbox Paperは、ファイル共有サービスのDropboxと連携している、クラウドベースのツールです。
Dropboxのユーザーであれば無料で利用でき、ドキュメントにDropboxに保存してある他のファイルを挿入することも可能です。
また、共同編集可能で、コメントやメンション、タスク管理機能(ToDoリストやタイムライン)などがあるため、チーム全体でドキュメント内でタスクの情報や進捗を共有・管理できます。
さらに、モバイルアプリケーションも利用可能で、いつどこでもドキュメントの編集と共有ができます。
2. HackMD
HackMDはオンラインのMarkdownエディターです。
Markdown記法でテキストを編集し、クラウド上に保存、共有、共同編集できます。
このツールはバージョン管理をサポートしており、以前のバージョンに戻ったり、異なるユーザーによって行われた変更を追跡したりできます。
ドキュメント共有も簡単で、HTMLやPDF、Markdownなどのさまざまな形式でエクスポートも可能です。
また、内部のユーザーと外部のユーザーに異なる権限を設定できるため、パブリックおよびプライベートの両方のドキュメントを作成できます。
3. Googleドキュメント
Googleドキュメントは、Googleが提供するクラウドで管理する文書ツールです。
Googleアカウントがあれば誰でも利用でき、ファイルはGoogleドライブ上に保存されます。
ファイルの共同編集が可能で、複数人で同時に文書の編集が可能です。
変更履歴も残るため、誰がいつ変更したのかを確認できます。
また、オンライン上で利用する場合は自動保存に対応していますが、オフラインでも編集できるため、インターネットに接続できない場所でも利用できます。
GoogleドキュメントはMicrosoft Wordと同じような機能を提供しており、文書作成、表作成などに使われます。
Microsoft Wordの形式にも対応しており、Googleドライブ上で読み込めば、オンライン上でMicrosoft Wordを編集可能です。
4. サクラエディタ
サクラエディタは、ローカル環境で利用する、Windows端末向けのテキストエディターツールです。フリーソフトで、無料で利用できます。
テキストの編集からプログラミングまでに利用でき、複数のファイルから文字列を検索するgrep機能や、2つのファイルの中身を比較するdiff機能も搭載しています。
正規表現や行ごとのソートなども行えるため、テキスト整形にも便利なツールです。
オンライン会議ツール
次にオンライン会議ツールについて解説していきます。
代表的なツールには、以下のようなものが挙げられます。
1. Google Meet
Google MeetはGoogleが提供するオンライン会議ツールです。
ブラウザーから直接アクセス可能で、アプリケーションのダウンロードがいらないのが特徴です。Googleアカウントがあれば、無料のプランでも最大100人までの参加者を招待可能で、画面共有やドキュメント共有、チャット機能などが備わっています。
特に、Googleカレンダーとの連携が非常に便利で、Googleカレンダー上で設定された予定から簡単にGoogle Meetに参加できます。
Gmailなどの他のGoogleサービスとの連携もスムーズです。
また、セキュリティー面でも、ビデオ通話中のエンドツーエンド暗号化や会議ルームのロックなどの機能が備わっており、安心して利用できます。
2. Zoom
Zoomは、米国のZoomビデオコミュニケーションズが提供する、世界中で多くのシェアを誇るオンライン会議ツールです。
無料版と3種類の有料版があります。
基本的な機能としては、音声・映像通話や画面共有機能、仮想背景機能などが挙げられます。
また、ホワイトボード機能や、参加者を複数のグループに分割できるブレイクアウトルーム機能など、社内研修で役立つ機能も充実しています。
さらに、オンラインでのセミナーを実施できる「Zoom Webinar(ズーム ウェビナー)」のプランもあるため、オンラインセミナーの開催にも便利でしょう。
COVID-19の流行以降、リモートワークやオンライン授業などの需要が増え、世界中で利用者が急増しています。
3. Skype
SkypeはMicrosoft が提供しているオンライン通話ツールです。
SkypeのIDがあれば利用可能で、Skypeを利用している人同士であれば国内だけでなく国外の人とも無料でコミュニケーションできます。
Skypeは無料でも多くののサービスを利用できますが、有料サービスを利用することでSkypeのアカウントを持っていない人に対して、固定電話や携帯電話への通話、SMSの送信もできます。
ビジネスでも利用されることがあり、ビデオ会議やグループチャットなどの機能が用意されています。
4. Teams
Teamsは、Microsoftが提供するチャットやオンライン会議をベースにさまざまな機能が利用できるツールです。
オンライン会議だけでなく、チーム内でのチャットやカレンダー機能、ファイル管理などもできるようになっています。
チャット機能やファイル管理もTeams上で利用可能な特長から、オンライン会議の参加者でのチャットグループが会議開催と併せて作成されるため、会議終了後に会議中にチャットでやり取りした内容やファイルを確認したり、会議参加者とのチャットを行ったりしやすい構造となっています。
オンライン会議ツールとしてだけではなく、コミュニケーションツールとしても便利なツールです。
有償版から利用可能な機能は少し減りますが、無償版もあるため、まずは無償版から利用してみるのも良いでしょう。
ワイヤーフレーム・プロトタイプツール
次にワイヤーフレーム・プロトタイプツールについて解説していきます。
代表的なツールには、以下のようなものが挙げられます。
ワイヤーフレームのツールについては下記の記事でも紹介しているので、ぜひご覧ください。
1. Figma
Figmaは、オンライン上で利用できるデザインツールです。
オンラインで利用するため、ユーザーはリアルタイムで作成したデザインを共有でき、共同編集もできます。
特にUI UXデザイナーに人気で、ワイヤーフレームやプロトタイプ、スライド資料まで作成できることが特徴です。
また、バージョン管理機能も備えているため、誰が編集を加えたのか確認したり、更新履歴を遡って確認することもできます。
Figmaを使用すると、チームは同じデザインにリアルタイムで協力でき、チームメンバーや関係者とのコラボレーションが容易になります。
無料で利用できるスタータープランもあるため、まずは無料で試してみるのも良いでしょう。
Figmaの基本情報や機能に関しては下記記事で詳しく解説しているので、ぜひ併せてご覧ください。
2. InVision
InVisionは、Webサイトやアプリケーションのプロトタイピング、デザインの複数人での共同作業を支援するツールです。
InVisionにワイヤーフレームやデザインをアップすることで、それに対するコメントやログを管理・共有できるため、チームや開発者、関係者間のコミュニケーションを円滑に行えます。
特に、デザインのスキルに自信がない方でも簡単に使えるインターフェースが特徴で、ブラウザーベースで利用可能なため、どこからでもアクセスできます。
また、多くのデバイスに対応しており、プロトタイプを実際のデバイスでテストすることもできます。
3. Adobe XD
Adobe XDは、Adobe社が提供するデザインツールです。
PCやスマートフォンといったデバイスごとにテンプレートが用意されており、操作性はシンプルで使いやすいと評判です。
作成者が共有用のURLを発行して共有することで、Adobe XDをインストールしていない人でも、ワイヤーフレームやデザインを確認しながらコメントできます。
また、個人でローカル環境でも使用できますが、クラウド上でのデータ共有や編集も可能なため、他者とのコミュニケーションもスムーズです。
現在はAdobe XD単体での購入はできず、Adobe Creative Cloudの契約が必要となっています。
Adobe XDの基本情報や機能に関しては下記記事で詳しく解説しているので、ぜひ併せてご覧ください。
その他のおすすめツール
最後に、これまでに紹介した分野以外のその他のおすすめツールについて解説していきます。
具体的には、以下のようなものが挙げられます。
1. Miro
Miroは、オンラインのホワイトボードツールです。
Webブラウザーのほか、デスクトップアプリ、スマホ、タブレット用アプリで利用できます。
ホワイトボードに付箋を貼ったりテキストを入力しながら、複数人で同時作業ができるため、オンライン会議中の情報共有に便利です。
また、Miroにはマインドマップやカスタマージャーニーマップ、共感マップなどの300種類以上の豊富なテンプレートがあるため、1から資料を作成する手間を省けます。
2. Evernote
Evernoteはオンライン上のメモツールです。
Webブラウザーのほか、デスクトップアプリ、iOSアプリ、Androidアプリで利用できます。
ノート機能では、ユーザーはテキストだけでなく、音声、写真など、さまざまな形式の情報をノートに集約・整理できます。
Webクリッパー機能も搭載しており、Web上で気になったコンテンツを保存できるため、情報の蓄積に優れたツールです。
また、画像内のテキストや手書きのノート内のテキストなど、ノート内の情報を検索して見つけられます。
さらに、ToDoリストやリマインダー、共同作業ツールなどの機能も提供されており、ノートを他の方と共有しながら共同作業できます。
無料プランと複数の有料プランがあるため、容量や同期する端末台数など、仕事環境に合わせてプランを選択すると良いでしょう。
3. Feedly
Feedlyは、複数のWebサイトやブログなどの更新日や更新情報をまとめて確認できる、RSSリーダーの1つです。
お気に入りのブログやニュースサイト、ポッドキャスト、YouTubeチャンネルを購読し、そのコンテンツの更新情報1つの場所で管理できます。
ユーザーはフィードやタグでコンテンツを整理し、容易にページへアクセス可能です。
記事のシェア機能やソーシャルメディアとの統合、後で読むための保存機能などの機能も提供されています。
Feedlyは、シンプルで使いやすいインターフェースを持ち、複数のWebサイトを訪問せずに、効率的にコンテンツを参照できます。
複数のメディアで、最新のニュースやトレンドを追いかけたい方にとっておすすめです。
4. Clipy
Clipyは、macOS用の無料かつオープンソースのクリップボード拡張機能です。
通常クリップボードは1つの情報しかコピーできないのですが、Clipyを使うことでコピー履歴を複数保持できるようになります。
そのため、テキスト、画像、ファイルなど、以前にコピーしたアイテムの履歴にアクセスして、キーボードショートカットで素早く貼り付けられます。
ちなみにClipyは、スニペットもサポートしています。
ユーザーは、履歴に保存されるアイテムの数やアクセスに使用するキーボードショートカットなど、Clipyの動作をカスタマイズできます。
また、Clipyは他のクリップボードマネージャーや自動化ツールと併用することも可能です。
5. Biscuit
Biscuitは、複数のアプリケーションをまとめて管理できるブラウザーです。
これまで多数のアプリケーションを紹介してきましたが、さまざまなアプリケーションを利用していたり、プロジェクトごとに利用ツールが異なったりすると、目的のアプリケーションを探すのに時間がかかってしまうことがあります。
そんな時にBiscuitを利用すれば、複数のアプリケーションをひとつの画面で一元管理できるため、管理しやすくなります。
WindowsとMacどちらでも利用可能で、利用料金は無料なため、まずは試してみると良いでしょう。
まとめ
本記事では、各分野ごとに多くのWebディレクションに役立つツールを解説してきました。
ツールは仕事のさまざまな場面で活用することが可能で、できるだけ多くのツールを知っておくと時間短縮や作業の削減が可能です。
コロナ禍以降、オンラインで共同作業することが必須といっても過言ではなくなってきた中、オンラインの共同作業をより円滑にさせるツールを活用できるようにすることは非常に重要です。
本記事で紹介したツールを最大限活用してみてください。
WebディレクションやWeb制作について、社内で対応することが難しい場合には、外部の制作会社に依頼をすることもおすすめです!
下記にて、ニジボックスがクライアント課題に伴走する中で、磨き上げてきたUI UXデザインのプロセスや支援事例の一端を資料として一部ご紹介しています。
ご興味を持たれた方はぜひ、下記ダウンロードリンクよりご参照ください。
元ニジボックス 執行役員、TRTL Studio株式会社 CEO、その他顧問やエンジェル投資家として活動
コンサルティング会社でのUI開発経験を持つ技術者としてキャリアをスタート。リクルートホールディングス入社後、インキュベーション部門のUX組織と、グループ企業ニジボックスのデザイン部門を牽引。ニジボックスではPDMを経てデザインファーム事業を創設、事業部長に就任。その後執行役員として新しいUXソリューション開発を推進。2023年に退任。現在TRTL Venturesでインド投資・アジアのユニコーン企業の日本進出支援、その他新規事業・DX・UX・経営などの顧問や投資家として活動中。
X:@junmaruuuuu
note:junmaru228