弊社のWebデザインのサンプル集です。
このデザインを使ってみたい方は、ご一報ください。

HOME ＞ギャラリー

ちょっと変わったものから、オーソドックスなものまで、様々なデザインを取りそろえました。
色の変更、画像の変更はもちろん、デザインの組み合わせの変更、コンテンツの入れ替えも自由自在。
新しく作るWebサイトに使ってみたいという方は気軽にご相談ください。

＊すべてレスポンシブWebデザインです。PCだけでなくスマートホンなど他のデバイスでもご覧いただけます。　＊デザインのサンプルですので、TOPページしかないものがほとんどです。　＊コピー・写真などの画像はすべてダミーです。　＊ロゴは仮で弊社のものを入れています。　＊ロゴをクリックするとTOPページへ遷移します。その他のリンクは機能していません。（#01・#02のみグローバルボタンが機能しています）

#01

コンテンツがグルグル回ったり、ページ遷移のときに意外な動きをする作品です（PCとスマートフォンやタブレットと動きが異なります）。スクロールなしを前提に作ったので、掲載できる内容は限定されますが、インパクト重視の方には最適。あるいはLPに使ってもいいかもしれません。

View Demo

#02

右ページに写真、左ページに文章。そんなデザインの会社案内をWebサイトで表現しました。スクロールすると右側が下へ、左側が下にスクロールします。不思議な感覚なので試して見てください（スマートフォンで見た場合は左右が狭くなるので、コンテンツ・写真の順にスクロールします）。

View Demo

#03

当Webサイトのもとになったデザインです。ヒーローイメージ（メインビジュアル）を動画にし、「New Service」のカコミやスクロールしても残る画像など視差効果を随所に入れました。当Webサイトと合わせてご覧ください。マウスオーバーで反応するボタンアニメーションもお試しください。

View Demo

#04

パーティクルを使ってみました。点々の集まりの球体と左から右にゆっくり流れる点々で構成されています。横に流れる点々はマウスオーバーで大きくなり、クリックすると爆発します。お試しください。

View Demo

#05

奇をてらうのではなく、あくまでシンプルなデザインを目指しました。デザインの肝は縦の細い線です。この線に沿って（あるいはわざと外して）画像やコピーを配置することで“きちんと感”を出しています。特に信頼感を強調したい企業には最適のWebデザインです。

View Demo

#06

背景に時間と共に変化するグラデーションを配し、その上に線画を載せました。線画は、かつて音速の貴公子と言われていたアイルトン・セナが乗っていた、F1マシンの「マクラーレン・ホンダ MP4/5」です。スクロールすると横から飛び出してくる4つの要素も注目です。

View Demo

#07

#05と同様に背景は時間と共に変化するグラデーションを配しました。スクロールすると横から飛び出してくる4つの要素も同じです。違うのは線画だけで、歯車を描いてみました。線画は精密な雰囲気が出せるので、機械や電気など技術力が売りの業種には合うかもしれません。

View Demo

#08

#05・#06と同様に、こちらも背景は時間と共に変化するグラデーションを配しました。その上に点と点を結ぶ線。この点と線の固まりは、マウスの動きで三次元的に回転しながら拡大したり縮小したりします。この点と線の固まり他にも使い道があるかも。近いうちに試して見ます。

View Demo

#09

こちらの背景は、時間と共に変化するグラデーションではなく、斜めにスライドする板です。最も下層に青を配し、その上で透明度の異なる緑の板を動かし、重なり具合の面白さを出しています。もちろん地の色や上で動く板の色を変えても使えます。その他は＃06と同じです。

View Demo

#10

背景は下から四角形や三角、ドーナツ型などの図形が回転しながら次々と現れ、上に登って消えていきます。ページを読み込むと同時にメインタイトルが上から落ちてきて、メインタイトルの周りに三角や四角の図形が表れます。この図形はページを読み込む度に配置が換わります。

View Demo

#11

“Block Reveal Effects”と言うそうですが、何もなかったところに長方形が表れ、それがスライドすると要素が表れるというワザです。ヒーロー画面上の文字はページの読み込みに合わせて現れ、その下の文字や画像は下にスクロールすると現れるように設定しました。

View Demo

#12

こちらも“Block Reveal Effects”を使った例です。#09とは写真や文字の色だけが異なり、あとはすべて同じです。こちらは、今年2月に行ったベトナム（ホーチミン）旅行で撮影した写真を使いました。ちなみに、Section01・02の写真は「ホテルマジェスティックサイゴン」です。

View Demo

問い合わせ、相談、見積依頼はこちら

仕事の相談や見積もり依頼、各サービスに関する相談・質問など、
気軽にご連絡ください。

弊社のWebデザインのサンプル集です。 このデザインを使ってみたい方は、ご一報ください。

#01

#02

#03

#04

パーティクルを使ってみました。点々の集まりの球体と左から右にゆっくり流れる点々で構成されています。横に流れる点々はマウスオーバーで大きくなり、クリックすると爆発します。お試しください。

#05

#06

#07

#08

#09

#10

#11

#12

弊社のWebデザインのサンプル集です。
このデザインを使ってみたい方は、ご一報ください。