フォーカスしたいもの
Notionは、個人のタスク管理や企業の情報発信など、さまざまな目的に使える多機能なツールです。また、見た目もシンプルで使いやすく多様なアレンジが可能です。ですが、多機能すぎて逆にどうやって使ったらいいか困ることもあると思います。
株式会社デパートでは昨年、全社内の仕組み化やナレッジ・情報の蓄積を行うとしてNotionを導入しました。その上で、クリエイティブ部門で蓄積していた社内のナレッジ共有データを、他のツールからNotionに移行いたしました。この記事では、この事例をもとに、”社内ナレッジ共有のためのNotion”の実装方法や使いやすくするデザイン方法についてご紹介いたします。自社のナレッジシェアをNotionでやってみようか考えているという方の参考になれば幸いです！
ナレッジブログの移行経緯&懸念点
株式会社デパートのクリエイティブ部門(デザイナー＆エンジニアの部門)には、ナレッジ共有用ブログがありました。これには、メンバーが仕事中に得た気付きや情報を自由に投稿することができ、過去事例の参照やナレッジ共有の役に立っています。
以前はNotionとは別のツールで運用していましたが、利便性を高めるために社内の情報共有をNotionに一元化することになり、私たちのナレッジ共有ブログも移行することとなりました。
ですが、移行作業はエクスポート→インポートでポンポン！とは行きませんでした。
ブログには共有したい情報を自由に投稿していたため、記事が膨大になっていました。これらをよりうまく活用・運用しやすくするために、Notion移行と同時に、記事の分類と表示をする必要がありました。そこで私たちは、まずカテゴライズ用のタグを検討・選定し、カテゴリー一覧ページを作成することにしました。
大まかな移行の流れ
- 記事のカテゴライズ
- Notionで暫定UI作成
- 既存記事のエクスポートとインポート
- カテゴリとその他必要な項目の入力
- UIのブラッシュアップ
- 表示崩れの修正
- メンバーに投稿方法やルールの共有
おおよそこの流れで移行作業を進めました。
私はNotion初心者でしたが、1〜2の間ではエンジニアさんが暫定で記事をインポートしてNotionの仮表示を見せてくださったので、具体的なイメージや必要な情報がわかりとてもありがたかったです！Notion初心者さんは、まず知見のある仲間の手をお借りしたり、試しに少しだけ触ってみたりなどしながら進めると安心ですね。
移行作業の詳細
1. 記事のカテゴライズ
まず、既存記事から適切なカテゴリ分けを考えました。
Notionには記事分類の方法として、ジャンル、カテゴリー、タグの項目があります。今回は、社内運用の都合から「タグ」を入れることで記事を分類することにしました。
エンジニアさんが既存のブログから記事一覧を抜き出して、スプレットシートに並べてくださいました。そこに、移行チームメンバーで相談しながらタグを書き込んでいきます。
既存記事はデザイナーとエンジニアで内容が分かれているものが多いので、タグ分けもデザイナーチームとエンジニアチームそれぞれで分かれて行いました。
作成するタグは、ある程度記事数をまとめられる、かつ閲覧者にとっても投稿者にとってもイメージしやすい分類・名称である必要があります。さらに、既存の記事だけではなく、今後投稿されそうな記事も包括できるようなタグであることも大切です。タグ作成にはとても頭を使いました。
検討を重ねた末、以下のような分類にすることにしました。
2,5でも詳細説明しますが、例えば「Photoshopの機能に関しての記事」なら、[ツール / 技術]と[photoshop]の2つのタグを入れます。[ツール / 技術]=親カテゴリ、[photoshop]=子カテゴリです。これにより【ツール / 技術 > photoshop】の一覧ページに表示されるようにします。
2. Notionで暫定UI作成
カテゴリ分けが決まったら、次はNotionの方を整備します。全ブログデータを取り込む前に、一部を仮インポートしてUIを作りました。
ブログの全体構成はこのようになりました。
扉ページとしてデザイナー/エンジニアに分かれており、それぞれの中にはカテゴリが一覧になっています。さらに各カテゴリページに入ると、関連記事一覧が並ぶという構成です。
Notionの実装方法
まず、Notionサイドバーメニューから、任意の階層に【扉ページ】となる”空のページ”を作成します。
次に、【扉ページ】の中(下階層)に【デザイナーのカテゴリー一覧ページ】【エンジニアのカテゴリー一覧ページ】の”空のページ”を作成します。この時点で【扉ページ】には下層2ページへのリンクが自動で作成されています。必要に応じてタイトルやアイコンを入れてわかりやすくすることができます。5. UIのブラッシュアップに、今回作成したページのキャプチャを掲載しましたので参考にご覧ください。
【デザイナーのカテゴリー一覧ページ】の中(下階層)に【子カテゴリー一覧ページ】用の”空のページ”を1カテゴリー分作成します。なお、カテゴリーページはまず1pを作成し、その後カテゴリー数分複製したほうがスムーズでした。この時点で【デザイナーのカテゴリー一覧ページ】には下層2ページへのリンクができています。【扉ページ】同様にUIを工夫すると良いでしょう。
最後に、【デザイナーのカテゴリー一覧ページ】にはデータベースを呼び出します。ページ上で「/(スラッシュキー)」を押すとメニューが出てきますので、ギャラリービューやリストビューでインポートや作成した記事を呼び出します。
なお、この作業は記事が存在していることが前提です。テスト的にいくつか記事を移行してから行うとスムーズです。
※Notionの基本的な使い方やデータベースの設定についてはこの記事では説明しておりません。Notion公式ガイド等をご参照ください。
3. 既存記事のエクスポートとインポート
ここまでできたところで、本格的に既存ブログのエクスポート＆インポート作業を行いました。
エクスポート後に旧ブログに記事が追加されると取りこぼしてしまうため、メンバーには一時的な記事投稿ストップをお願いしています。
現在のサービスから記事をエクスポート
記事のエクスポート方法は、一般的には各サービスのサポートサイトなどで案内がされています。各サポートや検索などで探してみると良いでしょう。
エクスポートの際には、マークダウン形式にしておくとNotionでもだいたいの見た目は再現されるので安心です。また、CSV形式でもある程度の項目は保持されていますが、HTML化しDOMを整形してインポートしないと記事の内容部分は整形できないそうです。エクスポート形式を選べる際には、マークダウン形式にすると良いでしょう。
Notionへの記事のインポート
記事のインポートは、Notionサイドバーメニューの下の方にあるインポートボタンから行います。インポートではエクスポートした形式と同じものを選んでください。
また、画像は基本的にインポートできません。そのため、画像だけ移行前のサーバーに置いたままにしておくか、画像も新たなサーバーに移行してパスを書き直す必要があります。（Notion公式によると、APIでもファイルアップはされないとのこと）
なお、Notionは画像をドラッグ&ドロップで挿入することができます。これを利用し、今回の移行作業では画面にブラウザを2つ開き、片方にNotionの記事ページ、もう片方に移行元の記事ページを開き、画像をドラッグ&ドロップでいれるという手法が取られたそうです。ページ量を思い返してエンジニアさんに頭が下がる思いです！
その他、外部へのリンクは移行しても差し障りはありませんが、移行前のツール内でのページリンクは移行時に切れてしまうので修正するようにします。
4. カテゴリとその他必要な項目の入力
記事のインポートができたら、用意しておいたタグを付与します。社内運用上必要な項目があれば一緒に入力してしまいます。
Notionのページ表示で、データベースのテーブルビューを選ぶことで下図のような一覧を出すことができます。記事数が多い時にはこの状態で修正をすると入力漏れやミスを減らすことができました。
5. UIのブラッシュアップ
タグを入れたことで一覧や詳細ページに全ての記事が表示されました。暫定で作っていたUIデザインをブラッシュアップして、使いやすくします。
デザイナー/エンジニアの扉ページ
エンジニアさんが作ってくださったのですが、色＆アイコン付きボックスはコールアウトを使うと表現しやすいようです！
カテゴリ一覧ページ
こちらもエンジニアさんが作ってくださったものを参考にさせていただきました。UIデザインにも造形が深い素晴らしいエンジニアさんです。
一覧ページ
エンジニア側はテキストベースの一覧に、デザイナー側はサムネ付きカード一覧に、それぞれが使いやすいようにカスタマイズしています。
6. 表示崩れの修正
移行作業も大詰め、記事をこまめに確認していきます。ツール毎の記述の仕様の違いにより、いくつかの問題が起きていたため修正しました。
例えばこのような不具合が起きるようです。移行する際にはチェックしてみてください。
- 旧ツール独自の絵文字は表示されなくなる
- 旧ツール独自の記法があった場合、Notionの表示には再現されない
- 改行がなくなってしまうことがある
- 旧ツール上のページリンクが切れてしまう
7. メンバーに投稿方法やルールの共有
最後に、新しい記事分類についてとNotionの記事作成方法についてのHowto記事を作りました。完成後のお披露目時にも口頭での説明をいれましたが、記事を書く時などいつでも情報を参照することができます。
Notionは多機能なツールなので、メンバーが迷わず気軽に投稿したくなるような環境を整えておきたいですね！
まとめ
社内ナレッジ共有ブログのNotion移行作業は、初めてのツールと膨大な既存記事という点もあり簡単なものではありませんでした。しかし、タグによってカテゴライズされたことで、探している情報も見つけやすくなりました。また、Notionは評判に違わずとてもシンプルな見た目で読みやすく、機能も文章を書きやすいものでした。
今後社内ブログ等の移行を検討されている方は、この記事を参考に計画的に移行を行い、ニーズに沿った使いやすいUIを作成してみてください！