制作実績「aroma Bambino -アロマバンビーノ-」様

アロマバンビーノ様 サイトリニューアル

aroma Bambino -アロマバンビーノ- 清水しおりさんの
TOPページとサービス一覧ページをリニューアルいたしました。

今回はどんな流れでこのサイト制作を行っていったか書こうと思います。

目次

大まかな流れ

1 ヒアリング

まずは、TOPページを変更したいとのことだったので、
今のTOPページの変更したい点やお悩み、実現したいことをざっとお伺いしました。

・どこが気に入ってない?
・どういうイメージに変えていきたい?
・機能面でのご要望は?

などなど、思いつくものをポンポンと言っていただきました。

その他に、しおりさんの想いやペルソナなどもお伺いし、お互いのホームページに対する認識の擦り合わせをしました。

この時点ではしおりさんの中で、ザッとした要望はあるものの、まだ明確になっていない部分(TOPに何を載せるか、どんな構成にするか)もありました。

お顔合わせても兼ねて、ZOOMで。

2 WordPress 有料テーマの調査

しおりさんのサイトは有料テーマ「white studio」を使っていました。

私の方で全く触ったことのないテーマだったので、まずは何ができるのか、どう作られているのかを調査させていただきながら、ZOOMでの打ち合わせ内容を元に、もっと深堀した質問など、同時進行で進めていきました。

このやりとりはチャットです。

有料テーマ「white studio」のカスタマイズについては別記事に書いています。
「white studio」に興味ある方は、こちらの記事もご覧ください。

あわせて読みたい
ワードプレステーマ「white Studio」のカスタマイズ こんにちは。un bijour 鈴木です。今月も、あと数日。 起業について考え始めたばかりと思っていましたが、もう5ヶ月経ってしまいます。なのにブログ更新が低め・・・(...

3 参考サイトと簡単なイメージデザインを提出

チャットでのやりとりを経て、だいたいしおりさんの実現したいこと(構成ではなく、サイトイメージ)が見えてきたので、参考サイトをピックアップし、お互いにイメージがあっているか再度確認していきます

今回は、

  1. 色のイメージ参考サイト
  2. 写真の構図などにも迷われていたので、写真はこんな感じのものがいいのでは?と写真のイメージ参考サイト
  3. アロマバンビーノだとこんな感じをイメージしているとわかるような簡易的なデザイン

をお送りし、ご確認いただきました。

お返事は参考サイトや簡易イメージでOKとのこと!

あとは決まっていなかった構成をこちらで考えて具体的な中身のご提案をしていきます。

チャットでのやりとりです。

4 ホームページで使う素材(画像やテキスト)について

しおりさんはもともと、素材(写真)にキレイなものをお持ちだったので、使えそうなものをあるだけ送ってもらい、その中から私がコンテンツに合わせてピックアップして配置していきました。

どうしても欲しい構図の写真がなかった場合は、しおりさんに要望を伝えて撮影してもらったり。

しおりさん「こういうの撮ってみました!」
私「いいですね!この構図のまま、ここにテキスト入れたいので余白が欲しいです!」
しおりさん「再度、撮影してみました。違うパターンで撮影したものも送ります、別の場所で使えれば」
私「おおおーーー!いいですね!とってもステキです!」

こんなやりとりをチャットでしながら、楽しくお互いの作業を進めていきます。

テキストについては、第三者から見てわかりにくいところや伝わりづらいところを「もう少しこうしたらいいのではないでしょうか?」とご提案させていただき、それを元に、またしおりさんの言葉で書き換えていただく方法で進めさせていただきました。

テキストについても2人であーだこーだ言いながら、いいフレーズが出てくると2人で喜んだり。笑

ここも全てチャットです。

5 構成について擦り合わせ

途中で一回お顔合わせして、構成についてのすり合わせをしています。

はじめの打ち合わせだけではまだイメージできていなかった部分もあり、ここで一度改めて掲載するコンテンツやサービス、掲載順番など話し合いながら2人で整理しました。

TOPページだけでなく、サービス一覧もリニューアルして欲しいと伺っていたので、サービス一覧についてもヒアリング。

今回のZOOMで構成も方向性もバッチリ決まり、ここからスピードアップです!

ZOOMにて

構成が決まるとデザインもババっと進みます

構成が決まっていなかったため、デザインもイメージすり合わせがメインで進行していましが、構成が決まったので、ここから急ピッチで制作を進めます。

途中で一回一部分のデザインを見ていただき、しおりさんにも気に入っていただけたので、私はそのまま一気にTOPのデザインを仕上げていきます

それに合わせて、しおりさんには写真のピックアップとテキストを再度練り直していただく作業をお願いしました。

やりとりは全てチャットです。

TOPデザインが決まったので、あとはコーディング

全体のデザインもOKいただき、写真やテキストを待っている間にコーディングしていきます。

全ての素材をいただき、入れ込みが終わったらTOPページの完成!(パチパチパチ)

その後サービス一覧ページをリニューアルしましたが、こちらはやりとりの途中途中でどんな風にするかを伺っていたので、あまり時間をかけずにリニューアルすることができました。

サービス一覧ページは見出しで変化付け

サービス一覧ページはTOPページと仕様が違い、写真や写真まわりに装飾してしまうと、しおりさんの方で写真の入れ替えができなくなってしまう難点がありました。

写真の入れ替えができないというより、同じように装飾した写真を入れられないという意味です。

なので、なるべく大きなデザイン変更をせず、見出しの色を変えるなどして、ブログ記事との差別化をしました

サイトリニューアル期間

今回のサイトリニューアル期間は、約2ヶ月です。

内容的にはもっと短い期間でできる内容でしたが、他の案件との兼ね合いもあり、しおりさんのご好意で緩めな納期にしていただいています。

しおりさんからいただいた感想

掲載OKを頂いたので、しおりさんからのご感想を掲載させていただきます。

私のサイトは7年ほど前に立ち上げているため、
自分の働き方やサービス内容は変化していくけれど、サイトはどこをどう変化させれば良いのか、わからないのが悩みでした。
新しく0から作り直すよりも、厄介な案件にも関わらず、何ができるか・どんなふうに魅せられるかを、とても丁寧に研究し説明してくださいました!
ただ形を作るだけでなく、「ここはコレを伝えたいからこんな文章で!」といった目線や、訪問者視点でのアドバイスもいただき、自分の伝え方についても、振り返るきっかけをたくさんいただけました。
デザインが気に入ってるのはもちろん、優子さんが一緒に「伝える」「表現する」事について寄り添ってくださりとても嬉しかった♪完成した喜びと、優子さんと作り上げる時間が終わる寂しさを感じますが笑、また困った時には相談させていただきたいと思います。
サイトリニューアルは、優子さんのおかげで、頭を整理して振り返る時間にもなりました。ありがとうございました!

う・う・う・う〜
こんなに長い感想をいただき、とっても嬉しい(涙
感謝します。

私は極度の緊張タイプなので、対面でのヒアリングはどうしても形式ばって堅苦しくなりがち。
対して、しおりさんはとても話しやすい印象の方で、質問したら素直な気持ちをバンバン返してくれる方でした。

なのでやりとりも、めちゃくちゃスムーズに進み、かつ途中でお互いのプライベートでの共通点を発見したりと、最初から最後まで本当に楽しくワイワイお互いの意見を言い合って進めることができました。

なので今、同じく寂しさを感じています・・・(涙

リニューアルは一旦終わりましたが、
実はこのリニューアル作業中に、しおりさんのご提供サービスを受けていて、ビックリするぐらい私にとって良いサービスだったので、またリピートします!

あと我が家、親戚が長野に多いので、いつか遊びにいきます!笑

しおりさんのサービスは案件携わったからとか関係なく、本当にいいサービスだったので、ぜひ皆さんにも知って欲しい!!
なのでまた別記事に書きます!

しおりさん、2ヶ月間あっという間でしたが、本当にありがとうございました。
これからも引き続きよろしくお願いいたします ^ ^

しおりさんにご相談したい方はぜひ!

しおりさんのご紹介
アロマバンビーノHP:https://aroma-bambino.com/
Instagram:https://www.instagram.com/aroma_bambino/

  • 自分のデザインがイマイチに感じる
  • メディアごとに違うデザインになってしまってる
  • デザイン発注がうまく出来ない
  • デザインを誰かに頼みたいけど誰に頼めばいいかわからない

このようなお悩みをお持ちの方へ

PDFのワークに答えていくだけで、
あなたオリジナルのデザイン発注書ができあがる!

\これさえあればデザイン発注ももう怖くない!/
【無料PDF】デザイン発注前に用意しよう!<7つの材料>

  • 自分のデザインがイマイチに感じる
  • メディアごとに違うデザインになってしまってる
  • デザイン発注がうまく出来ない
  • デザインを誰かに頼みたいけど誰に頼めばいいかわからない

このようなお悩みをお持ちの方へ

PDFのワークに答えていくだけで、
あなたオリジナルのデザイン発注書ができあがる!

\これさえあればデザイン発注ももう怖くない!/
【無料PDF】デザイン発注前に用意しよう!<7つの材料>

目次