noteには、今の仕事や経験がたくさんある。でも、ホームページを開くと、昔の会社案内のまま。そんな情報の離れ方を整えたのが、ウェルカムキャット合同会社・しもまゆさんのリニューアルです。
- 今の支援内容を、相談する人の悩みから選べるようにする。
- サービス・事例・お客様の声を、ホームページの中で詳しく読めるようにする。
- noteの新着とマガジン別の記事を、写真付きでホームページにつなぐ。
会社設立のお知らせから、今の仕事が伝わる入口へ
旧サイトのトップには、2014年の会社設立のお知らせがありました。大きなロゴ、黒いメニュー、投稿の一覧やアーカイブを置いた、ブログ形式の会社案内です。
会社として何をするかは書かれている。一方で、初めて訪れた人が「今の自分は、何を頼めるのだろう」と考えたとき、noteの初期設定やプロフィール制作、日々の発信の相談を見分ける入口は十分ではありませんでした。
現在の支援は、会社設立時の事業内容よりも具体的です。そこで、見た目の変更と一緒に、読者が相談先を選ぶための情報も整理しました。
最初に伝えるのは、サービス名より相手の悩み
トップの言葉は「伝えたいことを、あなたの言葉で」。その下に、何を書けばいいか分からない、発信したいけれど手が回らない、という場面を添えています。
初めての人にとって、コンサルティングという名前だけでは、何を相談していいか分かりません。自分が困っていることから読み始められるようにし、サービス、支援事例、本人のプロフィール、相談の入口へとつなぎました。
しもまゆさんの写真を大きく置いたのも、話を聞いてもらう相手の顔が見えるようにするためです。経験や想いを言葉にする仕事だからこそ、人柄が伝わる入口を大切にしています。
「全部お任せ」と「一緒に書く」を分けて伝える
サービスは、noteの初期設定、プロフィール作成、伴走サポート、運用代行など、今必要なところから選べる形にしました。
たとえば、プロフィール作成には、取材からすべて任せる方法と、自分のたたき台を添削してもらう方法があります。一つの記事にまとめるか、連載からまとめ記事をつくるかという違いまで、詳細ページで説明しています。
コンサルは自分で発信するための支援、運用代行は取材や記事づくりなどの実務を任せる支援。この違いは文章とやわらかい図解の両方で伝えています。
相談する前に、何を任せ、どこを自分で取り組むのかを考えられること。それが、サービスを細かく分けた理由です。
noteの積み重ねを、ホームページから探せるように
今回、とくにこだわったのがnoteとのつなぎ方です。ブログの入口には、新着記事のサムネイル、タイトル、日付、概要を自動で読み込む一覧を設けました。気になった記事をクリックすると、noteが別タブで開き、全文を読めます。
新着だけでは、少し前に書いた大切な記事が埋もれてしまいます。そこで、カテゴリは新しく独自に作るのではなく、しもまゆさんがnoteで整理してきた実際のマガジンに合わせました。
プロフィール、出版、noteの基本操作、企業の情報発信など、読みたいテーマを選ぶと、そのマガジンの記事へ切り替わります。公開時点では46マガジンを読み込みました。記事一覧の中を言葉で探したり、続きを追加表示したりすることもできます。
記事はnoteで更新し、ホームページではその発信への入口を見せる。同じ記事を二つの場所へ投稿する手間を増やさず、ホームページを見た人にも、今の活動や考え方を届ける設計です。
読み込むのは公開RSSで提供される各一覧の最大25件です。ホームページに過去の全記事を転載する形にはせず、一覧にない過去記事はnoteのリンクからたどれるようにしています。
サービスの判断は、ホームページの中でできるように
ブログの全文はnoteへつなぎますが、サービスの説明や支援事例、お客様の声はホームページの中で読めるようにしました。
何に困っていたのか、どのように支援したのか、その後にどんな変化があったのか。事例の詳細を読むことで、似た状況の人が、自分の場合に置き換えて考えられる構成です。
たとえば企業のnote運用代行と、個人のプロフィール制作は、支援の目的も中身も違います。同じ「noteの支援」として並べず、サービスと関連する事例を結び、詳しい原記事を読みたい人にnoteのリンクを添えています。
ロゴの赤を活かし、説明はやわらかく
赤いロゴは、長く使ってきた会社の印として残しました。その一方で、説明の文字まで強い赤で大きく押し出すことは避け、白い余白と落ち着いた文字色、丸みのある書体で整えています。
図解も、声をかけ合うようなやわらかい雰囲気へ。支援の違いや相談の流れを、緊張せずに眺められる見せ方にしました。スマートフォンでは、読む順番に沿って縦に進める構成です。
ホームページの印象を変えながら、本人の仕事やロゴが持つ親しみは引き継ぐ。この両立を意識しました。
見た目と一緒に、情報の届け方が変わった
| 取り組む前 | リニューアル後 |
|---|---|
| 会社設立のお知らせと事業内容が中心 | 今の悩みからサービスを選べる入口 |
| サービスを知るために別のサイトへ移動 | サービス・事例・声をサイト内で詳しく読む |
| noteの発信と会社のホームページが分かれている | 新着と実際のマガジンから記事を探せる |
| 大きなロゴと投稿の一覧を中心にした画面 | 本人の写真・短い言葉・図解で支援を伝える画面 |
新しく用意したのは、きれいなトップページだけではありません。相談の判断に必要な情報をホームページにまとめ、日々の発信はnoteとつなぐことで、それぞれの役割をはっきりさせました。
WordPressとPHPも更新し、今までのドメインとサーバーを使って公開しています。この事例で紹介している変化は、ページの構成と表示の変化です。公開後の問い合わせ数や売上の変化を示すものではありません。
発信は続いているのに、ホームページだけが昔のままなら
SNSやnoteには、今の仕事が伝わる材料がある。その材料を、初めての人にも探しやすい順番でホームページにつなぐ。今回の取り組みは、そんな状況に合うリニューアルです。
文章の発信をnoteで続けたい人には、この役割分担が使えます。ホームページの中で記事全文も管理したい場合は、サイト内ブログを中心にする設計を一緒に考えます。