works

アトリエ金工やまぐち　様（Webサイトトップページデザイン・コーディング）

茨城県にある鍛金工房「アトリエ金工やまぐち」様のWebサイトトップページを制作いたしました。
今回はトップページのみの試作ということで実運用には至りませんでしたが、実際にクライアントを立て、サイト制作に関わるひと通りの手順を実践で学ぶことが出来ました。
制作日誌に、コンセプト決めなどの過程を記録しています→アトリエ金工やまぐち様サイト制作日誌一覧を見る

URL：

https://5storage.sakura.ne.jp/kadai_dhf/
ユーザー名：f2303002／pass：tsudatest

作成目的：

◎若年齢層の潜在顧客に、鍛金の魅力を知ってもらう
◎今後外部の通販サイトなどを導入した場合、サイト連携して誘導する
◎リピートユーザーである収入に余裕のある高年齢層に対して、展覧会などの案内を行う

メインターゲット：

◎ネット通販を使い慣れている30代～40代
◎収入に大きな余裕はないが、芸術品や手作りの品に対する興味はある
◎「実用品は量産品でいいが、なるべく長く使えるものがいい」と思っている
　→ここから、「量産品ではない、一点ものやオーダーメイドもたまにはいいかも」と考え方を変えてもらえるようなサイトを目指す

コンセプト：

量産品でない「世界にひとつの製品」は贅沢だと思っている人たちが、「その贅沢に触れてみたい」と思えるよう、鍛金作品を身近に感じてもらうための玄関となるサイト

制作範囲：

トップページ（PC・スマートフォン）

制作期間：

企画、ワイヤーフレーム：3週間
デザイン：10日
コーディング：3週間

使用ツール：

Photoshop／Illustrator／Figma／Dream Weaver／Visual Studio Code

こだわったポイントなど：

まず企画、ワイヤーフレームの作成に3週間割き、コンセプトなどの土台を入念に固めることを意識しました。
下図のようなペルソナ法のほか、ユーザータイプをセグメンテーション分類して分析する、ストーリーボードを作成するなどの手法を取っています。
その結果、初見ユーザーはまず作品（WORKS）が見られるよう、既存客は新着ニュースをすぐに閲覧できるよう、右上にNEWSの追従バナーを表示させることとしました。
サイト全体のデザインについては、クライアントの大事にしている「金属には温もりがある」という信念を表現するため、セピア調でまとめています。

今後の課題：

◎アクセシビリティへの配慮：worksをモーダルにする必要があるか、newsはスライダーでいいかなどの再検討と修正
◎パフォーマンスの改善
◎SCSSを使った設計
◎下層ページの作成
◎CMSなどを利用した実運用

制作時には、とにかく今自分にできる技術を詰め込むことに重点を置いて作っていたため、上記についてはまだ改善の余地があります。