ライター向けポートフォリオ

このテンプレートを使えば、雑誌のアートディレクターが手がけたようなエディトリアル風のポートフォリオが手に入ります。デザインスキルやコーディングの知識は必要ありません。温かみのあるクリーム色の配色、セリフ体とサンセリフ体を組み合わせたタイポグラフィ、ゴールドのアクセントが、文章と実績を主役に据えた読みやすいサイトを生み出します。

技術的な部分はすでに整っています。レスポンシブレイアウト、なめらかなスクロールアニメーション、SEOメタタグとOpen Graphの設定、適切なセマンティックHTMLによるアクセシブルなナビゲーションは、すべて対応済みです。コードと格闘することなく、経歴の見せ方や記事の公開に集中できます。

主要な4ページが、すぐに使える状態で用意されています。6つのスクロールセクション（イントロ、自己紹介、スキル、職歴、学歴、言語）を備えた履歴書兼ポートフォリオのホームページ、ブログ一覧ページ、コメント機能を組み込んだ個別のブログ記事ページ、そして実際に動作するフォームを備えたお問い合わせページです。装飾的な✦マーカー付きのスクロールスパイ式サイドナビゲーションが、訪問者が今どのセクションを読んでいるかを示すので、作品を見て回る間も迷いません。

ポートフォリオサイトのためにデザイナーに数百ドルを支払ったり、ほかの人と代わり映えしない汎用テーマで妥協したりする必要はありません。登場アニメーション、浮遊するアバター画像、ブログのサムネイルのホバーエフェクト、統一感のある温かみのあるトーンのデザインシステムを備えたエディトリアルレイアウトが手に入り、すべてブランドに合わせてカスタマイズできます。

おすすめの活用例

ライター・編集者のポートフォリオ

職歴、スキル、学歴を、時間差で表示される登場アニメーション付きのスクロール型履歴書レイアウトで紹介できます。✦マーカー付きのサイドナビゲーションを使えば、訪問者はイントロ、自己紹介、スキル、職歴、学歴、言語の各セクション間を、現在地を見失わずに移動できます。洗練されたポートフォリオは信頼性を高め、サイトの訪問者を報酬を支払ってくれるクライアントへと変えます。

個人エッセイ・ソートリーダーシップブログ

組み込みのブログで、エッセイや業界への論評、創作作品を公開できます。各記事には、アイキャッチ画像、著者情報、読了時間、読者と交流できるコメント欄を備えた専用ページが用意されます。継続的に発信するライターには読者がつき、その読者がフリーランスの依頼や登壇の招待、スポンサーシップの機会につながります。

コンサルタント・コーチのオンライン拠点

資格や専門分野、経歴を、企業的というよりエディトリアルな雰囲気で紹介できます。温かみのあるクリーム色の配色とPlayfair Displayの見出しが洗練されたトーンを演出し、専門性を重視するクライアントの心に響きます。入力チェックとトースト通知を備えたお問い合わせフォームで見込み客が気軽に連絡できるため、サイトを見つけてから最初の会話までの道のりが短くなります。

クリエイティブ職向け履歴書サイト

静的なPDFの履歴書を、動きのある生きたWebポートフォリオに置き換えれば、キャリアのストーリーを語るだけでなく、見せることができます。レスポンシブデザインはあらゆるデバイスで機能するため、採用担当者がノートパソコンで開いてもスマートフォンで開いても、快適に閲覧できます。応募者全員が同じような書類を送るなかで、これほど見栄えのよいサイトは大きな強みになります。

当てはまるものはありましたか？このテンプレートをリミックスして、作成を始めましょう。

作れるもの

このテンプレートは、次のようなサイトの土台になります：

• スクロールスパイ式の履歴書、ブログ、お問い合わせページを備え、古くなった個人サイトに代わるライターポートフォリオ。登場アニメーションとエディトリアルなタイポグラフィで、作品が上質に見えます
• 資格、公開した文章、お問い合わせフォームを統一感のある1つのサイトにまとめたコンサルタントのオンライン拠点。見込み客に、連絡する前から提供価値を理解してもらえます
• あらゆる画面サイズで機能し、すばやく読み込まれ、雑誌のレイアウトのように見えるクリエイティブ職の履歴書サイト。よくある汎用テンプレートとは一線を画します

はじめ方

ステップ1：このテンプレートをリミックスする

「リミックス」をクリックしてコピーを作成します。カスタマイズできる状態のエディトリアルポートフォリオ一式が手に入ります。6つのスクロールセクションを備えた履歴書ホームページ、ブログ一覧、コメント付きの個別ブログ記事、お問い合わせページの主要4ページです。スクロールスパイ式ナビゲーション、登場アニメーション、浮遊するアバター画像、お問い合わせフォームなど、すべてのページと機能はすでに動作しています。あとは自分らしく仕上げるだけです。

このテンプレートが合わない場合は、別のテンプレートをリミックスすればよいので、作業が無駄になることはありません。

ステップ2：ブランドに合わせてカスタマイズする

温かみのあるクリーム色の背景とゴールドのアクセントカラーを、パーソナルブランドに合わせて変更しましょう。Playfair DisplayとRubikのフォントの組み合わせを調整したり、好みの書体に差し替えたりもできます。Lovableのビジュアルエディターを使えば、レイアウトの変更、装飾的な✦マーカーの調整、余白の微調整を行い、自分だけのデザインに仕上げられます。思いどおりの見た目にするのに、コードの知識は必要ありません。

ステップ3：コンテンツを追加する

サンプルの履歴書セクションを、実際の職歴、スキル、学歴、言語に置き換えます。仮のブログ記事も、自分のエッセイや記事、論評に差し替えましょう。とっておきのプロフィール写真やポートフォリオ画像をアップロードすれば、テンプレートのホバーズーム効果と角丸の画像スタイルで洗練された見た目になります。テンプレート自体は控えめなので、注目されるのは文章と実績です。

ステップ4：ツールを連携する

お問い合わせセクションにSNSのプロフィールをリンクし、オンラインでの活動全体の一部としてテンプレートを自分のものにしましょう。Vellumは作品をすっきりとプロフェッショナルに見せるよう設計されているため、ポートフォリオは孤立した仮置きのページではなく、それ自体が洗練されたコンテンツ中心の発信拠点として成り立ちます。

ステップ5：公開する

ワンクリックでポートフォリオを公開できます。ホスティング、セキュリティ、パフォーマンスの最適化はLovableが自動で処理します。SEOメタタグ、SNSでのシェア用のOpen Graphカード、あらゆるデバイスに対応するレスポンシブレイアウトを備えたサイトが、数分で世界中に公開されます。編集者やクライアント、読者にURLを共有して、存在感をアピールしましょう。

まとめ

このエディトリアルポートフォリオテンプレートは、作品の質にふさわしいサイトを求めるライター、編集者、コンサルタント、クリエイティブ職の方に最適です。デザイナーを雇わずに雑誌風のデザインを、プラグインを設定せずにコメント付きのブログを、コードを1行も書かずにスクロール型の履歴書レイアウトを手に入れられます。

初めての本格的なポートフォリオを立ち上げる場合も、信頼を損なっている簡素なサイトを置き換える場合も、このテンプレートが確かな土台になります。スクロールスパイ式ナビゲーションで長文コンテンツも見渡しやすく、Framer Motionのアニメーションが動作を重くすることなく洗練さを加え、温かみのあるエディトリアルな美しさが数多くの汎用テンプレートのなかで際立ちます。テンプレートは無料で、カスタマイズにかかるのは数時間ほど。今夜にはポートフォリオを公開して共有できるかもしれません。