スタイルガイド作成
まずはスタイルガイドのサンプルを下記よりダウンロードください。
ダウンロードコンテンツに含まれるもの
- カラー
- タイポグラフィー
- アイコン
- ボタン
- コンポーネント
スタイルガイドを作成する重要性とメリット
Web サイトをローンチし、運用を行う際に必要となるのがスタイルガイドです。 入稿する担当者が複数いる場合、人によって入稿の仕方が違い、Web サイトの世界観やトーン＆マナーが一定に保てなくなることがあります。
このフェーズでは、Web サイトの世界観を保ち、運用をスムーズに進めるためのスタイルガイドを作成します。スタイルガイドを作成することで、表現の品質を一定に保つことが可能になります。
スタイルガイド作成で行うこと
デザインで使用している以下の要素を定義し、一覧化して納品いたします。
- カラー
- タイポグラフィ
- アイコン
- ボタン
- hover、click
- テキストリンク
- ビジュアルリンク
- タイトル
- Hタグ（H1/ H2/ H3/ H4/ H5/ H6）
- リスト（ul, ol）
- テーブル
- フォーム
- ヘッダー
- フッター
- メニュー
- ソーシャルアイコン
- コンポーネントを入稿したページサンプル
スタイルガイド作成を行う場合の注意点
ご自身で要件定義・設計を行っていただく場合、下記の3点を意識すると良いでしょう。
1. 入稿に必要な情報は網羅し、いつでも見られる場所に置いておくこと
作成したコンポーネントはすべて一覧化し、誰でも見られる形式のデータにしておくなど、編集担当者やライターがいつでも見られる状態にしておきましょう。
2. コンポーネントを利用しているサンプルイメージも作っておくこと
デザインに使用しているコンポーネントが網羅されていることは必須ですが、それぞれのコンポーネントをどう使うかがわかるものも作っておくと良いでしょう。例えば、記事サンプルのようなものです。
3. Web サイトローンチ後に適宜見直すこと
スタイルガイドは作って終わりではありません。Web サイトローンチ後に、当初の想定と異なる表現を使用し、それが定着することがあります。そのような場合には適宜スタイルガイドを見直し、実際の運用に即した内容にしておきましょう。
スタイルガイドサンプルダウンロード
フォームの送信後、スタイルガイドのサンプルをダウンロードできます。
Flow
WordPress サイト制作のプロジェクト進行フロー
Web サイトの目的やご依頼内容をヒアリングし、概算費用をお見積もりいたします。
正式なご依頼後、要件定義を行い、仕様・設計を詰めていきます。
デザインやコーディング、WordPress テーマの開発を行い、当社でテストを行います。
お客様の検収が終了しローンチが完了したら、サイトの運用開始となります。
FAQ
よくある質問
WordPress サイト制作について
可能です。ただし、WordPress に即した設計や手戻りを防ぐため、要件定義/設計からご依頼いただくことをおすすめしています。
Figma、Sketch、Adobe XD、Adobe Photoshop に対応しています。それ以外の形式についてはご相談ください。
可能です。お問い合わせフォームのほか、チャットもご用意しておりますのでぜひお気軽にお声がけください。なお、要件定義/設計（RFP作成支援）から RFP のサンプルがダウンロードいただけます。よろしければご活用ください。
当社へご興味をお持ちいただきありがとうございます。
「こんなことやってみたい！」と、ぜひ気軽にご相談ください。
担当者よりご連絡差し上げます。
