DEMO PORTAL

クロスラーニング デザイン 比較ポータル

広報サイトリブランディング用に 5 つの視覚言語 × 構造(TOP / LP)の 合計 9 パターン を比較できます。 まずは TOP デモ(既存サイトと同じマルチページ構造)からご確認ください。

▶ TOP DEMO

マルチページ前提の TOP ページ(本命)

各セクション要点 + 詳細ページ誘導リンク付き

LEARNING

A · TOP

Editorial — rvatec inspired

編集的・タイポ強コントラスト・シャープ。各セクション圧縮 + 「→ 詳細」誘導。

TOP デモを見る

peace put

B · TOP

Cinematic — peaceput inspired

詩的・display serif・コラージュ。CTA は EN/JP 二層のミニマル誘導。

TOP デモを見る

人と技術を、つなぐ

C · TOP

Friendly — asuzac inspired

親しみ・カラフル・人物 + 町俯瞰。CTA はピル型ボタンで親しみやすく。

TOP デモを見る
Learn.
D · TOP

Kinetic Bento — Claude オリジナル

先進的・テック・ラックス・ダーク。CTA は glass + magnetic 風。

TOP デモを見る

やわらかな信頼感

E · TOP

Inabe Soft — いなべ阿下喜ベース inspired

やわらかい・有機的・温かい。白基調 + 有機 blob + 波打つマスク。フォトドリブンの優しい信頼感。ステークホルダー最高評価。

TOP デモを見る

波多層化

E·1 · TOP

Inabe Soft (waves) — 波の多層化+セクションごとに波形バリエーション

原本 E ベース。wave-mask SVG を 4 種に拡張、hero/concept を 2 層化、6 箇所の境界に異なる波形を配置。「なみなみ感」を最大化。

TOP デモを見る

写真 blob

E·2 · TOP

Inabe Soft (blobmask) — 写真の有機 blob マスク

原本 E ベース。hero 写真を blob で float、showcase カード写真と news サムネを有機シルエット化。矩形を排除して柔らかさを増幅。

TOP デモを見る

紙質ノイズ

E·3 · TOP

Inabe Soft (paper) — 紙質ノイズオーバーレイ

原本 E ベース。feTurbulence の paper-noise を全画面に opacity 0.04/multiply blend で重ねて、紙の上にある柔らかい空気感を加味。

TOP デモを見る
TOP デモとは:既存サイト(マルチページ構造)と同じ前提で、TOP ページが各下層ページ(/point/ /kouza/ /case/ 等)への入口として機能する版。各セクションは「要点 2-3 個 + 詳細ページへの誘導リンク」で構成。
▷ LP DEMO

1 ページ完結の LP 版(比較参考)

全コンテンツが 1 ページに集約された LP 型