Styleguide for Web Site Operation
0 likes492 views
This is about Styleguide for Web Site Operation
Styleguide for Web Site Operation
- 3. • サイト運用 • スタイルガイド • 運用フェーズ アジェンダ
- 4. サイト運用
- 8. • コンセプトのズレ • ディレクトリ構成の不一致 • デザインの統一感がなくなる • ブランドイメージに影響を与える • ユーザビリティ、ファインダビリティの低下 • 同じようなスタイルが作らていく • メンテナンス性が落ちる サイト運用
- 11. スタイルガイド
- 12. • デザインやレイアウトの統一 • 制作・運用・管理の効率化 • コードの品質維持 スタイルガイド スタイルガイドの目的
- 15. Salesforce1 Styleguide http://sfdc-styleguide.herokuapp.com/
- 17. • サイト（ブランド）コンセプト • 配色パターン • 使用するフォント • 使用するアイコン • キャッチやバナーのサイズ • モジュールのHTML スタイルガイド 掲載項目例
- 19. スタイルガイド 配色パターン
- 20. スタイルガイド 使用するアイコン
- 21. スタイルガイド 使用するフォント
- 22. スタイルガイド バナー等のサイズ
- 24. • コンセプトの共通認識 • デザインの一貫性を保つ • 作業効率の上昇 • HTMLを知らない人でもページの作成ができる スタイルガイド 期待される効果
- 25. 運用フェーズ
- 29. • レイアウト変更 • 既存UIの改修 • 新規UIの追加 運用フェーズ 運用フェーズで起こりうる事
- 33. • 見つけやすい • 更新され続けること • 実用的であること 良いスタイルガイドの特徴 運用フェーズ
- 34. • パーツ単位のスタイルガイド • モジュール一覧のHTML • バナー作成ガイドライン • カラーガイドライン • 文字の大きさガイドライン 既存あるもの 運用フェーズ
- 35. • パーツ単位のスタイルガイド • モジュール一覧のHTML • バナー作成ガイドライン • カラーガイドライン • 文字の大きさガイドライン 既存あるもの 運用フェーズ } } コーダー向け デザイナー向け フォーマット：HTML フォーマット：PDF 置き場所：Webサーバー 置き場所：ファイルサーバー
- 36. • 置き場所は全員が把握しているか？ • 更新性はあるか？または、誰が担当するか明確か？ • 実用性があるか？ 運用フェーズ
- 40. • プロトタイプが作成できる • グラフィックのアセット • コンポーネントのアセット 実用的にする 運用フェーズ
- 42. まとめ
- 43. • サイト運用こそ本番 • スタイルガイドも運用の一部 • 品質維持、業務効率のためスタイルガイドの 更新は忘れずに まとめ 運用フェーズ