工程、流れ
ハレノヒサイクル
シンプルですがきれいにまとまったデザイン。 明度の高い色の組み合わせで難しいはずですが、うまくデザインされていてすごいです。
ハレノヒサイクル
https://harenohi.hellocycling.jp/
コンテンツメニュー
ハレノヒサイクル
右、左のテンポは全体としてバランスを保つのによく使われます。 黄色いラインが全て違うデザインになっているのにこだわりを感じます。
ハレノヒサイクル
https://harenohi.hellocycling.jp/
ニュース・ブログ一覧
リベロホーム
あえて片側しか使わないアシンメトリーなパターンは多いですね。 単調なデザインには、こういったアクセントとなるレイアウトを入れるといいでしょう。
リベロホーム
https://liberohome.jp/
メインビジュアル
おこもり山女魚
高級感を演出する、縦書きと明朝体の組み合わせ。 印影がこだわりとブランドを感じさせます。
おこもり山女魚
https://okomori-yamame.com/
コンバージョン
アプリコットデザイン
日付を使ったわかりやすい表現。イベントのお知らせにも使えそうなデザインです。
アプリコットデザイン
https://apricot-design.com/
ギャラリーコンテンツメニューコンテンツ
アプリコットデザイン
右側に配置されたスライドとそれを説明する左側のエリアのバランスで、コンパクトで読みやすいデザインになっています。
アプリコットデザイン
https://apricot-design.com/
ビジュアルメニューギャラリーニュース・ブログ一覧
アプリコットデザイン
一つ一つのバナーにこだわった、デザイン力があるからこそ表現できるデザイン。気になるコンテンツがわかりやすく並んでいます。
アプリコットデザイン
https://apricot-design.com/
料金
ChargeSPOT
表ではなく、時間の流れに沿った表現の料金説明。従量課金的な料金体系の表現の参考になります。
ChargeSPOT
https://chargespot.jp/
工程、流れ
ChargeSPOT
使い方の流れをイラストとともにわかりやすく説明。一貫したテーマカラーもいい。
ChargeSPOT
https://chargespot.jp/
コンテンツ
関西編集保安協会
言葉よりもビジュアルで、編集の様子をアニメーションで表現した世界観のある表現。ぜひ、実際のサイトで確認してほしいデザイン。
関西編集保安協会
https://khhk.info/
ギャラリーニュース・ブログ一覧
ベーカリーレストラン サンマルク
Instagramの紹介。映える写真を中心にコンパクトに配置されていて全体デザインの邪魔をしないデザイン。
ベーカリーレストラン サンマルク
https://www.saint-marc-hd.com/saintmarc/
料金
ベーカリーレストラン サンマルク
実際にレストランで出されるような冊子型のデザインがリアリティを出していてオシャレ。
ベーカリーレストラン サンマルク
https://www.saint-marc-hd.com/saintmarc/
コンテンツ
ベーカリーレストラン サンマルク
サイドに配置されるカード型の写真がオシャレ。コンパクトなスライドショーになっているのもよい。
ベーカリーレストラン サンマルク
https://www.saint-marc-hd.com/saintmarc/
ギャラリーニュース・ブログ一覧
Yappli Liteプラン
カード型のコンテンツ一覧。キャッチ画像の色味を合わせて、統一感のあるデザイン。
Yappli Liteプラン
https://yapp.li/lite/
コンテンツ
Yappli Liteプラン
シンプルだけど、見出し、説明、リンク、アイコン、キャッチ画像など必要な要素がそろっている。
Yappli Liteプラン
https://yapp.li/lite/
工程、流れ
BGでんき
全体の流れをシンプルに表現したデザイン。一目で見える範囲にまとまっていてわかりやすい。
BGでんき
https://denki.beautygarage.jp/
料金
BGでんき
料金シミュレーション。実際に使ったときのシミュレーションを見せるとユーザーも安心しますね。
BGでんき
https://denki.beautygarage.jp/
料金
BGでんき
商品の魅力をぐっとまとめた配置。短い文章で、数字をしっかり見せて訴求している例。
BGでんき
https://denki.beautygarage.jp/
商品画像
甘味処鎌倉 わらびもち専門店
高品質な商品の写真が背景とシームレスに配置されてオシャレに演出しています。 思わず食べてみたくなるデザインです。
甘味処鎌倉 わらびもち専門店
https://www.warabimochi-kamakura.com/
メインビジュアルコンテンツ
甘味処鎌倉 わらびもち専門店
配置された縦書きのタイトルを中心にたくさんの写真がバランスよく配置されるおもしろい構成。
甘味処鎌倉 わらびもち専門店
https://www.warabimochi-kamakura.com/
メインビジュアル
甘味処鎌倉 わらびもち専門店
画像と中央に配置された縦書きのタイトル。 シンプルに凝縮されたこだわりが感じられます。
甘味処鎌倉 わらびもち専門店
https://www.warabimochi-kamakura.com/
コンバージョン
南曜堂
シンプルだけど見やすくわかりやすい問い合わせ案内。 単純な矩形で囲うのではなく、あえて途切れた矩形を使うのがオシャレさを演出しています。
南曜堂
https://nanyodo-monaka.com/
商品画像
南曜堂
シンプルで洗練された商品一覧。 構成要素はシンプルですが、アイコンのあしらいやテキストのサイズや行間などきれいにレイアウトされています。
南曜堂
https://nanyodo-monaka.com/
グローバルメニュー縦型メニュー
南曜堂
右下に配置されたグローバルメニュー。 最近のモニターではサイドをうまく使うデザインも多く生まれています。
南曜堂
https://nanyodo-monaka.com/
コンテンツ
南曜堂
背景とコンテンツがバランスよく配置されています。 リボンの上に画像が配置されるデザインは参考になります。
南曜堂
https://nanyodo-monaka.com/
ギャラリーコンテンツ
敷島住宅株式会社 採用情報
上下に画像を配置したよく目立つデザイン。 ここぞというときに使いたいです。
敷島住宅株式会社 採用情報
https://www.shikishima-j.co.jp/recruit/
コンテンツメニューコンテンツ
敷島住宅株式会社 採用情報
左の大見出しを固定で右だけをスクロールさせるアイデア。 階層のあるコンテンツでは有効な見せ方です。
敷島住宅株式会社 採用情報
https://www.shikishima-j.co.jp/recruit/
コンバージョン
社会保険労務士法人しろくまパートナーズ
情報量が多い中でもシンプルで見た目でわかりやすいデザイン。 何ができるのかが一目でわかります。
社会保険労務士法人しろくまパートナーズ
https://sr-shirokuma.com/
コンテンツメニューボタン・リンク
社会保険労務士法人しろくまパートナーズ
濃い背景に明るい文字で反転させたデザイン。 白基調のサイトの中で、目立って目を引く要素になっています。
社会保険労務士法人しろくまパートナーズ
https://sr-shirokuma.com/
ギャラリーコンテンツメニュー
社会保険労務士法人しろくまパートナーズ
横スライド型のコンテンツ配置。 コンパクトかつしっかり内容を見せることができるレイアウト。
社会保険労務士法人しろくまパートナーズ
https://sr-shirokuma.com/
ニュース・ブログ一覧
山あいの宿 喜安屋
珍しい縦型のお知らせ一覧。 和のサイトで参考になりそうです。
山あいの宿 喜安屋
https://www.kiyasuya.jp/
商品画像
こここ
本の紹介デザイン。紹介文が吹き出しで表示されてかわいい。 本以外にも、商品紹介などにも参考にできそうなデザインです。
こここ
https://co-coco.jp/
ニュース・ブログ一覧
こここ
一般的なニュース、トピックス一覧のレイアウト。 画像の角をちょっと丸めるだけで、かわいくオシャレに並びます。
こここ
https://co-coco.jp/
ビジュアルメニューコンテンツメニューコンテンツ
こここ
見出しと画像が左右に配置されたレイアウト。 コンテンツがアニメーションで切り替わって紹介されている。
こここ
https://co-coco.jp/
ニュース・ブログ一覧
サイボウズ Office | 中小企業の“チーム力”を強化するグループウェア
カード型のデザインを並べたお知らせ一覧。 フラットデザインの中で、重要なポイントだけドロップシャドウを使うことで要素を目立たせています。
サイボウズ Office | 中小企業の“チーム力”を強化するグループウェア
https://office.cybozu.co.jp/
ビジュアルメニューギャラリー
神戸元町辰屋
よくある商品紹介一覧ですが、縦書きを入れることで単調ではない目を引く一覧になっています。
神戸元町辰屋
https://www.kobebeef.co.jp/
フッター
ふくおか相続税相談室ほっと！
シンプルなフッターが多い中、フッターにもこだわったデザイン。 左上の縦書きのテキストで、単調でないレイアウトになっている。
ふくおか相続税相談室ほっと！
https://souzoku-hot.com/
ニュース・ブログ一覧
M・ZEC
サイトデザインの一貫した形ではあるものの、「バナーと言えば四角」といった単純な発想から外してくれるデザイン。 よくある形をちょっと工夫するだけで、ユニークなデザインになります。
M・ZEC
https://www.m-zec.com/
ニュース・ブログ一覧
M・ZEC
罫線のシンプルなお知らせ一覧が多い中、背景を使ったそれぞれ独立した表現の一覧。 かわいいアイコンや、Read Moreの見せ方がユニークでかわいい。
M・ZEC
https://www.m-zec.com/
コンテンツメニュー
M・ZEC
単純にきれいなデザイン。 マウスホバーで大きくなり色が変わることで、選択していることがとても分かりやすいバナーになっています。
M・ZEC
https://www.m-zec.com/
コンテンツ
M・ZEC
横並びの画像と、縦と横のテキストをうまく組み合わせたレイアウト。 見出し、説明、画像をコンパクトにまとめる好事例。
M・ZEC
https://www.m-zec.com/
コンテンツメニュー
株式会社富士交易
メニューと画像の切り替わりで効果的にわかりやすくしたメニュー。 左サイドをワイドに使ったメニュー事例。
株式会社富士交易
https://www.fuji-koeki.co.jp/
ビジュアルメニュー商品画像
オムロンの血圧計
単純に中央に配置するのではなく、絶妙なバランスで配置された商品画像。 デザインのシンプルさが、商品画像を引き立ててスマートな印象に。
オムロンの血圧計
https://www.healthcare.omron.co.jp/product/hem/howtochoose/
メインビジュアル
オムロンの血圧計
商品画像が際立つ、シンプルだけどオシャレなメインビジュアル。 背景を流れるテキストもおしゃれ。
オムロンの血圧計
https://www.healthcare.omron.co.jp/product/hem/howtochoose/
ニュース・ブログ一覧
TEGO-LAB
シンプルなレイアウトながら、カラーをアクセントに使ったおしゃれなデザイン
TEGO-LAB
https://tego-lab.jp/
コンテンツメインビジュアル
Malama Hawaii
テキストと画像をうまく配置した、雑誌のようなオシャレなレイアウト
Malama Hawaii
https://www.allhawaii.jp/malamahawaii/
コンテンツ
三茶呑場マルコ
ビジュアルとテキストをうまく組み合わせたレイアウト。 コンパクトでありながら、たくさんの情報を伝えることができる。
三茶呑場マルコ
https://marco.tokyo/
メインビジュアル
三茶呑場マルコ
横方向に流れる写真を存分に生かしたメインビジュアル。 左側にキャッチが入っているのもおしゃれ。
三茶呑場マルコ
https://marco.tokyo/
ニュース・ブログ一覧
社会福祉法人 愛和会
カテゴリ付き新着のお知らせ情報。 お知らせやブログデザインの参考になります。
社会福祉法人 愛和会
https://swc-aiwakai.jp/
グローバルメニュー
千里金蘭大学
左右に配置されたSNSボタンやメニュー 左右に広くなったモニターでは、こういった縦型のメニューもおしゃれ。
千里金蘭大学
https://www.kinran.ac.jp/cheer/opencampus/