WEBサービス WEBデザイン WEB制作

WEBトレンド+αの作り込みで、心地よさが広がる素敵サイトをご紹介! ~素敵サイトの旅 その1~

投稿日:2014年12月15日 更新日:

こんにちは!風邪っぴきのweb初心者Kです。

週末に風邪を治しきれず、咳のため未だマスクが手放せません。
今日は誰とも口をきけないかも知れない!!!

みなさまはお風邪など召されていませんか?

さてさて、そんな私ではありますが、
今日はwebデザインのトレンドだけにとどまらず、
1pxまで神経が行き届いているなぁ、
と感じる緊張感のあるデザインのサイトをご紹介したいと思います!
ワクワク。
まずひとつめはコチラ!<全面画像+ポリゴン+α>

http://rinn.co.jp/

ワイド画像や背景の装飾にポリゴンなどトレンドをさりげなく取り入れています。
特にポリゴンの使い方は、空間に広がりを感じさせる
動きやサイズ感のバランスが絶妙で、センスがキラリと感じます。

また、上記企業の商品サイトもこちらにあります!(↓下記)

http://petly.jp/

どちらのサイトもベースカラーは無彩色ながら、装飾の動きや、
写真の柔らかいトーンから無機質さを感じさせません。

また商品サイトは文字を読まなくてもどんな商品なのか一目瞭然のスゴさ!!
しかもページ下にすごいスピードで走っている猫ちゃんのイラストが
常に表示されていて、なんだろう??とつい先を見てしまいます。
ページの最後では、猫ちゃんがこちらの商品(自動給餌器)に
たどり着くんですが、この演出に、私は心をがっつり掴まれました。
このサイトを見たら飼い主まっしぐら!なハズ!!

 

そして、お次の素敵サイトはこちら!<ワイド動画+α>

http://www.audio-technica.co.jp/atj/sc/msr/

動画をワイドに使ったトレンドを取り入れているだけでなく、
ナビゲーションの動き・使い勝手など、
見習いたい繊細な心配りを感じます。

また、同じようにナビゲーションが
途中から固定になる縦長サイトはこちら

http://housevision.muji.com/

http://www.shimofuri-ginza.com/

http://haremachi.com/hanpu/

とっても使いやすいですので、
この動きは縦長サイトには定着しつつあるように感じます。

その他にも個人的には、グリッドデザイン+αで、
グリッド内の写真がマウスオーバーで少し拡大される動きを
よく見かけるようになった気がします。

http://www.felissimo.co.jp/500/

http://www.nintendo.co.jp/

http://nike.sskamo.co.jp/

トレンドもとても大切ですが、+αで細かいところまで気配りがされているサイトは、
ついつい長居したくなってしまいますよね!

いかがでしたでしょうか?

私もたくさんの方に「お・も・て・な・し」が、感じられるようなサイトづくりを心掛けて、
日々精進したいと思います!

 

そしてそして、もしこのブログをご覧になった方で素敵サイトづくりにお悩みでしたら、

マーカネット株式会社にてホームページ制作やご依頼を承っておりますので、

お気軽にこちらからご相談ください!

 

ではでは、本日の素敵サイトの旅はこれにて。

ドロン!

-WEBサービス, WEBデザイン, WEB制作

関連記事

【意外と知られていないIllustrator小技】たったの2STEPで画像をベクターに変換!

【意外と知られていないIllustrator小技】たったの2STEPで画像をベクターに変換!

WEBサイトのデザイン素材を紙媒体に使うとき、ベクターのデータがなくて困ったことありませんか? ペンツールでトレースするのも時間がかかるし、Photoshopでパスを作成したら境界がギザギザになってし …

【CSS3】簡単なドロップシャドウや光彩(グロー)の付け方!

【CSS3】簡単なドロップシャドウや光彩(グロー)の付け方!

デザインを格好よくするためにシャドウを付けたりしますよね。 しかし、サイズが異なるたびに画像を背景に指定したりしなければならないのは大変です。 しかも、シャドウの幅の分だけはみ出ているということもあり …

adobe photoshop 便利すぎる生成塗りつぶし機能のご紹介!!

adobe photoshop 便利すぎる生成塗りつぶし機能のご紹介!!

こんにちは、デザイナーのAです! 今回はAdobe Photoshopの「生成塗りつぶし」についてご紹介します! 「生成塗りつぶし」は選択した領域を自然に塗りつぶすことができる機能です。 具体的には、 …

WEBサイトの変更内容が確認できない場合のブラウザキャッシュクリアについて

WEBサイトの変更内容が確認できない場合のブラウザキャッシュクリアについて

ブラウザ別にキャッシュクリア方法をご説明致します。 キャッシュとは 訪問したウェブページを一時的に保存しておくブラウザの機能です。再度同じページへアクセスしたときにページの表示スピードが上がるメリット …

【複数SNS利用者必見!】「Everypost(エブリーポスト)」でラクラク投稿

【複数SNS利用者必見!】「Everypost(エブリーポスト)」でラクラク投稿

Facebook、Twitter、Google+、Tumblrなど、 数年の間でSNSの数もぐっと増えてきましたね。 その数と共に個人で所有するアカウントも増えるわけですが・・・ 同じような投稿をそれ …