ブログ

  1. トップ
  2. ブログ
  3. NotionでWEB制作を楽にする!タスク管理から参考リンク集作りまで

Webサービス

NotionでWEB制作を楽にする!タスク管理から参考リンク集作りまで

最近Twitterなどで情報がよく出回るようになったツール「Notion」をご存知でしょうか。簡単に言うと情報整理のためのツールで、”情報をまとめて整理する”ために使います。

・タスク管理
・スケジュールカレンダー
・リンク集
・wiki
・メモ
・議事録 等々

デザインテンプレートの上に入力していくだけで自分なりのまとめページが仕上がる、というものです。

便利なのはそれを他者にも共有できること。
例えば制作スケジュールを書いたページを作ったら、そのままURLでシェアできます。相手がNotionにログインしているかどうか関係なく、WEBサイトのような形で見せることができます。

ツール内に書いたメモをそのままWEBサイトとして公開するようなイメージです。動作も軽く、デザインも入れられるので、自分好みにカスタマイズできるところも人気を集めている理由の一つかもしれません。


https://www.notion.so/ja-jp

■個人利用料金:無料
■チーム利用料金:一人あたり4ドル〜

個人で使う分には会員登録が必要ですが、利用は無料です。
チームでファイルをアップロードしたり、編集権限を共有したりするためには費用がかかります。まずは個人で使ってみて便利だと感じたら、プロジェクトに導入するという形を取るとスムーズに導入できると思います。

また、Googleカレンダーやドキュメント、スプレッドシート、Twitter、GitHubなど他のツールとの連携も行える仕様です。ディレクターや営業職の方々にとってはいろいろな画面を開かなくてよいだけでも便利になりますね。

Notionはかなり機能が多いので1記事で全てを紹介するのは難しいのですが、まず今回の記事ではNotionの始め方と、WEB制作のプランニングや進行に役立つ機能、そしてその使い方を中心にご紹介します。タスク管理から参考デザインのリンク集、予算管理などに使えるポイントをまとめますので、参考にしていただけたら幸いです。

1.Notionの始め方

Notionは会員登録が必要ですが、Googleアカウントでも始められます。


https://www.notion.so/ja-jp/product

【Notionを無料で使ってみる】からスタート。
個人で使うのか、チームで使うのかなど選択肢が出てきます。

【自分のために】を選択すれば完全無料。
すぐ管理画面が開きます。左サイドメニューがページの一覧。右サイドはそれぞれのページ内容を書き込む欄という配置です。


【ページを追加】からテンプレートを選んで新規作成します。
クイックメモやタスク管理など初期設定で入っているページもありますが、それらを使わなくてもOKです。

■ページテンプレートもさまざま

テンプレートを選ぶと項目やデザインがある程度配置されたページが読み込まれます。ただ情報量も多くて使いこなすには大変な面もありますので、まずは真っ白いページを作って、自分で使いやすいようにデザインや項目(リスト、テーブルなど)を追加していくと最初は使い方を飲み込みやすいと思います。

2.タスク管理ページの作り方

こういったツールのいちばんベーシックな機能は「タスク管理」ページです。
使い勝手の確認をしたいときには、まずタスク管理ページを作ってみるとおおよその雰囲気がつかめます。

Notionのタスク管理ページは、機能的には他のツールとそれほど変わりません。それぞれ項目の中には詳細を書くことができます。ヘッダー写真やアイコンは好きに入れ替えられます。

私が良いかもと思ったポイントは”ビュー”を好みに変えられること。
“ビュー”は見た目のことで、例えば↑のスクリーンショットは【BoradView】ですが、他にも【テーブルビュー】【リストビュー】などがあります。

■テーブルビュー

項目の中に電話番号やメールアドレス、URLを書き込むと、テーブルビューではそれを一覧で見られます。お電話しないといけないところをピックアップしておいて時間があるときに一気に上からかける、などもアポ取り時には便利かもしれません。

■リストビュー

シンプルにリストでも見られます。
自分のタスクをパッとひと目で確認するにはシンプルなリストがいちばんですね。

3.スケジュールカレンダーの作り方

タスク管理の項目に【対応期限】を書き加えていくと、”ビュー”を切り替えるだけでカレンダーになります。
あまり細かなタスクに期限を入れていくのは手間ばかり増えるので非現実的かもしれませんが、例えばプロジェクトのデザイン提出やコーディングスタートなどおおまかな日付を書いていくと、全体のスケジュールの見通しを確認できるカレンダーになります。

(このカレンダーは1月ずつではなく下にスクロールするとずっと続いていきます)

これはNotionのページ内にもともとレイアウトを変更する機能が備わっているからできること。1つのページに書き込んだ情報をいろいろなレイアウトにクリック1つで変えることができます。

このように見た目を好みや使いやすさで切り替えられるデザイン性がNotionの良いところだと思います。タスク管理やカレンダーアプリはたくさん出ていますが、機能になると読みづらくなったり、デザイン面のカスタマイズ性が下がってきてしまったりするものもあります。Notionはその点に配慮して開発されているようなので、気持ちよく使えるというクチコミが多いのかもしれません。

4.情報リンク集の作り方

WEBサイト制作時、企画を立てたり原稿やデザインラフを作成したりするために多くのURLを共有することがあります。チャットでリンクを送ってもクリックすれば見られるのですが、1ページにきれいにまとまっていると読みやすく、後から見返しやすいメリットがあります。

NotionはさまざまなWEBサービスと連携していることもあり、Twitterなどは元のツイートを埋め込む形で一覧にまとめることができますし、Googleアカウントを連携させるとドキュメントやスライドを読み込んで表示させられます。

■ページ内へのリンクの埋め込み方
NotionのページもWordPressのブロックエディタのように、1つずつのブロック(ボックス)に要素が入って構成されています。1つの新規作成したブロック(ボックス)にURLを貼ると、例えばTwitterならURLで表示させるか、元のツイートを埋め込むかなど選択肢が出てきます。GoogleドライブのリンクもそのままURLを貼るのか埋め込むか選べます。

すごく簡単にいうと、WordPressでWEBページを作っているような感覚です。
リンクの張り込み以外にもさまざまな項目を選んで載せることができます。WordPressのブロックを選ぶのと同じですね。

WEB制作に慣れている方なら直感的に作業ができるので、とても使いやすいツールだと思います。

5.テーブルでオリジナル辞書の作り方

プロジェクトごとに例えばプログラムのコードや文章の表記ルール、デザインガイドラインなど、オリジナルの辞書のようなページを作ってチームで共有すると、修正が楽になります。

URLで共有すれば、随時更新しても最新のものをチェックしてもらえます。
このテーブルは計算もできますし、セルを表示したり非表示にしたりもできるので、自分だけのメモを書き込むことも可能。

また、それぞれのセルにコメントを別途付けられるので情報をひとまとめにできる、動的な操作ができることで絞り込みができるなど、PDFで共有したときには表現できなかったことができるメリットがあります。

そしてそれぞれの動きが非常に軽く、ストレス無く挿入や削除ができるのも大きな魅力の一つ。作業の効率化にぜひご活用してみてはいかがでしょうか。

まとめ

NotionはWEBデザイナーさん、ディレクターさん、コーダーさんが多く活用しているツールです。より深く活用したいと思ったときも、少し検索するとさまざまな方法がインターネット上で解説されています。特にTwitterでは言及が多く、「Notion」と検索すると関連ツイートが多数見つけられますので、わからないことがあればTwitter検索がオススメです。

また、noteにもNotionのデザインカスタマイズについてや、活用方法について情報が多く集まっています。実は日本語化されたのが最近のツールなのですが、その前から翻訳しながら使っている人が多くいました。それだけ使いやすいツールなのだと思います。

年々受け止めきれないほど多くの情報が、さらにスピーディーに飛び交うようになってきているので情報の処理や共有も工夫していきたいですよね。この記事が皆さまの制作作業の軽減につながれば幸いです。