デザイン制作期間: 2日程度
コーディング&WordPress構築期間:1週間程度
使用ツール: Figma・Visual Studio code・Google Meet・Slack
概要
SaaS型のサービスシステムのヘルプセンター（説明書）
課題
・費用を抑えて制作したい
・記事内に目次をつけたい
・カテゴリ毎にわかりやすくしたい
・HTMLの知識がなくとも編集可能にしたい
・誰が投稿しても見た目綺麗になるようにしたい
解決策
ヘルプページの構築経験を活かし、難なく設計〜デザイン〜構築まで駿足で完走
WordPressのダッシュボードに作成した記事作成方法、管理者向け説明ページへのリンク等を設置
カテゴリが増えても自動でメニューとTOPページに項目が増えるよう自動化
個別記事ページは見出しを目次化
事前に記事内の要素パターンを整理しcssのスタイルが自動で反映されるように準備しました。
デザインは、サービスサイトやシステムと区別ができるように、但し世界観を壊さないような本サービスのブランディングの範囲でテイストを合わせたもので、静かに閲覧できるように落ち着いたブルー＋白ベースにすることで、落ち着きや信頼感を心理的に与える配色に仕上げています。
(画像は本番のものではなく、デザイン段階でのテキスト仮置きのダミー文が挿入されたものになります。
極力シンプルに見易さや情報の探しやすさを重視したアクセシビリティを意識したデザインになっています。
アニメーション等を施すと集中して観ることができなくなるため、イラストも最小限の使用に留めています。
サイトurl https://flowzoo.support/
