【PHP】アーティスト団体公式サイト制作

制作物詳細
業務委託にて日本アルコールインクアート協会様に、公式サイトの制作をディレクション、デザイン、制作まで一通りご依頼いただきました。

想定ユーザー層を分析したところ「新しく革新的なもの、弱点より圧倒的な長所、時代の最先端」などや、ラグジュアリー感や高級感を好む傾向にあるという結果が出たため、協会のイメージカラーである「ミントグリーン」と合わせて、「くすみカラー」をベースにしました。イメージスケールは下記画像をご覧ください。アートを扱う団体であるため、手作り感がありつつも抜け感、ラグジュアリーさ、柔らかさなどを感じられるようなページデザインにしています。


本案件ではクライアントの意向に合わせてCSSなどをカスタムしやすいよう、WordPressではなくHTMLをベースにしたPHPファイルで構成しています。クライアントが更新しやすいよう、HTMLをベタ書きするのではなく編集したCSVファイルをディレクトリ内に配置すれば内容が更新されるようPHPを組みました。

また、本案件はメインページ数は少なくサブページが多い傾向にあるため、レスポンシブデザインで使われがちなドロワーメニューを敢えて使わずにメインページリンクをヘッダーに固定する方式にしました。ユーザビリティが低下する可能性の対策としては、スマートフォン・タブレットで出現するボトムメニューにサイトマップリンクを配置しました。クライアントの各SNSや問い合わせへのリンクとまとめて表示することで、興味を惹かないページであってもアクションを起こす可能性が高まることを想定しての実装です。


担当業務
デザイン
コーディング
ディレクション
SEO対策
使用ツール
VScode
gulp
XD
SourceTree
Excel/スプレッドシート
PowerPoint/Googleスライド
機能・仕様
各ページのファイル名を自動取得し、ページタイトル、sectionなどにファイル名を自動で付与する機能
itemtype,itemprop,itemtypeなどの指定
SEO対策基本設定
検索エンジン対策、SNSシェア用OGPの設定
CSVファイルを関数で読み込むことによる更新しやすさの向上
CSVファイルの値を条件分岐で出力しデザインを変更
SCSS内で関数を組むことでファイル名と一致したページヘッダー画像を自動出力する機能
制作期間
1ヶ月半