creatersnest

女性らしいテイストのサイトを作るときのコツまとめ


女性らしいサイトを作成するならこの3つ!
「写真加工」「素材」「色」
これだけでガリーにもエレガントにもKawaiiにも活用できる!
Webデザイナーなら知っておきたい3つのポイントを紹介

「写真加工」

web_701

サイトに必要なもの、それはキレイな画像。写真が重要です!
その写真をどうみせるかでイメージはかなり違ってきます。
もちろんPhotoshopが使えるのが1番ですが誰でも出来る簡単な方法を教えます。
では、女性らしいサイト作りにはどんな写真の加工がいいのかをご紹介します。

iphoneアプリ

最近はSNSなどに投稿するために簡単に加工できるアプリがいっぱい出ています。
そのアプリで飾りや色合いまですべて加工が出来てしまいます。
Photoshopが使えない。なんて人もアプリなら簡単に編集できます。
その画像を制作しているPCにメールなどで送って使用すればOK!!

instagram

最近はSNSなどに投稿するために簡単に加工できるアプリがいっぱい出ています。
そのアプリで飾りや色合いまですべて加工が出来てしまいます。
Photoshopが使えない。なんて人もアプリなら簡単に編集できます。
その画像を制作しているPCにメールなどで送って使用すればOK!!

wix

こちらは無料のホームページ作成サイトです。これでホームページを作るのではなく、今回は写真の加工。
かなりの無料画像があり、それを簡単に編集ができます。
必要なサイズに加工してそれをそのままサイトに使えます。
実はわたしもデザイナーで写真の加工にこのサイトのツールだけ使用していました。
フォーカスの加工がおすすめです。
http://ja.wix.com/

無料素材

写真の加工技術がなかなか難しいという方には無料の素材を使用してみてはいかがでしょうか?
素材の中にフレームがあります。そのサイズに写真をカットするだけでなんだかおしゃれに見えます。
こちらもスキルはいらないです。簡単にフレームはめてしまいましょう。

モデルの統一

これは写真の加工のお話ではないんですが、モデルを同じ方にする。
これだけでも実はイメージが揃い、キレイなサイトになります。
もちろんイメージにあったモデルさんを選ぶことは必要ですが、結構素人さんでも統一感があるだけで一体感のあるサイトになります。

「素材」で女性らしいイメージにする。

web_702

女性らしい素材はいろいろなモチーフがあります。
それによってイメージも雰囲気も違って見えます。
女性はデコるの大好きですよね。そんな素材をご紹介します。

レース

こちらのサイトではレースの素材がいっぱいあります。
写真の上に乗せてみたり、背景に透かしてみたりと使い方は色々。
レースを少しサイトに反映するだけでなんだか女性らしいエレガントさがUPしますね。
http://sozaico.net/

リボン

かなりこちらのサイトはわたしは利用させてもらっています。カワイイを作るには欠かせない素材がいっぱい載っています。
リボンといっても素材が豊富です。
また使用用途もさまざまです。これだけでアイコンになったりバナーに使えたりもします。
かなり重宝しますし、サイトのイメージも一気に可愛くなります。
http://hibana.rgr.jp/sozai-icon-ribbon.shtml

マスキングテープ

こちらもかなり使用させてもらっています。簡単にDLできその素材の豊富さに毎回デザインする時にはかどっています。
素材感を統一させてもみたり、ドットで統一、ストライプで統一など自分でその度にテーマを決めて使用しています。
おしゃれに加工した写真の上にペタっと貼る感じなんかもいいですよね。
女性らしいデコるサイトにはかなり活躍してくれるアイテムです。
http://hibana.rgr.jp/sozai-icon-tape.shtml

飾り枠

こちらのサイトは飾り枠ですがエレガントに仕上げたい方には向いています。エステやネイルなどのサロンのクライアントに使用した経験があります。ネイルの写真のサンプルの枠にして載せたりなど、これだけでも高級感が上がります。見出しや吹き出しの変わりに使用するのもいいですね。
http://frames-design.com/

フラワー

お花のモチーフは画面が一気に華やかになります。女性らしいサイトにはよく使用していました。
アイコンとして箇条書きの円の変わりにしたり、メニューバーの文字の前に入れたりと使い方も様々。
お花も種類が多いのでサイト内でもページで仕分けてみたりしてもいいですね。
http://flode-design.com/

なんといってもサイトのイメージは「色」で決まり!

web_703

色はかなりサイトを左右するポイントです。何色のサイトにするのか、何色をメインにするのか?など背景1つでも全然顔が変わってきます。では、その「色」をどう決めればいいのか?女性らしいサイトになるようにいくつかご紹介します。

パステルカラー

これはいうまでもなく淡い色の統一。特に淡い色にしているサイトは優しさなどが伝わって女性らしさを演出できそうです。心理カウンセリングの先生の個人サイトで使用した経験があります。あまりキツイ色がなく柔らかい色が良かったのかもしれませんね。色でそのサイトのイメージ付けは必要ですね。

ワインレッド

一見、ワインレッド!?女性らしい?と思われるかもしれませんが、美容商材のサイトで作成した経験があります。
少し気品のある女性、凛とした女性というイメージに仕上がりました。白背景にワインレッドはとても映えて美しいサイトになります。
参考になるのが資生堂のサイトです。こちらもワインレッドに白背景。美しい女性というイメージですね。
http://www.shiseido.co.jp/cms/onlineshop/

アイス・シャーベット色

こちらはパステルカラーに近いイメージですが、若干子供っぽさがでます。ストロベリー色。ソーダ色。バナナ色。白ではなく、バニラ色。この美味しそうな色がパステルカラーよりかわいらしく仕上がります。色に迷ったら好きなアイスクリームを思い浮かべてみて下さいね。きっとかわいくPOPな仕上がりになるでしょう。

ピンク系

なんといっても人気のピンク系!女性らしいサイトで色に悩んだらとりあえずピンクで間違いないくらいですね。
ピンクといってもいろいろなピンクがあります。そのトーンの違いだけでピンク1色だけでもサイトは仕上がります。
ピンクのサイトはかなり作りましたが2で紹介したモチーフで全然イメージが変わります。
ピンクに白のレースや、ピンクに水色のリボンや、モチーフとのバランスでカワイイにもエレガントにもゴージャスにもなります

ブラック背景

女性らしいサイトに黒は実は写真が映えてキレイなんです。
背景を黒にして写真を目立たせるコンセプトはとっても美しくし上がります。
特に素材も目立つので素材のモチーフを決めるとそのサイトのテーマもブレずに作れます。
パピオンや真珠、ジュエリーなどをモチーフにするととてもラグジュアリーなサイトになります。
気品ある女性のサイトという感じです。

まとめ

サイトの作成はまず真っ白な中からはじまります。それをどう仕上げて行くか、まずコンセプトやイメージを決めてターゲットを決めます。
そのターゲットにあったサイトもこの3つ「写真加工」「素材」「色」さえ抑えれば統一感ある女性らしいサイトになります。
Kawaii?ゴージャス?ガーリー?どんなサイトでも使える3つのポイントをご紹介しました。
参考にしていただければうれしいです。

本サイトが運営するWebデザインのオンラインスクールが公開中!
以下のリンクからお申込みで、特別料金の70%OFF!

未経験からプロのWebデザイナーになる! 400レッスン以上の完全マスターコース
こちらのコースは全くの未経験の方が、プロのWebデザイナーとして働けるレベルになることを目的としたコースです。
・全422レッスン & 42時間! 通学スクール80万円相当の内容
・授業×チャレンジ課題で実践的なスキルが身につく!
・過去1100名以上のスクール卒業生を輩出した、 Webサービス運営企業・デザイナー輩出企業だからこそ作れるプログラム

Webやアプリの最新デザインツール Sketch3 |100レッスンの完全マスターコース
Sketch3未経験からプロレベルを目指す、充実したコースです。
Sketch3の単なる機能説明をするような、つまらないコースではなく、アイコン制作、ボタン作成、メインビジュアル制作、Webページの制作など、実際の制作をしながら実践力を身につけます。
1000名以上の卒業生がいる実績ある日本のWebデザインスクールが提供しています。


yamatama

紙面のデザイナーからWebデザイナーに転身。紙媒体とWebの違いに戸惑いながら制作・Web解析を学んできました。 現在はフリーで活動中。 一児の母(小学生の娘)

Next Article【2015年版】今、デザイナーが使うべきChromeの拡張機能まとめ