少年少女創造性育成事業|公益財団法人市村清新技術財団

公益財団法人市村清新技術財団が運営する、小・中学生の創造力と発想力を育む少年少女創造性育成事業の公式サイト。全体を包み込むのは、子供たちを優しく迎え入れるような温もりのあるアイボリーの背景色。そこに、好奇心を刺激するオレンジやイエロー、ライトブルーの有機的なシェイプを大胆に重ねることで、堅いイメージを持たれがちな財団法人のサイトに、ワクワクするような親しみやすさと遊び心を吹き込んでいます。そして随所に散りばめられた歯車や電球、鉛筆などの手書き風イラストや、クレヨンで描いたような矢印のあしらいが、自由な発想や「ひらめき」の連鎖を視覚的に表現。ふわふわとした動きをつけることでアイディアが頭の中に浮かぶような印象を与えます。ページ最下部にあるロケットの遊び心が秀逸です。また、真剣な眼差しで工作やアイデアスケッチに向き合う子供たちの実写写真も、丸みを帯びた形で柔らかく切り抜くことで、サイト全体のアットホームな空気感と調和しています。子供向けの自由で楽しい世界観を作り込みながらも、募集要項や活動レポートなどの重要な情報は視認性の高いフォントで見やすく整理。豊かな想像力を後押しする楽しげなデザインと、公益財団法人としての確かな信頼感が心地よく共存する設計です。

日本空調サービス株式会社 採用サイト(Human Brand Site)

社会を根底から支えるインフラ設備の維持・管理を担う企業の採用サイトです。全体を包み込むのは、澄み切った大空やクリアな空気を連想させる、透明感あふれるペールブルーとホワイトの配色。巨大なプラントや入り組んだ配管群といった圧倒的で無機質なスケール感を、たっぷりと取られた余白と端正なレイアウトで見事に中和し、洗練されたクリーンな印象に仕上げています。「いい風になろう。」というブランドメッセージを手書きフォントで訴えかけながら、読み進めたくなるよう要所に配置しています。冷たい鉄やコンクリートの風景と見事なコントラストを描く、社員たちの温かな表情の数々が特徴的です。現場で真剣に作業に向き合うプロとしての姿だけでなく、青空の下で肩を組んで笑い合ったり、仲間と共に歩んだりする自然体なビジュアルを大きく配置。これにより、現場の過酷で堅苦しいイメージを払拭し、風通しの良さとチームワークの強さを視覚的に表現しています。また、スクロールに合わせてブラーが晴れて写真や文字がくっきりと表示されたり、ボタンホバーでさりげなくモーションしたりとといった細かなこだわりを随所で感じさせます。インフラという社会的に重要な使命と、そこで働く人々の等身大の人間味が、計算された写真配置と透明感ある空間の中で心地よく共存。目に見えない環境を誠実に守り続ける企業の誇りと情熱が、求職者へ向けて真っ直ぐに伝わってくる、秀逸なデザインです。

Yoom

AIエージェントや業務自動化という専門性の高いサービスを、親しみやすく直感的に伝えるデザインです。ファーストビューでは、カラフルでモフモフとした質感の3Dキャラクターたちを用いることで、「AI社員」という概念を難しいテクノロジーではなく身近な存在として表現し、初見ユーザーの心理的なハードルを下げています。配色はホワイトをベースにしながら、パープルやイエロー、グリーン、ブルー、ピンクなど鮮やかなアクセントカラーをセクションごとに切り替えることで、単調さを感じさせず、テンポよく読み進められる構成になっています。一方で、機能紹介や連携アプリ、導入実績、セキュリティなどの情報は白を基調としたカードUIで整理されており、ポップな世界観の中でも情報の視認性と信頼性を損なっていません。タイポグラフィは太めで丸みのあるフォントを中心に構成され、絵文字やイラストと組み合わせることで親近感を演出。さらに、豊富な連携サービス数や導入実績、テンプレート紹介などを段階的に配置することで、楽しさだけでなく「実際に業務で使えるツールである」という安心感も醸成しています。複雑な業務自動化を、まるで新しいアプリやゲームを触るような感覚で体験できる期待感を生み出している優れたサービスサイトです。

シンクワイア株式会社

深い知性と誠実さを象徴するネイビーブルーを基調に、クリーンなホワイトと淡いライトグレーを組み合わせた、極めてプロフェッショナルで洗練された配色設計です。この落ち着きのあるダークトーンの色彩が、コーチング領域における確かな信頼感と、思考の深さを視覚的に印象付けています。構成の最大の特徴は、付箋や書類を連想させる四角形の図形を、サイトの随所で重ね合わせたレイアウトです。この重なりは、クライアントとの対話を通じて「問い」を立て、思考を深め、「気づき」へと至るプロセスそのものを表現しています。また、スクロールでランダムに文字がフェードインする英語の見出しにはエレガントなセリフ体を大きく配置し、たっぷりと取られた余白の中にテキストを整然と組むことで、知的で品格のある空間を創り出しています。エレガントなセリフ体と洗練された余白が、プロフェッショナルの品格を静かに語るコーポレートサイトです。

日本製革小物・バッグ製造 | 株式会社LAMAC

広大な余白を贅沢に活かしたアシンメトリーなレイアウトと、美しい縦書きの明朝体を組み合わせたエディトリアルデザイン。画像とテキストを規則的に並べるのではなく、あえてずらして配置することで画面に心地よいリズムを生み出し、まるで上質なブランドブックをゆっくりと読み解くような、奥ゆかしい視線誘導を実現しています。色味は温もりのあるアイボリーを背景の基調とし、テキストやフッターには深いダークグレーを配した、上質で落ち着きのある配色。サイト自体に強い色を持たせず無彩色に近いトーンでまとめることで、革本来の深みのある赤や黒、そして職人の手元を捉えたシネマティックな写真の色彩が、圧倒的な世界観を引き立たせています。スクロールに呼応するモーションは、写真やテキストが静かに、そしてゆっくりと浮かび上がる滑らかなフェードインで統一されており、職人が一つひとつの製品と丁寧に向き合う静謐な時間を視覚的に表現しています。CTAにはリッチなサイトらしい、抑制と高級感あるインタラクションで、ノイズなくお問い合わせやサイト内の回遊を促します。

音更電設株式会社

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

VERYMAN ベリーマン株式会社

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

Axis.ov-Films

徹底して「映像」をダイナミックに使用して主役に据えるため、無彩色のメインキャンバスに。作品のサムネイルが持つ色彩や温度感が、整然とした空間に鮮やかに引き立ち、ポートフォリオとしての機能を最大限に高めています。幾何学的なサンセリフ体の欧文と可読性の高いゴシック体の和文を併記し、行間を広めに取ることで、ストーリーテリングのような心地よいリズムを形成。セクションの区切りに配置されたCTAにはホバーアクションで絵文字付きのマーキーの遊び心が感じられます。インパクトある動画やアニメーション、エフェクトで視覚的な境界線と導線を兼ねたユニークな構造を作り出し、静的なレイアウトに動的なグルーヴ感を与えています。単調になりがちな縦スクロールに、開始アニメーション、ホバーエフェクト、動画、アニメーションで抑揚を付与。サイトのベースカラーと写真、動画のトーンが合わせられポートフォリオのように世界観を表現。その中でユーザーの回遊を遊び心とともに促し、トレンド感と機能性を両立しています。

terasu歯科

白とグレーを基調とした清潔感ある配色に、明朝体の凛とした美しさが映えるファーストビューで、“Light up the future of your teeth”というコンセプトが誠実な佇まいとともにまっすぐ伝わります。スクロールに合わせてゆっくりとフェードインする写真やテキストは、診断から治療へと進む丁寧なプロセスを想起させ、読み進めるほどに医院への信頼が積み上がっていく設計も秀逸。情報量が多くなりがちな診療メニューも、ゆとりあるカード配置と角の取れたあしらいで圧迫感が消え、視線が迷わず目的へと吸い込まれる感覚です。コンセプト・診療方針・Q&Aが無駄なく接続され、患者の不安を解消しながら「未来の健康」へと視座を引き上げるストーリーを通読できる骨格。空間×言葉×デザインが有機的に連なり、トップからフッターまで一筆書きのように導かれる体験。「患者さんの道を照らす」という医院の哲学を、視覚と情報の両面で深く味わえるサイトです。

ぺんてる

大胆なプロダクトビジュアルと鮮やかな色面が画面いっぱいに立ち上がるファーストビュー。余計な装飾を排しながらも、文具メーカーらしい“色”と“かたち”の魅力を真正面から打ち出し、創造性と信頼感を同時に印象づけます。スクロールに沿って展開する製品情報やブランドストーリーは、整ったグリッドと明快なタイポグラフィで端正に整理され、情報量が多くても視線が迷いません。写真の切り替えやセクションの出入りには控えめなモーションが添えられ、静かなリズムがページ全体を貫いています。プロダクトの質感や筆致のニュアンスを丁寧に伝えるカットの配置、用途やカテゴリごとに分解された導線など、“使う前から品質が伝わる”設計が細部まで行き届いているのも印象的。派手な演出に頼らず、色・形・余白・動きのバランスだけでブランドの歴史と誠実さを語り切る構成です。ものづくりの姿勢とユーザーへのまなざしがUIの隅々にまでにじむ、静かに強い説得力を持ったコーポレートサイトです。

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