「デザインガイドライン」の版間の差分
編集の要約なし |
編集の要約なし |
||
| 3行目: | 3行目: | ||
仕事上のファイルは、共有サーバにて管理しています。<br> | 仕事上のファイルは、共有サーバにて管理しています。<br> | ||
複数のスタッフが作業するため、スムーズにミスなく作業ができるようにルールを設けています。 | |||
===(1)ファイル共有の徹底=== | ===(1)ファイル共有の徹底=== | ||
* | *■仕事上のファイルは他のスタッフと共有するため、必ず<b>作業終了後に指定場所に上げる</b>こと。 | ||
* | *■修正や更新の作業開始時には、<b>まずWEBWORKから最新ファイルを落としてから作業する</b>こと。< | ||
→先祖返りのミスを起こさないようにするため。 | |||
* | *■作業途中で帰社する場合、途中でもそのpsdファイルを共有サーバに上げること。 | ||
→急に欠勤した場合でも、スムーズに引き継げる状態にしておく。 | |||
===(2) | ===(2)フォルダ分け=== | ||
* | *■フォルダは'''クライアント別/案件別/種別(sourceとか)/日付(本アップ日)/タイトル'''に分かれている。 | ||
*■「本アップ日(予定日)」ごとに新しいフォルダを用意する。 | |||
===(3)種別のフォルダ構成=== | ===(3)種別のフォルダ構成=== | ||
*'''source:デザインファイルを格納する。デザイナーはここを使う。''' | |||
*''' | *backup:バックアップファイルを格納する。 | ||
* | *temporary:一時的なバックアップファイルを格納する。デザイナーには関係なし。 | ||
* | *upload:アップする差分ファイルを格納する。担当ディレクターが本番にアップする。 | ||
* | *works:実作業ファイルを格納する。サイト上の全ファイルがある。ココが常に最新状態となる。 | ||
== | ==作業の工程== | ||
デザイン発注の際は「指示書」を付け、口頭説明することで正式な依頼とする。<br> | |||
指示書は「現在、誰がバトンを持っているか?」という目印の役割も担う。 | |||
===(1)依頼=== | |||
指示書(全ての情報が落とし込んであるべきもの)と一緒に口頭で依頼する。それを持って正式な「発注」とする。 | |||
===(1) | |||
指示書(全ての情報が落とし込んであるべきもの) | |||
<div class="example"> | <div class="example"> | ||
【確認する項目】<br> | 【確認する項目】<br> | ||
* | *■本アップ日<br> | ||
* | *■締切/デザイン提出日(日時まで確認)<br> | ||
* | *■ボリューム(ページ数、バナー数など)<br> | ||
* | *■内容(目的、要素、優先順位、テイスト、色味、参考資料、技術、制約…) | ||
* | *■素材(文字、画像、ロゴ…)<br> | ||
※素材一式は当該のフォルダ内に入っています。 | ※素材一式は当該のフォルダ内に入っています。 | ||
</div> | </div> | ||
===(2)デザイン作業中=== | ===(2)デザイン作業中=== | ||
デザイナーは考えるのが仕事です。頭を使ってデザインしましょう。 | |||
===(3) | ===(3)作業者の見直し=== | ||
デザインが終了したら、客観的・多面的な視点で見直す。この時間もしっかりと取ること。 | |||
<div class="example"> | <div class="example"> | ||
■<b>デザイン全般</b> | |||
* | *・そのデザインはユーザーの要求に応えることができるか。わかりやすいか。 | ||
* | *・情報の強弱、優先度は適切か。 | ||
*・ユーザビリティ上の問題はないか。 | |||
*・他ページとの整合性は取れているか。 | |||
*・コーディングや運用を想定したデザインになっているか。 | |||
■<b>要素</b> | |||
*・要素漏れがないか。 | |||
*・現在アップされているページと比較して、矛盾点がないか。 | |||
■<b>文字</b> | |||
*・誤字脱字はないか。 | *・誤字脱字はないか。 | ||
* | *・文章の意味は通じるか。もっと分かりやすくならないか。 | ||
* | *・文字の可読性は確保されているか。 | ||
* | *・画像化した文字は「文字詰め」を行っているか。 | ||
*・半角や全角のブレはないか。 | *・半角や全角のブレはないか。 | ||
■<b>PSDファイル</b> | |||
*・誰にでも更新しやすいレイヤーになっているか。 | |||
*・エリアごとにフォルダ分けされているか。 | |||
*・余計なレイヤーはないか。 | |||
*・ガイドにズレはないか。 | |||
</ | |||
</div> | </div> | ||
===(4)作業終了=== | |||
*■PSDファイルはWEBWORKの指定場所に上げる。それと同時に確認用JPGも上げること。 | |||
*■制作物をプリントアウトし、本アップ日を赤ペンで記入の上、指示書と共に作業依頼者に手渡す。 | |||
*■出力の際は「画像化(レイヤー統合)」してからプリントアウトする。(画面と同じ見え方にするため) | |||
*■デザイン上の問題点や懸念点があったら報告すること。 | |||
2011年7月14日 (木) 14:45時点における版
共有サーバ WEBWORKについて
仕事上のファイルは、共有サーバにて管理しています。
複数のスタッフが作業するため、スムーズにミスなく作業ができるようにルールを設けています。
(1)ファイル共有の徹底
- ■仕事上のファイルは他のスタッフと共有するため、必ず作業終了後に指定場所に上げること。
- ■修正や更新の作業開始時には、まずWEBWORKから最新ファイルを落としてから作業すること。<
→先祖返りのミスを起こさないようにするため。
- ■作業途中で帰社する場合、途中でもそのpsdファイルを共有サーバに上げること。
→急に欠勤した場合でも、スムーズに引き継げる状態にしておく。
(2)フォルダ分け
- ■フォルダはクライアント別/案件別/種別(sourceとか)/日付(本アップ日)/タイトルに分かれている。
- ■「本アップ日(予定日)」ごとに新しいフォルダを用意する。
(3)種別のフォルダ構成
- source:デザインファイルを格納する。デザイナーはここを使う。
- backup:バックアップファイルを格納する。
- temporary:一時的なバックアップファイルを格納する。デザイナーには関係なし。
- upload:アップする差分ファイルを格納する。担当ディレクターが本番にアップする。
- works:実作業ファイルを格納する。サイト上の全ファイルがある。ココが常に最新状態となる。
作業の工程
デザイン発注の際は「指示書」を付け、口頭説明することで正式な依頼とする。
指示書は「現在、誰がバトンを持っているか?」という目印の役割も担う。
(1)依頼
指示書(全ての情報が落とし込んであるべきもの)と一緒に口頭で依頼する。それを持って正式な「発注」とする。
【確認する項目】
- ■本アップ日
- ■締切/デザイン提出日(日時まで確認)
- ■ボリューム(ページ数、バナー数など)
- ■内容(目的、要素、優先順位、テイスト、色味、参考資料、技術、制約…)
- ■素材(文字、画像、ロゴ…)
※素材一式は当該のフォルダ内に入っています。
(2)デザイン作業中
デザイナーは考えるのが仕事です。頭を使ってデザインしましょう。
(3)作業者の見直し
デザインが終了したら、客観的・多面的な視点で見直す。この時間もしっかりと取ること。
■デザイン全般
- ・そのデザインはユーザーの要求に応えることができるか。わかりやすいか。
- ・情報の強弱、優先度は適切か。
- ・ユーザビリティ上の問題はないか。
- ・他ページとの整合性は取れているか。
- ・コーディングや運用を想定したデザインになっているか。
■要素
- ・要素漏れがないか。
- ・現在アップされているページと比較して、矛盾点がないか。
■文字
- ・誤字脱字はないか。
- ・文章の意味は通じるか。もっと分かりやすくならないか。
- ・文字の可読性は確保されているか。
- ・画像化した文字は「文字詰め」を行っているか。
- ・半角や全角のブレはないか。
■PSDファイル
- ・誰にでも更新しやすいレイヤーになっているか。
- ・エリアごとにフォルダ分けされているか。
- ・余計なレイヤーはないか。
- ・ガイドにズレはないか。
(4)作業終了
- ■PSDファイルはWEBWORKの指定場所に上げる。それと同時に確認用JPGも上げること。
- ■制作物をプリントアウトし、本アップ日を赤ペンで記入の上、指示書と共に作業依頼者に手渡す。
- ■出力の際は「画像化(レイヤー統合)」してからプリントアウトする。(画面と同じ見え方にするため)
- ■デザイン上の問題点や懸念点があったら報告すること。
デザイン依頼について
デザイン依頼をする際には、「メール」と「依頼指示書(デザイン依頼表&指示書)」で指示を出すこと。
※メールのみだけではなく、必ず口頭でも伝える。
依頼指示書(デザイナーに渡す指示書の紙)
「デザイン依頼表」、「原稿」、「(使用可能な)画像一覧サムネイル、ロゴ」、「メールのプリントアウト」、「情報を補足する何か」で構成してください。知らない人にもスムーズにわかりやすく伝わる指示書だとミスも少なくなることでしょう。
- 「デザイン依頼表」
所定のデザイン依頼表の紙に、「案件名(タイトル)」、「本アップ日」、「仮アップ日」、「ボリューム(静的中カテ3つ、アーティクル5つ、バナー3つとか)、「(あれば)デザイン提出日」、「ディレクター担当者名」を記述すること。本アップ日は赤字で記述。
- 「原稿」
ワイヤーフレーム。必要な掲載要素(文字、画像)全て入れること。
入りきらない場合や写真や細かな要素とかは別紙で用意し、ここに入るということを明記する。あと、そのデータ(テキストファイル)はLayout内に入れることもお忘れなく。
- 「(使用可能な)画像一覧サムネイル、ロゴ」
掲載可能な画像(写真・ロゴなど)の一覧をプリントアウトしてください。掲載が必須の画像にはチェックを入れるなどして指示を出してください。
- 「メール」
概要、パン屑&タイトル名、細かなデザイン方向性の指示(色味がピンクとか、全体的に高級感を出してとか、角丸にしてとか、私、罫線嫌いなの…とかとか)はメールで送り、そのメールをプリントアウトしたものを依頼指示書に付けてください。
(1)依頼の際の注意点
- 持っている情報は全て、紙(依頼指示書たち)に落とし込んで渡すこと。
- 細かなデザイン方向性の指示(色味指定がブルーとか、テイストは高級感を出してとか、角丸にしてとか、このサイトを参考にとか)もある場合は伝えること。
素材について
- ・素材が必要な場合は、著作権に注意してください。
- ・使用した素材の元画像をフォルダに入れてください。
- ・ロイヤリティフリー素材(無料でも有料でも)を使用する場合は、必ず報告すること。
(1)素材辞典より
素材辞典は使い勝手が良いので、利用頻度が高い。素材は以下に置いてある。
\\Tkocore2\WEBworks\001_タカシマヤ\001_takashimaya.co.jp\source\co.jp\チームデザイン\[素材]フリー素材★CD-ROM
利用する際は請求に載せるので、ディレクターに伝わるようにすること。また、元のデータを案件フォルダに入れること。
(2)所有する素材集リスト
これらの本は棚に置いてある。
- ・「素材辞典イメージブック」1~13まで
- ・「日本の文様」
- ・「日本の伝統文様」
- ・「和風レトロ地紋」
- ・「飾り罫・飾り曲線」
- ・「日本の染型紙文様」
- ・「きらきら素材集」
- ・「FREE STYLE SCRAPS フレーム/ライン」
- ・「FREE STYLE SCRAPS ピクトグラム」
- ・「おしゃれパターン素材集 北欧・ファブリック」
- ・「おしゃれパターン素材集 水玉・ストライプ」
- ・「すぐに使えるカリグラフィと飾りケイ」
- ・「パターンライブラリー」
(2)amanaより
・必ず、事前に相談の上で購入する。
・ライツマネージドは高料金&使用期限契約のため、原則として不可。ロイヤリティフリーであれば可とする。
・使用の際は、amanaサイトの写真番号をメモするか、ブックマークしておく。
★アマナイメージズ・オリジナルロイヤリティフリーコンテンツ利用規約
http://amanaimages.com/help/qaa-0602.html
※WEBサイトやCD-ROMなどでの構成要素の一部としての使用、放送、放送用のビデオ、フィルムまたはビデオカセットなどを含むマルチメディアでの構成要素の一部としての使用。ただし、使用したコンテンツはダウンロードまたはコピー用ではない事が明確であるようにデザインすること。