商品設計・工数

商品設計

ワイヤーフレーム・ロゴ・デザイン希望を伺ってデザイナーにお任せで制作（フルオーダーではなくイージーオーダー）
ワイヤーフレームはMVを除いて5コンテンツ以内に収める（長すぎるものは別途納期相談）

工数

初期制作は2.5営業日、修正を含めて3営業日が目安です。
納期は依頼日から10営業日としていますが、早めにできればそのまま提出してください。

制作の流れ

スケジュール確認

毎週金曜日午後に、WEB制作の翌週のスケジュールが確定します。（スケジュール表はこちら）
自分の名前の欄に入っている案件を確認してください。

依頼内容・打ち合わせ日時の確認

毎週月曜朝までにメールで依頼内容と打ち合わせ日時の依頼連絡が来ます。
メールでは下記内容を確認してください。

打ち合わせ希望日	日時が書かれていますので、可否をディレクターさんにSlackで連絡してください。
制作納期	原則10営業日ですが、相談なく短い納期設定担っていた場合、上長に一度確認を入れてください。
既存サイト・告知サイト	基本情報の確認のために共有していただいています。
ヒーローカスタマーURL	こちらも基本情報の確認のために共有していただいています。もし告知サイトや基本情報シートに記載されていて、ヒーローカスタマーに入力されていない情報があれば指摘してあげてください。
添付資料：ワイヤーフレーム・サイトマップ	・長すぎていないか（MV＆ヘッダー、フッターを除いて5コンテンツに収まっているか）・大雑把、不明瞭な指示がないか等を確認してください。もしあまりにも長い、指示が不明瞭すぎる場合は打ち合わせ前に上長に一度確認を入れてください。
添付資料：ロゴ	ai、psd、epsいずれかの形式のデータを支給してもらうことになっています。もしjpgで来た場合は透過されていないため透過するデザインができないことを伝えてください。トレースが必要な場合は別途DTPチームで見積もりし、必要に応じて作業してもらいます。
添付資料：基本情報シート	基本情報（住所・電話等）、ごあいさつ文、先生のお名前など、デザイン制作時に必要な文章があるかを確認してください。
フォントサイズ	デザイン提出後にやっぱりフォントサイズを大きくしてほしいという依頼が頻発したため、必須で入れてもらうことにしています。

打ち合わせ

依頼資料を見て分からなかったこと、確認したい点をお話ししてご確認ください。
基本的にSlackではなく、電話またはZoom・GoogleMeet等のオンラインミーティングで打ち合わせをするようにしてください。
※打ち合わせ時、デザイナーさんからどんどん提案してもらって大丈夫です。

デザイン提出

Google driveのサンプルデザインHTMLを使用して、WEB上にデザインカンプをアップし、そのURLをディレクターに提出します。

---アップするデータの下準備---
①テンプレートをダウンロード（G:\共有ドライブ\素材\コーディングテンプレート\サンプルデザイン HTML）
②design.jpgを作ったデザインカンプに差し替える

---サーバーにデータをアップする---
④ヒーローカスタマーの「サーバー（制作入力）」で、サーバー番号を確認
⑤社内パスワードで②で確認したサーバー番号のFTPに接続する
⑥下記の階層にデータを設置する
「hero1160xx.xsrv.jp」>「public_html」>「案件のドメイン名のフォルダ(なければ右クリック > 新規作成で作る)」>「Sample」>「01」
※修正後のカンプをアップする際は上書きせず、1回目は02、2回目は03という新しいディレクトリを作っていってください。バックアップを取るためです！

上記の通り設置がうまくゆけば、「hero1160xx.xsrv.jp/ドメイン名/Sample/01」というURLをたたけば表示されます。

デザイン修正

修正は原則2回までです。
2回を超える依頼があった場合は、ディレクター上長および自身の上長に相談の上、状況を確認して対応していただくことになります。

＜できないこと＞
・まるっきりデザインのテイストが変わる
・テーマカラーが変わる
・ワイヤーフレームが変わる
・フォントサイズの変更（基本的に初回打ち合わせでFIXさせてもらうことにしていますが、もし修正依頼が来た場合は相談してください）

デザイン納品

上長から納品依頼の連絡をしますので、依頼がありましたらShareに格納してください。
フォルダ構造は下記でお願いします。

顧客名のフォルダ > Design > fix > デザインデータ

これにて案件自体は終了です！

デザインについて

フォントについて

本文のフォント

游ゴ、メイリオ推奨。
その他、ヒラギノ等のWEBフォントを使用。よっぽどのことがない限り、本文はベーシックな読みやすいものを採用する。

アンチエイリアスの設定はシステムフォントの「Regular」のウェイトは「Windows」とし、「Bold」のウェイトは「シャープ」を推奨しています。
ブラウザで見た時と同様に見えるようなアンチエイリアスの設定をしましょう。

文字アンチエイリアスの設定

見出しや装飾等にデザインフォントを使う場合

・なるべくfontplus、typesquare、Google font、Adobe fontにあるものを使用してください。
・上記のWEBフォントサービスにないフリーフォントを使用する場合、利用規約を確認し、商用およびWEBフォントとして使えるものか確認してください。
・WEBフォントの数はフォントファミリー（ウェイト）を含め4種程度で収められるようにしていただけると助かります。（コーディング後、サイトが重くなってSEOに悪影響がでる場合があります。またウェイトが異なるだけでも1フォントとしてカウントするため）

デザインフォントのアンチエイリアスの設定はどのウェイトであっても「シャープ」で良いでしょう。
システムフォントと同様に、ブラウザで見た時と同様に見えるようなアンチエイリアスの設定にしましょう。

他社・企業のロゴの加工について

①ガイドラインをしっかり読んで、許可されている範囲で加工すること
②ガイドラインが見当たらないものは加工を行わない
ようにお願いします！（過去、インビザラインのロゴ色変更でNGが出ています）

左上のh1タグについて

上記画像の赤枠で囲った部分がh1テキストです。

どのプランにおいても基本的にh1テキストは入れましょう。
ワイヤーに無い場合は補ってください。

SEO上非常に重要な部分になりますので、左上または右上にh1テキストを入れるようにしてください。
例：https://shirayuri-naika.com/
もしキーワードが未定の場合は「SEOワードが入りますSEOワードが入りますSEOワードが入ります」などダミーテキストを入れておいてください。

~~なお、デザイン上、どうしても入れたくない場合は除いていただいて構いません。~~
基本的にどのプランでも必須パーツですが下記のような場合には対応してください。
（オリジナルプランの場合のみどうしてもという場合には除いていただいて構いません。この場合はロゴがh1タグになります）

・ディレクターから修正時に追加（最初に入れてなくて後から追加する）
・削除（最初入れてたけど先生が気に入らなくてリスクを承知の上削除したいとの要望など）

納品時の注意

納品時の検品シートがありますので、ここを参考にしてセルフチェックを行い、納品してください。