年: 2021年

Webサイト(ホームページ)オーダーの流れ:その3

Webサイト(ホームページ)オーダーの流れ

こんにちは!
神奈川のWebデザイン事務所、Mihoko DESIGNデザイナーのMihokoです。
Webサイト・ホームページ制作やWebデザイン、ブランディングをお仕事にしています。

Webサイトってどうやって作るの?サイト制作をオーダーしたらこうやって進んでいきますよ。
そんな解説をしていく連載、第3回目です。今回で最終回です。

その1 Step1 コンサルティング Step2 デザインを決める
こちらから

その2 Step3 メインビジュアルのデザインを作る Step4 サイト全体のデザインを作る
こちらから

Step5 満を辞してサイトを構築する

デザインが決まったら、いよいよサイト構築に入ります!
(え、デザインと構築っていう2段回に分かれるの?って方は前回の投稿参照

ちなみに構築というのは、実際にWebサイトをネット上で見れるように作っていく作業のことです。
建築と同じようなイメージで、まさに「組み立て(build)」ていきます!

通常htmlやcssなどコードと呼ばれるものを書いて構築していくのですが、
なんせMihoko DESIGNは一人だけの事務所。そこまで時間をかけれません。

そこで私が時短のため活用しているのは、今海外では既に主流になりつつあるコードを書かずにサイトを作れる「noコードアプリ」です。

これを使うと構築のスピードが桁違い!
まあ、なんというかコードを書くというのはすごく時間がかかるんです。

構築に時間をかけずに済みますので、
時間がかからない=その分お安くできる
これが、Mihoko DESIGNがWebデザイナー歴16年目のプロが一貫で制作を担当するにもかかわらず、リーズナブルな料金で提供できている理由のひとつです。

(Webサイト構築の知識がないとちょっと使うのが難しいプロ用のツールですし、まだまだ日本語の情報も少ないんですが、
使っている仲間同士でサポートし合うサロンにも入っていて、そこでの出会いも楽しいです♪またこのお話もいずれ。)

さて、サイト構築が終わったらクライアントさんに確認をしてもらうべくサイトURLをお送りします!
1番ドキドキする瞬間です!

Step6 最終回!確認と納品とときどき更新レクチャー、まれにアナリティクスレポート作成(長い)

さていよいよ最終Stepです!

サイト構築が終わったら、クライアントさんに確認して頂いて、OKなら納品です

Webサイトは作って終わりではなく、日々の管理が必要です。
最低限、出来るだけ頻繁にサイトを見て頂いて、表示エラーなど何かあったらすぐ連絡頂けるようお願いしています。
納品後1カ月はアフターフォローを行なっています
自分で管理が難しい、、という方はサイト管理保守サービスもご用意してますよ!
ご希望があれば自身で更新作業頂けるレクチャーも行います。

Googleアナリティクス計測がついているプランをお申し込み頂いた場合は、納品後1カ月前後を目安に、サイト計測レポートを作成しお渡ししています。
自分のサイトにどれくらいアクセスがあるかを見るのはビジネスとして運用していくのにとっても大事です!
単品でもお申し込み頂けますのでこちらもぜひご検討くださいね。

さて、サイト制作の流れについて、3回に渡り説明させていただきました!

このオンライン必須時代に、Web制作はなくてはならないものです。

個人でビジネスされている方は一度はWebサイトのオーダーを経験されることになるのではないでしょうか?
少しでも参考になったら幸いです。

Mihoko

Webデザイン・ホームページ制作

Webサイト(ホームページ)オーダーの流れ:その2

Webサイト(ホームページ)オーダーの流れ

こんにちは!
神奈川のWebデザイン事務所、Mihoko DESIGNデザイナーのMihokoです。
Webサイト・ホームページ制作やWebデザイン、ブランディングをお仕事にしています。

Webサイトってどうやって作るの?サイト制作をオーダーしたらこうやって進んでいきますよ。
そんな解説をしていく連載、第2回目です。

その1はこちらから

前回は、Step1 コンサルティング Step2 デザインを決める についてお話ししました。

では続きからいってみましょう!

Step3 メインビジュアルのデザインを作る

メインビジュアルとは、Webサイトを訪れた時に最初に表示される部分。
まずはここのデザインを実際に作成していきます。

どんなデザインにするか、step2でお話しした内容をもとにデザインを作っていきます!

最初からページ全体のデザインを作ってしまうと、クライアントさんも直してほしい、と言いづらくなりますよね。
デザイナーの私としても、修正が大変になってしまいます。
ですので、まず最初に見える部分だけをデザインしていきます。

デザインができたら確認して頂いて修正したいポイントなど教えて頂き調整をかけていきますよ。

デザインの調整が終わり確定となったら、このメインビジュアルのデザインをもとに全体のデザインを作っていきます。

Step4 サイト全体のデザインを作る

メインビジュアルのデザインが確定したら、今度は全体のデザインを作っていきます。

ここでいうデザインとは、見た目のところだけでなく、サイトの構成、レイアウトやページ内遷移の導線なども含みます。

ちなみに私はいきなりサイトを構築するのではなく、AdobeXDというデザインソフトを使ってデザインします。
Photoshopってデザインソフトを聞いたことがある人もいると思うのですが、同じ会社が出しているツールです。

このソフトを使うとサイトを作らなくてもWeb上でデザインを共有でき、コメントを直接書き込めるので、とっても便利なんですよ!
ちょっとイメージしづらいかもしれませんが、これをお見せするとクライアントさんに「プロっぽい!」と言われます(プロです!笑)

ちょっと話がずれましたが笑

Mihoko DESIGNでは、サイトを構築する前に専用のツールでしっかりとデザインを作成することにより、
クライアントさんに実際のサイトをイメージして頂きやすくなるので、
サイトを構築した後に、「ちょっと思っていたのと違った。。。」というミスマッチが起きにくいようにしています。

Mihoko

Webデザイン・ホームページ制作

Webサイト(ホームページ)オーダーの流れ:その1

Webサイト(ホームページ)オーダーの流れ

Webサイトってどうやって作るの?
サイト制作をオーダーしたらこうやって進んでいきます。

こんにちは!
神奈川のWebデザイン事務所、Mihoko DESIGNデザイナーのMihokoです。
Webサイト・ホームページ制作やWebデザイン、ブランディングをお仕事にしています。

サイト制作はほとんどの方がデザイナーなどにオーダーした経験がないと思います。
サイト制作については流れを詳しくこちらのページで説明していますが、、、

「読んでもイメージしづらい、実際どんな感じ?」

そういう疑問もあるかと思います。ですので今回はより簡単にご説明出来ればと思います。

それではいってみましょう!まずは、

Step1 コンサルティング

webサイトをオーダー頂いたら、まず、Webサイトを作った後どう活用したいかをコンサルティングさせて頂きます。
これはデザインより大事と言っても過言ではないです。

Webサイトは「使う」もの。意図通りに活用出来ないと意味ないですよね。

どう使いたいかによって、デザインもシステムも変わってきます。
サーバーはどうするのか?Wordpress(ワードプレス)がいいのか、Wix(ウィックス)がいいのか。
ワードプレスにするとしても、テンプレートでシンプルにつくるのか、完全オリジナルのほうがよいのか。
ここの判断もWebデザインのプロとしてしっかりさせて頂きますよ!

何事も最初の一歩が大事なんですね。

Step2 デザインを決める

Webサイトの用途や目的がコンサルティングで明確になったら、今度はデザインをどうするかをご相談させて頂きます。

Webサイトはビジネスの窓口。お店やオフィスと同じです。

お店にお買い物に行った時、「ここの内装は好み!また来たくなる!」と思ったことはありませんか?

会社に訪問させてもらったとき、
「雰囲気が良いオフィスだな、ここと契約をしたら良いお仕事が一緒に出来そう」
と思ったことがある方も多いかもしれません。

これは「デザイン」の力です!

でもただ闇雲にお洒落なサイトを作れば良いわけではなくて、デザインからオーナーさんやビジネスの個性、良い雰囲気を感じられることが大事です。

どの色がクライアントさまのビジネスに似合うのか、見やすく落ち着くのか。
デザインはシンプルな方がいいのか、ちょっと個性的にした方がいいのか、
ターゲットはどんな方達なのか、
もちろん、クライアントさまの好みもお聞きしながら、デザインを決めていきますよ!

ちょっと長くなりそうなので続きは次のブログでお話ししますね。
それではまた。

Mihoko

Webデザイン・ホームページ制作

Google Analytics(グーグルアナリティクス)レポート制作実績

Google Analytics(グーグルアナリティクス)レポート制作

こんにちは!
神奈川のWebデザイン事務所、Mihoko DESIGNデザイナーのMihokoです。
Webサイト・ホームページ制作やWebデザイン、ブランディングをお仕事にしています。

今日はGoogle Analytics(グーグルアナリティクス)のレポート制作についてお話しさせてください。

Google Analytics(グーグルアナリティクス)。名前は聞いたことがある!という人も多いかなと思います。Webサイト(ホームページ)がどれくらいの人に見られていて、その人達がどこから来てくれているのかなどが分かるツールです。
自分のサイトを分析し集客していくWebマーケティングにはなくてはならない存在です!

ビジネスの内容によって指標とするもの様々なのですが、今回はシンプルに基礎の基礎を説明させていただきますね。

私がどのサイトを分析するときでも必ず使う指標はこちらです。

1.訪問数の合計
⇒一ヶ月など設定した単位での合計訪問数の概算です。
こちらでざっくりと現在のサイトの状況を確認します。
2.日別訪問数
⇒その日ごとの訪問数の概算です。
日ごとの数を見ることで、他の日より目立って数が多い日があれば何が原因かをさらに調べたりします。逆に少ない場合も何か原因があるかもしれないので調べます。
3.参照元別
⇒SNSやGoogle検索などのうちどの方法で自分のサイトに来てくれたか分かります。
例えばInstagramを頑張って更新しているのに参照元として数が少なければ相性が良くないのかもしれません。逆に頑張って更新をしていないのにnoteから来ている人が多いようでしたら、Instagramよりももっとnoteに力を入れるべきなのかもしれませんね。
4.コンバージョン数
⇒サイトで最終的にお客様にしてもらいたいことが達成された数です。
これは後程例を出して説明します。
5.ユーザ属性
⇒年齢や性別など、どのような人が多く来てくれているかを確認します。もし自分がターゲットとして設定している属性以外の方が多かったら、サイトの内容やデザインなどを見直す必要があるかもしれません。

さて、こちらは私のアナリティクスのページの画面です。

左側にメニューがあり、ここから見たい項目や指標を選んだり設定をしたりします。慣れないとちょっと見るのが大変かもしれないですね。

アナリティクスは一週間に一度以上定期的に見て頂いて状況を確認し、集客の改善に繋げて欲しいのですが、いちいち項目を選んで確認するのって、他にもたくさんお仕事がある個人事業主などビジネスをされている方にはちょっと負担になるかなと思います。

そこで・・・、
Mihoko DESIGNではアナリティクスのレポート作成を承っております!


Google Analyticsにはデータポータルというツールがあるんですが、こちらでデータ作成すれば、URLをワンクリックするだけで下記のようなレポートが見れるように出来るんです。

こちらは先日納品させていただいたGirls Leapさまのデータです。(数字を隠しての掲載の許可を頂いています。)

Girls Leapさまはオンラインショップなので、上の基本の指標の「4.コンバージョン数」は「購入数」としています。
オンラインショップではもちろん、サイトの目標として最終的にお客様にしていただきたいことは商品を購入していただくことですね。

コンバージョン=サイトの目標

アナリティクスをちゃんと活用するためには、これをきちんと設定することが大事です!
ビジネスサイトでは、いくら見られている数や訪れている人が多くても、コンバージョンしなければ意味がないので、ぜひアナリティクスレポートを活用して、ビジネスの改善や成長につなげて頂きたいと思います!

レポート作成は現在、Web site Designサービスのスタンダードプランの一つとなっていますが、

Webデザイン・ホームページ制作

単体もしくはオプションでもお申込みいただけます。
アナリティクスの設置、レポート制作のみでもお気軽にご利用くださいね。

因みに先ほどご紹介させていただいたGirls Leapさまですが、サイトの制作もさせて頂いています!
全ての女性に優しく地球にも優しい、ナプキンのいらないサニタリーショーツを販売されています。ぜひご覧ください♪

ではまた!

Mihoko

オンラインストア制作実績:ナプキン不要サニタリーショーツGirls Leap

オンラインストア制作事例:ナプキン不要サニタリーショーツGirls Leap

こんにちは!
神奈川のWebデザイン事務所、Mihoko DESIGNデザイナーのMihokoです。
Webサイト・ホームページ制作やWebデザイン、ブランディングをお仕事にしています。

今日は「ナプキン不要のサニタリーショーツGirls Leap」のオンラインストア制作について書きますね!

ナプキン不要ってすごいですよね!

「自分の娘に生理用品を取り出すコソコソ感を味あわせたくない。」
そんな気持ちから、ナプキン不要のサニタリーショーツ、Girls Leapの商品開発を始めました。

ご自身の小学生の娘さんのために、開発を始めたそうです。

ナプキンを使わなくてもOKなので(多いときは併用をおすすめ)、地球にもとっても優しい。

最近スーパーなどで買い物袋が有料になりましたね。
「ビジネスにサステナブルな取り組みがあること」「サステナブルな商品であること」はもはや今後の必須条件になってきそうです。

デザインについてですが、今回はブランドカラーのコーラルピンクをベースに、アクセントにブルーグレーを使用。日本人女性に可愛いと思ってもらえるデザインにしました!

こちらのサイトはWixを使用しています。

ご依頼いただいた時点で契約されていたのでそのまま使用したのですが、実は私はWixでの構築は初めてでした。
今回使用してみて、感覚的に作成でき、各種設定も簡単で、知識がない方でも管理しやすいと感じました。

最近のスタンダードは未だワードプレスで、よくワードプレスで初心者でも簡単に!という言葉を聞きますが、ワードプレスはそもそもプロ用のツールで使用には少々知識が必要です。

ワードプレスのほうが高度なデザインが出来る場合が多いですが、Wixでも十分な場合が多いので、より管理を簡単にしたい方にはWixもおすすめです!

Mihoko

Webデザイン・ホームページ制作

デザインコンサルティング実績:電動鼻洗浄機サイヌパルスジャパン

こんにちは!
神奈川のWebデザイン事務所、Mihoko DESIGNデザイナーのMihokoです。
Webサイト・ホームページ制作やWebデザイン、ブランディングをお仕事にしています。

今回はなんと海を越えアメリカからのご依頼!
アメリカ在住の日本人の方で、日本向けにアメリカの製品を販売しているのだけど、ホームページや商品紹介の画像、FacebookなどのSNSバナーのデザインをどうしたらいいのか助けてほしい、とお申込みいただきました。

商品は「電動鼻洗浄機サイヌパルス」

なんとレビュー2300件超の商品です。
ポンプ式のものと比べ、優しく洗えるのに強い洗浄力で、花粉症だったり鼻にトラブルを抱えやすい方におすすめだそう。アメリカではスポーツチームの選手の方々も健康管理に使っているとか。

お話しをお伺いし、まずはデザインをどうにかしたいというお悩みに対応すべく、デザインコンサルティングをさせて頂くことになりました。

Mihoko DESIGNでは、デザインコンサルのお申込み後、まず、前もってちょっと長めのヒアリングシートに記入していただき、ご自身とご自身のビジネスについてお応え頂きます。コンサルティング当日の時間を有効に利用するためです。

そして、コンサルティング当日はヒアリングシートにお応えいただいた内容をベースに深堀りする形でカウンセリングしつつ、ターゲットやトンマナを言葉で決めたら、デザイン作成の前にまずはムードボードを一緒に作成。

ムードボードとはこういうもの

これはMihoko DESIGNのムードボードです。
因みに今(2021年1月)の当Webサイトのデザインはこちらをもとに作成しています。

ムードボードを作成することによってイメージの方向性を確定させます。言葉にできないデザインのイメージを色や画像を使い1枚のボードに集約させて作成し、これをイメージソースにWebサイト(ホームページ)やSNSなどバナー画像のデザインを展開していくのです。

今回はコンサルティングの結果、ちょっとプレミアムな商品であることをデザインでも分かるように伝えていこう、となりました。
そして鼻洗浄機という商品を使った時のさわやかさも伝わるようなデザインに、と。

この色がいいかな、こっちの方が好みですね。など色々とお話しをしながら、コンサルティング中に一緒にデザインを作成していきます。そしてある程度デザインが決まったらコンサル終了。
コンサル後に細部までしっかり仕上げて、完成しお渡ししたデザインはこちら!

デザインコンサルティングでは、最終的にSNS用画像やWebサイトのカバー画像などバナー画像程度のものを一つお作りしお渡しするのですが、今回はWebサイト(ホームページ)のメインビジュアル画像で、とご依頼いただいたきました(クリックするとWebサイトに飛びます)。

ちょっと時間が余ったので、特別にFacebookページの画像用にもリデザイン、リサイズ。

こちらはすべてCanvaで作成しました。
作成後はデータを共有させていただき、ご自身でもバナー画像などに展開できるように、簡単ですがレクチャーもさせていただきます。

今回納品後のアンケートでは、「大変満足である」といただきました・・!

今回思い切って申し込んだところ日程の設定も含めスムーズに進み、思いがけないサイトについても案内してもらえ、さらに画像も作ってもらえ、期待以上の満足です。

と頂きました!
完全オリジナルのサービスである、Mihoko DESIGNのデザインコンサルティング。お喜びいただけたようで本当に嬉しかったです!

もし、デザインでお困りのことがあれば相談にいらっしゃいませんか?
デザインを強化することは共感と伝える力を強化すること。あなたのビジネスにデザインの力を取り入れましょう!お待ちしております!

Mihoko

映画WAVESから学ぶ-感性を刺激するデザインをビジネスに活かそう-

映画WAVESから学ぶ-感性を刺激するデザインをビジネスに活かそう-

こんにちは!
神奈川のWebデザイン事務所、Mihoko DESIGNデザイナーのMihokoです。
Webサイト・ホームページ制作やWebデザイン、ブランディングをお仕事にしています。

この記事は私のnoteの2020年7月の記事をリライトをしての再掲載です。

先日(2020年7月時点)「WAVES」を見に行ってきました。タイトルは聞いたことはあったものの、友人に誘われてなんとなく行ったのですが、とても良かった・・!

WAVES 作品情報はこちら>>

「ムーンライト」「ミッドサマー」など、話題作を続々と世に放つ気鋭のスタジオ「A24」。芸術性と娯楽性を高い次元で両立し、見る者の“言葉にはできない感情”を繊細に刺激する作風で知られている。
世界中の映画ファンが待ち望むA24の新作が、7月10日に日本公開を迎える。タイトルは「WAVES ウェイブス」。ジャンルは“プレイリスト・ムービー”だ。31の音楽が躍動し、ひとつの物語を紡ぐ。メロディや歌詞がドラマとシンクロし、登場人物の心の声を観客に伝える。
※映画.comより

映像と音楽とストーリー、とにかく全てに心を揺さぶられる135分でした!

いわゆる映画の「作られたストーリーを見ている」という感じではなく、すべてがとてもリアルに感じたのは、最初から最後まで常に登場人物の心と共鳴し続けていたからでしょう。

エモいという言葉が流行ったのが記憶に新しいですが、今「本当に感性をゆさぶられること」を皆が求めていると感じます。
「作られたもの」ではそれを感じることが出来ません。
なのでInstagramやYoutubeでもライブ配信が流行ったりしているのだと思います。

Webデザインでも同じことが言えるなと感じています。
ここ数年、Webデザイン業界ではフラットでシンプルなデザインが主流でした。
シンプルであることは美しさの基準でもあるし、内容が見やすいのでいいのですが、最近、それだけではどうにも物足りない気がしてきています。整頓されすぎていて、どのサイトも同じに見えるのです。

こちらのWeb関連の記事をみてください

ちょっと前の記事ですが。
海外では2019年ごろより、見た人の感情を刺激するようなエモーショナルなデザインがトレンドになってきました。
鮮やかな色あいのグラデーションが流行しているのもその流れではないかなと思います。色って気持ちと連動していますよね。

ユーザーとのつながりをつくることが、エモーショナルデザイン(英: Emotional Design)のすべてです。
感情的なつながりは、喜びと悲しみ(英: Joy and Sadness)、信頼と嫌悪(英: Trust and Disgust)、恐怖と怒り(英: Fear and Anger)、驚きと期待(英: Surprise and Anticipation)の基本的な4つのカテゴリーに分類されます。ユーザーとのつながりを築くために、自分のプロジェクトがどのグループに属しているのか考え、色や画像、ユーザーインターフェースなどに利用してみましょう。

※上記サイトより引用

綺麗なだけではない、「お客様にピンと来てもらえる」デザインのカギはエモーショナルなデザインにあると思います。

最近SNS上でもビジネス界隈でもよく言われているのが、「共感」。
共感を呼び込むアプローチがビジネスを広げるのに不可欠になってきています。

それにはビジョンを持ちライティングを強化し、想いをしっかりと発信していくことが、とても大切。
そして私はさらに「デザインでも共感を呼び込むこと」が出来たら、ビジネスの大きな力になると信じているのです。

ぜひWebデザインやホームページ制作を通して、あなたのビジネスのデザインを強化するお手伝いをさせてくださいね。

Mihoko

Webデザイン・ホームページ制作