Motivation

転職をきっかけに自分のキャリアを見つめ直し、もともと自分の職務経歴書として使い倒していたWantedlyでは表現力に限界があると考え、自分のプロフィールページを作ることにした。

自分のWantedlyページ↓

狩野 絢多のプロフィール - Wantedly

Repro Inc., Customer Success Div. Growth Marketing Team

www.wantedly.com

限界があると感じたのは、当たり前だが職務経歴が企業に紐づけて記載することが前提となっていることで、個人事業主としての経歴を書ききれないというところだ。

大学時代の経験、それは確実に自分の糧となっており、自分の人となりをビジネスの観点でわかってもらうにはそれを細かく書き読んでもらうことが必要だ。新卒就活前の自分はそう思って、Wantedlyの自己紹介欄に書きまくった。

その結果として、大量のスカウトがもらえたし、インターンも新卒入社も転職も全部Wantedlyでスカウトを頂けたところで決めた。

しかし現在の自分の経験値をこのWantedlyの自己紹介欄に書くと文字数制限に引っかかるし、そもそも情報量が多すぎて忙しい皆様に読んでもらうようなものになってない。

そこで自分のキャリアを見直し、整理し、読んでもらえるような場としてプロフィールページが欲しいと思った。

要件定義

ざっくりどんなページとして構築したいのかをまず考え以下のようになった。

• 技術的な管理コストはなるべく減らす
• シンプルにタイムライン形式で経歴をまとめながら更新の簡易さを担保したい
• マストではないが、ブログ機能を持たせて知見をまとめる場を自分のドメイン内に持たせたい

さらに個人的な目標として最近やったWixでのノーコードWebページ作成の案件がしんどかったのでプログラマー不在な案件で良い感じのサイトを作る手段を模索したいというのがあった。

技術選定

前職でサービスのサポートサイトを構築する際にNext.JS × AWS Amplify × microCMS の構成のJamstakでやっていただき、運用者観点でとても体験がよかったので、そういった形も検討したが、自分個人の力量だとサイトを作るところまでで手一杯だなと感じたのでボツにし、大きく以下3点で検討した。

1. Hugo × GitHub Pages
2. Notion単体
3. Notion × ???

1. Hugo × GitHub Pages

Jamstakの魅力に取り憑かれたところでもう少し手軽にやりたいというところの選択肢。

プログラマー不在な案件で良い感じのサイトを作る手段を模索したい

というところからちょっと逸脱しかけているなぁと思い、最終的にボツ。

次やるならこれでやると思う。

2.Notion単体

これはもっともシンプルでコストもかからない手段。Notionで記事をつくってページを公開するだけ。

ただこれだとNotionすぎておもしろくないなぁというところでボツ。

3.Notion × ???

とはいえ、Notionは大好きだし、これをベースに他に色々あるサービスを組み合わせて小綺麗なサイトを構築している事例をいくつか見ていたのでこれでやってみることにした。

選択肢として検討したのは以下２点

Super - Create Websites with Notion

Your work stays in a place you control and love, while Super handles the technical parts of publishing it to your website. This means you can focus what's actually important to you: creating content and building your brand without worrying about configurations, plugins, downtime, performance, or security.

super.so

Notionに書くだけでWebサイトが作れるWraptas

Notionを使ってWebサイトを作れるWraptas。更新も簡単、デザインも変更できて独自ドメインやパーマリンクの設定も可能です。

wraptas.com

実案件でもしやることになったら日本企業で日本語で扱えるWraptasを採用すると思ったので、逆にSuperにしてみた。

Benchmark

まずベンチマークとして意識したのは大ファンなcatnoseさんの個人サイト。

catnose

Personal website of catnose.

catnose.me

ミニマムさを意識したいというところではr7kamuraさんのサイトも参考にした。

r7kamura.com

日々の生活やプログラミングに関する情報を発信する、r7kamuraのウェブサイト

r7kamura.com

あと、実際にNotion×Superを採用していてやりたいことに近いことをしているというところで、

Hirotaka Miyagiさんのポートフォリオサイトも参考にしている。

Hirotaka Miyagi / 宮城広隆

株式会社リゾートワークス | Frontend, Backend, AWS ワーケーションを通じて働く人の"創造性"を刺激する福利厚生サブスクリプションサービス で、Terraform/AWS/ECSを用いたインフラの技術選定・構築・運用を担当しました。チーム開発としてRails/Nuxtによるアプリケーション開発にも参加しました。

mh4gf.dev

実際に作り始めてからはSuperのShowcaseに掲載されているサイトをよく見ていた。

Miriam Gonzalez

Frontend developer, creadora de contenido, speaker y amante del diseño y UX

miriamgonzalez.dev

Michael Dean

Architect turned writer. Director of Content at Write of Passage. Edited over 500 essays last year. My writing aspirations: polymathic scope, battle-tested prose, untethered raves, blitz imagery.

www.michaeldean.site

その他

Notion × Super でのサイト作成におけるTipsは別途記事としてまとめて公開します。