サイトのリニューアルをしました！
こんにちは、Webクリエイターボックスというブログを書いている、WebデザイナーのManaです。今回こちらN1ku Meet5の中の人、@N1kuch1さんよりサイトリニューアルのご依頼を頂きました！デザインや機能などの変更点を少し紹介したいと思います。
参考画像。こちらが以前のデザインです。
デザイン面
デザイン面での依頼内容は主に以下の３点でした。
- ロゴデザインの変更
- 赤・黒以外の色で
- マウスオーバーを暑苦しくしない程度に派手に
前のデザインではシンプルすぎて物足りない部分があったり、「サイトをもっと印象づけたい！」という要望から、今回のリニューアルデザインのテーマは「動き」と「インパクト」です。依頼内容とあわせて説明してみます。
ロゴの変更
前のサイトで使用していたロゴは、セリフフォントにドロップシャドウを加えただけのシンプルなもの。まず、少しインパクトに欠けるなあと感じたので、筆記体＋文字の配置を少し変えて動きをつけてみました。また、「N1ku Meet5」だけでは読み方がわかりづらいかなあというのがあったのでカタカナでふりがなもつけました。
配色
メインサイトである松阪牛専門店松阪牛.comでは赤・黒をメインカラーとして使用しているため、このサイトとは違う配色でガラリとイメージを変えてほしいとの事。暖色系や青を使ったブログはたくさんあるので、あまり見ない紫×黄緑のインパクトのある配色にしました。ベースを灰色＋黒に使い、アクセントとして色付ける事でうるさすぎないデザインになったと思います。
マウスオーバーを暑苦しくしない程度に派手に
かちびと.netさんのように、マウスオーバー時に動きをつけて欲しいとの事でした。jQueryを使って動かしています。
マウスオーバーでくるっと回転。
色が徐々に変化したり。
画像が傾いたり。
機能面
機能面では基本的に現状維持のまま、さらに便利になる点があれば機能を追加していきました。ご依頼頂いたのは下記二点。
- 機能・プラグインはそのまま使用
- 更新・カスタマイズしやすく
機能・プラグインはそのまま使用
リニューアル前に使用していたプラグインは、過去記事「稼働中の激選27個のWordpressプラグイン」でまとめてくださっていたので、ほぼそのまま使用。いくつか新しく追加しました（後ほど紹介します :) ）。
更新・カスタマイズしやすく
「Thumbnail for Excerpts」というプラグインを使用しました。このプラグインでは記事内で最初に使われた画像をサムネイル画像として自動的に表示されます。サムネイル画像を設定する手間がはぶけ、更新がとっても楽です。
カスタムウィジェット
サイドバーとフッターにカスタムウィジェットエリアを設置しました。管理画面の外観 > ウィジェットから表示させたいコンテンツをドラッグ＆ドロップするだけで選ぶ事ができるので、カスタマイズが簡単です！
サイドバーにタブを追加
サイドバーウィジェットには「sidebarTabs」というプラグインを使ったタブ機能も追加しました。長くなりがちなサイドバーをコンパクトに収めることができます。こちらも管理画面のウィジェット設定ページからドラッグ＆ドロップするだけ設定・変更可能。
いかがでしょう？バグ報告は私、Mana宛にご連絡頂けると嬉しいです！
Webデザイナー Mana
今回の記事は、お友達に推奨できるくらいご満足していただけるものでしたでしょうか？何かいただけるとブログ更新の励みになります(^_^)♪
改善点がありましたらご指摘頂けますと幸いです。頂いたフィードバックを元に、
より良い記事を書けるように頑張ります。
アドバイスを頂ける方は、「コメント」欄より宜しくお願い致しますm(_ _)m
今度こそ公開です。よろしくです！！サイトのリニューアルをしました！ | n1kumeet5 http://t.co/idzz1SY via @N1kuch1
ブログ更新/サイトのリニューアルをしました！ | n1kumeet5 http://t.co/idzz1SY via @N1kuch1
今度こそ！！よろしくです。サイトのリニューアルをしました！ | n1kumeet5 http://t.co/uPfzGjm via @N1kuch1
えー！Manaさんに依頼したんですか！すごいカッコイイ！｜サイトのリニューアルをしました！ | n1kumeet5 http://t.co/2pBohI7 via @N1kuch1
リニューアルおめでとうございます！うらやましいくらいにかっこいいヾ(๑╹◡╹)ﾉ"！→サイトのリニューアルをしました！ | n1kumeet5 http://t.co/mFBv94v via @N1kuch1
まさかのマナさん登場です(^_^)♪@JUNP_N えー！Manaさんに依頼したんですか！すごいカッコイイ！｜サイトのリニューアルをしました！ | n1kumeet5 http://t.co/uPfzGjm via @N1kuch1
まさかのマナさん登場です(^_^)♪えー！Manaさんに依頼したんですか！すごいカッコイイ！｜サイトのリニューアルをしました！ | n1kumeet5 http://t.co/2pBohI7 via @N1kuch1 / サイトのリニュ… http://htn.to/o6cnBQ
サイトのリニューアルをしました! | n1kumeet5 こんにちは、Webクリエイターボックスというブログを書いている、WebデザイナーのManaです。今回こちらN1ku Meet5の中の人、@N1kuch1さんよりサイトリニュ…http://bit.ly/nxmBDA
ありがとうございます。かっこやくしてもらいました♪(´ε｀ ) RT: @otaman517: リニューアルおめでとうございます！うらやましいくらいにかっこいいヾ(๑╹◡！→サイトのリニューアルをしました！ | n1kumeet5 http://t.co/mFBv94v via
サイトのリニューアルをしました！ | n1kumeet5: こんにちは、Webクリエイターボックスというブログを書いている、WebデザイナーのManaです。今回こちらN1ku Meet5の中の人、@N1kuch1さんよりサイ… http://bit.ly/pcIk5u
デザイン・制作・寄稿させて頂きました :) ／サイトのリニューアルをしました！ | n1kumeet5 http://ow.ly/5Zlzs
デザイン・制作・寄稿させて頂きました :) ／サイトのリニューアルをしました！ | n1kumeet5 http://ow.ly/5Zlzs
デザイン・制作・寄稿させて頂きました :) ／サイトのリニューアルをしました！ | n1kumeet5 http://ow.ly/5Zlzs
あぁ、いいなぁ。こういうの作れるようになりたいな || @webcreatorbox: デザイン・制作・寄稿させて頂きました :) ／サイトのリニューアルをしました！ | n1kumeet5 http://t.co/sMC0YUx
ありがとうございます。 RT: @webdesignStatio: サイトのリニューアルをしました! | n1kumeet5 こんにちは、Webクリエイターボックスというブログを書いている、WebデザイナーのManaです。サイトリニュ…http://bit.ly/nxmBDA
サイトのリニューアルをしました！ | n1kumeet5 http://bit.ly/qO21Il
サイトのリニューアルをしました！ | n1kumeet5 http://htn.to/GZa1ro
サイトのリニューアルをしました！ | n1kumeet5 http://bit.ly/r8wNkg #webdesign
[はてブ：IT] サイトのリニューアルをしました！ | n1kumeet5 http://dlvr.it/fZMH6
http://n1kumeet5.com/2011/08/website-renewal/ サイトのリニューアルをしました！ | n1kumeet5
サイトのリニューアルをしました！ | n1kumeet5 http://htn.to/93qcEn
いいなー。うちのサイトもManaさんにお願いしたいですし(●´ω｀●) / サイトのリニューアルをしました！ | n1kumeet5 http://htn.to/tLcWRb
サイトのリニューアルをしました！ | n1kumeet5 http://bit.ly/mQCPOA
サイトのリニューアルをしました！ | n1kumeet5 http://bit.ly/pcIk5u
サイトのリニューアルをしました！ | n1kumeet5: こんにちは、Webクリエイターボックスというブログを書いている、WebデザイナーのManaです。今回こちらN1ku Meet5の中の人、@N1kuch1さんよりサイ… http://bit.ly/q1MIwH
サイトのリニューアルをしました！ | n1kumeet5 http://bit.ly/pa2e6p #jqueryjp
サイトのリニューアルをしました！ | n1kumeet5 http://bit.ly/r8wNkg #wordpress
サイトのリニューアルをしました！ | n1kumeet5 http://bit.ly/pcIk5u
サイトのリニューアルをしました！ | n1kumeet5: こんにちは、Webクリエイターボックスというブログを書いている、WebデザイナーのManaです。今回こちらN1ku Meet5の中の人、@N1kuch1さんよりサイ… http://bit.ly/pcIk5u
デザイン・制作・寄稿させて頂きました :) ／サイトのリニューアルをしました！ | n1kumeet5 http://ow.ly/5Zlzs
フムフム | サイトのリニューアルをしました！ | n1kumeet5 http://t.co/2z0TqJ2 via @N1kuch1
くるくるボタンもかわいいけど左下に出てくるページトップボタンもかわいい。丸っこいのいいですなぁ / サイトのリニューアルをしました！ | n1kumeet5 http://htn.to/PvB1xT
サイトのリニューアルをしました！ | n1kumeet5 こんにちは、Webクリエイターボックスというブログを書いている、WebデザイナーのManaです。今回こちらN1ku Meet5の… http://goo.gl/fb/auiKK
デザイン・制作・寄稿させて頂きました :) ／サイトのリニューアルをしました！ | n1kumeet5 http://ow.ly/5Zlzs
サイトのリニューアルをしました！ | n1kumeet5 B! http://j.mp/pv0mbE
『サイトのリニューアルをしました！ | n1kumeet5』 http://n1kumeet5.com/2011/08/website-renewal/
サイトのリニューアルをしました！ | n1kumeet5 http://htn.to/JfVBNm
サイトのリニューアルをしました！ | n1kumeet5: うちは暑苦しさが売りです http://t.co/IEZIntd
うおー凝ってるなぁ。 "サイトのリニューアルをしました！ | n1kumeet5" http://t.co/f78Ur0i
おおお、Webクリエイターボックスのmanaさんのデザインだったのか。見やすくて好きだなあ。 http://t.co/WvtVOH8
おおお、Webクリエイターボックスのmanaさんのデザインだったのか。見やすくて好きだなあ。 http://t.co/WvtVOH8
こういう風に、他のデザイナーが「どんな想定でどんな風にしたいからどんな風にした」っていう過程はすごく参考になるなあ / サイトのリニューアルをしました！ | n1kumeet5 http://t.co/JbFr4VQ
へー、Webクリエイターボックスの方にデザイン依頼したのか。いくらだったんだろう（そこかいっ）。 / サイトのリニューアルをしました！ | n1kumeet5 http://t.co/qEMnLM2
サイトのリニューアルをしました！ | N1kuMeet5 http://t.co/2tSuKje