WORK with ART|ミュージアムタワー京橋

「都市の緑」と「アートの気配」が静かに重なる、余白を生かしたファーストビューのプロジェクトサイト。緯度経度やビル名が淡く現れて消える導入が、都市と創造の座標軸を提示します。働く場と芸術を結ぶ思想は、大判の写真と理知的なタイポグラフィで端正に表現。英語併記と章番号が編集デザインの骨格となり、読み筋を整えています。記事や記録はPOPUPではなくスライドインで自然に連なり、ProjectsとActivitiesが研究と実装を横断。スクロールのリズムは静かで、奥行きが増す設計です。なかでも円形の「See more」など最小限のアフォーダンスが、展示の誘導サインのように機能し、探索のワクワクを持続させる象徴的なUIとなっています。Newsは時間軸で整理され、活動の継続性を示す。Accessは必要最小限の情報を配置し、本体サイトへの導線も品よく抑えられています。配色は抑制的ながら、写真の緑や赤のグラデーションが余韻をつくり、ビルとアートの交差点という世界観を確立しています。

山鹿温泉 湯宿 湶

全体を質感のある深いネイビーで旅館の落ち着きを表現。ファーストビューで二言語のコピーが静かに迎え、館内の写真がゆっくり切り替わる端正な導入です。余白を広く取り、見出しは英語を添えてリズムを作り、情報の階層を迷いなく伝達。スクロールに呼応してコピーや写真が穏やかにフェード/スライド。“読む価値のある数値” が自然と目に入るよう調整されています。CTAは視線の到達点を明快に提示。ホバーは微細な変化に留め、写真の質感と文章の温度を主役に据える抑制設計。全体として、配色・余白・小さなモーションの三位一体で「飾らず、良い湯をまっすぐ伝える」姿勢を体験化した、落ち着きと信頼感のある温泉宿サイトです。

brand|kyu

ファーストビューでは写真のループを設置し “memories never fade” の世界観を、再生停止ボタンで能動的にコントロールできる構成。現在時刻を刻むデジタルクロックが「記憶と時間」の主題を視覚化し、サイトに呼吸感を付与。全体に薄いグレー、墨色のタイポグラフィと淡いグレーの罫線で組まれたミニマルデザイン。スクロールに同期して見出しや写真が低速フェード/スライドで現れ、コピーが余白と共鳴して “間” を演出します。カードやボタンのホバーアクションはごく小さく変わる程度に抑制し、内容への没入を妨げません。字間と行間の設計が可読性を高め、長文でも疲れにくい。配色・動き・余白の三位一体で「記録を丁寧に扱う」姿勢を体験として伝える、端正で余韻の残る設計です。

クラウドローン株式会社

薄いグレーのような緑をベースに、落ち着いたグリーン系アクセントで清潔感と前進感を両立。大きめの行間と余白が情報を呼吸させ、ファーストビューはコピーとシンプルな動きで導入し、明るさと信頼を感じさせる。以降のセクションはスクロール発火の穏やかなフェードやズームで立ち上がる。カードは微細な影と1–2pxの浮きで可読域を強調。画像はわずかにズームし、CTAは下線が左から右に伸び矢印がスライド。色はアクセント色へ滑らかに遷移し、フォーカス時も同等の反応で可用性を担保。このこだわり抜かれた細かなアクションとシンプルなレイアウトの組み合わせが安定感や落ち着きにつながる。余白をゆったり配置し、信頼を静かに積み上げる。装飾を抑え、言葉と構造で語る金融×テックらしい端正なトップ体験です。

BLUEDGE(ブルーエッジ)

白を基調に、ブランドブルーを効かせた清潔感のある配色。余白を大胆に取り、太さの異なるサンセリフで情報の階層をくっきり見せます。ファーストビューは「物流の理想を、かたちにする。」のコピーとキービジュアルで端正に始まり、スクロール誘導のアイコンだけでなく大胆なイラストが次ブロックへ視線を流す設計。スクロールをトリガーにした穏やかなフェード/スライドでセクションが現れ、各カードはホバーアクションで軽く持ち上がるような印象を与えます。余白→見出し→本文→CTAのリズムが一貫しており、複雑なサービス構成をストレスなく理解させる “静かなUX” が魅力。ボタンやカードの角は基本的に丸く柔らかな印象。落ち着いたトーンの中で青のアクセントが意思決定点を指し示し、誠実さとテクノロジー志向を両立させています。

Goodpatch Anywhere|越境をデザインする

訴求要素は多いのに、見せ方は驚くほどシンプル。魅力を語るコンテンツと、社員の声・実績アピールを主軸に据え、採用に振り切った導線で迷いがありません。シンプルで終わらせず、ファーストビューのダイナミックタイポグラフィと背景で静かに存在感を放つロゴの映像がサイト全体の空気を決め、読み始めの一歩を軽くしています。使用写真はどれも飾らないリアルな表情で、記事ページに入ると読み応えのあるインタビューがいくつも掲載されており、ここでもユーザーの視線をキャッチ。さらに情報の置き方がとても親切です。役割や働き方、事例がきれいに並び、どこから読み始めても応募までの流れが自然にわかります。各ブロックの余白と見出しの強弱でリズムが生まれ、ところどころのホバーや小さな動きが心地よい手触りを足しています。FAQや選考フローは短い文章と箇条書きでサッと読めるつくり。さらに、「ここで働くと何が良いか」を言い切る一文が要所にあり、迷ったときの道しるべになっています。結果として、誠実な雰囲気とチームの熱量が伝わり、そのまま応募してみようという気持ちにつながるサイトです。

UM English Lab.|洋楽で英語を学ぶ

深い余白とくっきりしたタイポに、ジャケット風のビジュアルが響くファーストビュー。ロゴカラーを筆頭にカラフルな配色ながら、トーンや用いるシェイプに統一感があり、このサイトの核となるポップで楽しそうな世界観を丁寧に作り込めていると感じます。スクロールに沿って並ぶ Feature/Interview/Study のカードは、音楽メディアの読み口を思わせる設計で、目と耳の記憶に寄り添う導線です。各セクションのレイアウトはシンプル。しかし、ホバーアクションの細やかさと大胆な余白運用が唯一無二の手触りを生み、自然と好奇心を引き上げます。なかでも Keywords セクションは象徴的で、配色・シェイプ・モーションの要素が過不足なく重なり、全部クリックしたくなる心理を巧みに設計。終盤では、教職員向け副教材のダウンロードへとさらりと橋渡しし、編集的な厚みと実用導線が一筆書きでつながります。“読む・聴く・学ぶ”を心地よく往復できる、ブランドの魅力と学びの楽しさを両立させたサイトです。

原宿サン・アド – Harajuku Sun-Ad

薄いグレー×黒のミニマル配色に、たっぷりの余白と骨太なタイポが基調。冒頭では “Showreel” のティーザーが静かに立ち上がり、視線を下へ導きながら世界観へ滑らかに招きます。ヘッダーの「原宿, 東京/時刻・天気」というマイクロインタラクションが“今ここ”を可視化し、サイトに呼吸感を与える設計。スクロールやホバーに応じた軽やかなフェードやスライドで要素が表情を変え、体験にリズムを付与。クリエイティブカンパニーらしいworksのクオリティの高さがサイトのリッチ感をさらに向上させ、そのコントラストの目立たせるところ、スッキリシンプルに魅せるところとのメリハリも効いています。最下部から導線が下層への回遊を自然に促し、トップで生まれた興味を次の理解へとつなぎます。

GOOD FOODS Worlds|ニッスイグループ

白と赤のミニマルな配色に、全面写真を重ねた大胆な構成で “GOOD FOODS” の世界観が一気に立ち上がります。スクロールに寄り添う飛行機がページの拍子を刻み、読み進めるほど旅の余韻が積み上がっていく設計も魅力的。単調になりがちな2カラムのカードデザインも、背景で回るテキストの無限ループでによって奥行きを感じられ、視線が自然に滑る感覚です。縦組みの小見出し、繊細なホバー、ところどころの動くイラスト等、手数の多さが丁寧な作り込みを物語り、信頼感につながっています。さらにメガメニューへの導線をページ下部の中央に置くレイアウトは、常識から半歩外した好奇心の喚起で、「もっと見たい」をうまく引き出します。写真×タイポグラフィ×モーションが3位1体で連なり、ファーストビューからフッターまで一筆書きのように駆け抜ける体験。ブランドの「旅する食の図鑑」というテーマを、視覚と触感の両面で味わえるサイトです。

秀英書房|人文書、実用書、教育書を中心に発行

「深みのある赤」と「本の表紙」が2段ループする印象的なファーストビューの出版社コーポレートサイト。歴史ある出版社ならではの深み・おもしろさ・上品さに加え、アート的で感性的なデザインが目を惹きます。文学的でありながら読みやすいフォント「Vollkorn SC」がサイト全体の方向性を示し、大文字ならではの見出しの存在感を放っています。「ウェブ連載セクション」のブログ表示は、プッシュインやプルダウンではなくPOP UPでスライドインを採用しており、ユーザー体験(UX)の評価が高いデザインです。逆サイドのブログを隠すレイアウトにより、視覚的な情報整理が瞬時に行われ、読み終えてページに戻るまでの動線も美しくつながっています。そしてなにより魅力的なのが「書籍一覧CTA」のサークルホバーエフェクト。まるで本屋で本を探すかのような体験を提供するユニークな演出で、会社への興味や秘められたおもしろさを感じさせるワクワク感は、間違いなくこのサイトの象徴です。

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