株式会社Knotus

クリーンなホワイトをベースに、テキストやボタンにソリッドなブラックを配した、極めて洗練されたモノトーンの高コントラストな配色。サイト自体にはあえて強いアクセントカラーを持たせず、配置された実績写真や映像の豊かな色彩を主役として引き立てる設計となっており、各写真は透明感のあるクリアな明度とトーンで統一されています。タイポグラフィは、大ぶりの美しいセリフ体の英語見出しと、視認性の高い細身のゴシック体の和文を組み合わせた構成。極端なサイズ差と、たっぷりと取られた字間・行間が、洗練された品格を醸し出しています。レイアウトは堅牢な見えないグリッドをベースにしつつ、画像をアシンメトリーに配置したり、大胆に動画の全幅セクションを挟むことで、まるで上質なポートフォリオ誌をめくるような心地よい視線誘導を実現しています。アニメーションは、ミニマルな世界観を損なわない抑制的な一貫性を保ち、CTAや実績へのリンクなどのポイントでカーソルを変化させ、テキストがぬるっと追従し、ユーザーを導くと同時に、サイトに溜めの時間を与えより落ち着いた世界を実現しています。また、広大な余白の中に配置された黒いカプセル型のボタンが極めて高い視認性を確保して、ユーザーを自然にお問い合わせや実績詳細へと導く無駄のない導線設計となっています。

音更電設株式会社

「光」という企業のコアバリューを、鮮やかなイエローのグラデーションと斜めに差し込むダイナミックなシェイプで体現した、躍動感あふれるデザインです。見えないグリッドをベースにしながらも、光の束のような斜めのラインがセクションを横断し、ユーザーの視線を次々と下部へ導くレイアウトを構築。このエネルギッシュな空間を支えるのは、ホワイトとブラックを用いた高コントラストなベース配色です。配置された写真は明度と彩度が高く、作業服のブルーと背景のイエローが美しい対比を生み出し、現場の熱量や社員の誇りをノイズなく伝えています。タイポグラフィには、極太のサンセリフ体の英字と可読性の高いゴシック体の和文を採用。大胆なジャンプ率と十分な余白設計により、強いメッセージ性と読みやすさを両立。ホバーエフェクトが随所に見られ、細部までこだわりが見られ、カーソルを動かさずにはいられない、ユーザーを楽しませる要素が散りばめられています。スポットライトが当たるリンクや、微細に浮き上がるカード、明度を変えるボタンがフォーカス状態を的確に示し、直感的な回遊を促す堅実な導線としても機能しています。

HOTEL TAU, KUMAMOTO

クリーンなホワイトを基調とし、フッターにダークグレーを配した明快なコントラストの中で、ロゴの繊細なピンクや手描きイラストの赤をアクセントに効かせた、洗練されたミニマルな配色設計です。配置された写真は、コンクリートや植物の質感、ネオンサインの光を活かした落ち着いた彩度のトーンで統一され、モダンで上質な空間の空気感を静かに伝えています。タイポグラフィは、たっぷりと取られた字間・行間によって品格のある空間を演出。そこに特徴的なアウトラインのロゴタイプを組み合わせることで、整然とした中に知的な遊び心を加えています。レイアウトは広大な余白を贅沢に使い、見えないグリッド上でテキストと画面幅いっぱいの写真を交互に配置することで、まるでアートギャラリーを歩くような優雅な視線誘導を実現。アニメーションも最低限に抑え、ホバー時には円形の矢印アイコンが滑らかに動くなどの微小なインタラクションでフォーカス状態を可視化。たっぷりの余白の中に配置されたシンプルな線画のCTAは高い視認性を保ち、ユーザーを自然に次の詳細コンテンツへと導く洗練された導線設計となっています。

JAグループ愛知 公式採用サイト

クリーンなホワイトベージュと鮮やかな自然のグリーンをメインに、大地を思わせるブラウンや温かみのあるイエローをアクセントとして用いた、親しみやすく活気のある配色設計です。サイト全体を彩るフラットテイストの温かなイラストは、街と農地が共存する風景や農作業の様子を細やかに描き出し、地域に根ざす事業のスケール感を視覚的に表現しています。配置された写真は自然光を活かした高明度のトーンで統一され、職員の穏やかな表情をクリアに伝えています。タイポグラフィは丸みを帯びたゴシック体を主軸に据え、余白を持たせた字間設計がリラックスした印象を与えます。レイアウトは、厳格な直線グリッドではなく、丘や畑を連想させる波打つような有機的な曲線をセクションの境界線に用いることで、のどかな風景の中を歩むような心地よい視線誘導を実現しています。スクロールに伴うアニメーションは、カードやイラストがフェードインする挙動で統一され、柔らかな世界観を崩さない抑制的な一貫性を保っています。ホバー時にはズームインや色変化などでフォーカス状態を可視化し、十分な余白の中に色分けして配置されたボタン群が、ユーザーを自然に次のアクションへと導く手堅い導線設計となっています。

弥生株式会社 採用サイト

ブランドカラーである鮮やかで深みのあるブルーとクリーンなホワイトをベースに、エネルギッシュなグラデーションをアクセントに用いた、知的で疾走感のある配色設計。ファーストビューから続く、横へ流れるスピード感のあるライングラフィックが、「挑戦の循環」や「未来へ向かう力強い推進力」を視覚的に表現しています。配置された写真は、オフィスでの自然な様子や、窓越しに都市を見据える姿など、明るくクリアなトーンで統一され、社員一人ひとりの前向きな姿勢と企業の透明性を引き立てています。視認性と信頼感のあるスマートなゴシック体フォントを軸に、力強いメッセージにはしっかりとウェイトを持たせ、メリハリのある情報の階層化を図っています。レイアウトは、堅実なグリッドをベースにしつつ、セクションを大胆なブルーの背景や斜めのラインで区切ることで、単調にならないダイナミックな視線誘導を実現。CTAはソリッドにブルーの長方形で統一され、十分な余白の中に配置されることで高い視認性を確保し、洗練されたホバーアクションも一貫性があり、ユーザーを迷わず各ページリンクやエントリーへと導く、堅牢で信頼感のある導線設計となっています。

かながわ農産 | 富山県滑川市のお米農家

豊かで穏やかな自然の息遣いを感じさせる、洗練された和の趣を持つデザインです。大地を思わせる温かみのある淡いベージュをメインカラーに採用し、テキストに墨色のようなダークグレーを合わせることで、明快なコントラストを保ちつつも目に優しい配色を構成しています。配置された写真は自然光を活かした暖色寄りの色温度で統一され、稲穂の瑞々しい緑や白米のツヤといった被写体の質感を穏やかに表現。レイアウトは、広大な余白を活かして写真をアシンメトリーに配置し、見えないグリッド上で縦書きと横書きのテキストを交差させることで、上質な和風雑誌のような心地よい視線誘導を実現しています。タイポグラフィは品格のある明朝体を主軸に据え、細やかなウェイト調整とゆったりとした字間・行間を設けることで、誠実な手仕事の空気感を視覚的に構築されています。スクロールに伴うアニメーションは、各要素が短い距離を緩やかなイージングでフェードインする挙動で反復され、全体のゆったりとした世界観を引き立てています。シンプルな矢印を添えたテキストリンク等のCTAは、たっぷりと取られた余白の中で高い視認性を確保しており、ユーザーを自然にストーリーや商品詳細へと導く無駄のない導線設計となっています。

キヤスク | すべての服を、あなたの服に。

手仕事の丁寧さとブランドの誠実さが伝わる、柔らかく温かみのあるデザイン。基調色にはクリーンなホワイトと淡いグレーを採用し、温もりのあるコーラルレッドをアクセントカラーとして効かせることで、過度な緊張感を与えない優しいコントラストを形成しています。配置された写真は、自然光を活かした高明度かつ暖色寄りの色温度で統一されており、布の質感や作業の息遣いをノイズなく伝えています。タイポグラフィは繊細な明朝体を主軸に細めのウェイト設定と、たっぷりと確保された字間・行間が、言葉一つひとつを大切に紡ぐような静謐な空気感を生み出しています。画像をアシンメトリーに配置したり、柔らかな角丸を取り入れたりする余白設計により、ゆったりとした回遊を促す視線誘導を実現したレイアウト。ポイントで破線がゆっくり伸び、ミシンの縫い目を進めるイメージがサイトにピッタリです。モーションはテキストや画像が緩やかにフェードインし、静かな世界観を阻害しない抑制的な一貫性を保っています。ホバー時にはリンクやボタンがふわりと色付くような微細な変化でフォーカスを可視化。アクセントカラーのCTAを十分な余白の中に配置されることで、高い視認性を保ちユーザーを自然な流れで次のアクションへと導く設計となっています。

MEJINAVI2026|目白大学がまるっとわかるメジナビ

画面全体を一本の道が貫くポップなイラストベースのレイアウトが、ユーザーの視線を自然と下部へ導く回遊性の高い導線設計となっています。厳格な四角いグリッドというよりは、背景の地形という見えない線に沿って各要素を整列させることで、まるでテーマパークを巡るようなシームレスでワクワクする体験を構築。この世界観を支えるのは、鮮やかなグリーンと温かいクリーム色を基調に、多彩なアクセントカラーを効かせた明快な配色です。配置された写真は明度が高く自然な色温度で統一されており、学生の活き活きとした表情をクリアに引き立て、大学の魅力を最大限伝えています。見出しにはポップな英字に丸みのある装飾的な太字、和文の本文にはプレーンなゴシック体を併記するルールを採用し、明確なウェイト差とゆとりのある字間設計によって、親しみやすさと情報の読みやすさを両立させています。スクロールに伴うアニメーションは、カードや装飾が短い距離をジャンプイン、賑やかなビジュアルの中でも過度なノイズにならず、かつ目を引く遊びが施されています。ホバー時にも写真やカラーが入れ替わったり、微小にズームするボタンがフォーカス状態を的確に可視化しており、ユーザーに迷いのないアクションを促しています。

VERYMAN ベリーマン株式会社

メインカラーは広大な余白を活かしたクリーンなホワイトとライトグレーで、清潔感と洗練された雰囲気が印象的。セクション背景やCTAには、深く落ち着いたネイビーブルーを配置し、知的で静謐なコントラストを生み出しています。使用されている写真は、明度が高く彩度を抑えたトーンで統一されており、ポートフォリオのようにプロダクトや風景の質感をノイズなく伝えています。タイポグラフィは和文フォントと欧文フォントで縦書きと横書きを効果的に交ぜて、細字を中心としたウェイト設定と、たっぷりと取られた字間・行間が、まるで洗練された雑誌や書籍のようなデザインの空気感を構築しています。レイアウトは堅牢なグリッドシステムをベースにしつつ、要素をアシンメトリーに配置する大胆な余白設計によって、優雅でゆったりとした視線誘導を実現しています。スクロールに伴うモーションは、画像やテキストが緩やかなイージングでフェードインする挙動に統一され、サイト全体の静かな世界観を損なわない抑制的な一貫性を保っています。ホバー時にはリンクテキストの下線が伸びたり、画像がわずかに明るくなったりする変化でフォーカス状態を可視化しています。ネイビーの円形CTAは、広い余白の中で高い視認性を確保しており、ユーザーを自然に次のアクションへと導く無駄のない導線設計となっています。

焼津市の矯正専門歯科【やいづ原崎矯正歯科】

基調色は清潔感のあるオフホワイトと落ち着いたネイビーブルーで構成され、明快なコントラストの中にも医療機関らしい信頼感と温かみを感じさせる配色です。写真は明度を高く保ち、ニュートラルから微かに暖色寄りの色温度で統一することで、院内の清潔で穏やかな空気感を伝えています。レイアウトは堅実なグリッドシステムをベースにしながらも、セクションの境界や所々のアクセントに繊細な線で波打つような有機的な曲線を用いることで、まるで静かな水面を眺めるような心地よい視線誘導を実現しています。タイポグラフィは視認性の高いゴシック体を軸とし、見出しにはエレガントな欧文フォントを併記して視覚的なアクセントを付与。本文との明確なウェイト差と十分な行間・字間設計により、高い可読性を確保しています。スクロールに呼応するモーションは、各要素が短い移動距離を下からゆっくりとしたイージングでフェードインする挙動に統一されており、サイト全体の柔らかなトーンを損なわない一貫性を保持しています。ホバー時のマイクロインタラクションは、CTAボタンの色変化や微小なズームなど、抑制の効いた変化でフォーカス状態を明確に可視化。また、診察時間やアクセスといった閲覧者が知りたい情報がすぐアクセスできるように常時サイドに追従する設計で次のアクションへ安心して導く堅実な導線設計となっています。

Making Design Make Sense.
デザインを、感覚から理解へ。
© Design Decode. 901