VEYRA FIRST QUARTER

The Perfect Balance of Light and Shadow
左右で明暗が反転するスプリット構成の解説サイトです
01 / Concept Section — Shadow Side

暗色パネルの解説。

画面を左右で完全に分割し、左側はダークカラーで静けさと思考のフェーズを表現するパネルです。

右側パネルとは色調が正反対になるよう設計し、対比そのものをコンテンツにしています。

02 / Concept Section — Light Side

明色パネルの解説。

右側はホワイトを基調とした明るいパネルで、実行・成果のフェーズを表現します。

境界線上に細いゴールドのラインを置き、二面性の切り替わりを視覚的に強調しています。

03 / Process Section

円形アイコンを横一列に並べ、細い線で接続するステップ型タイムラインの解説です。

STEP 01

暗闇

現状分析・ヒアリング

STEP 02

兆候

戦略設計・設計構築

STEP 03

均衡

開発・実行・本格展開

STEP 04

満月

最大化・効果測定

04 / Results Section

数値カウンターを含む指標カードのグリッド構成の解説です。

Performance
0%
スクロールで0から実数値までカウントアップする表示の解説です。
Scalability
0%
円形プログレスと数値を併記する構成の解説です。
Stability
24/7
固定値のステータス表示を扱うカードの解説です。
Service Modules
横並びリスト項目01
横並びリスト項目02
横並びリスト項目03
05 / FAQ Section

枠線付きカードを積み重ねたアコーディオンの解説です。

開いた状態のアコーディオン項目

クリック時にプラスアイコンが45度回転し、枠線の色がゴールドへ変化します。回答領域は高さを自動計算してなめらかに展開します。

閉じた状態のアコーディオン項目01

閉じた状態ではカードの枠線が控えめな色に戻ります。

閉じた状態のアコーディオン項目02

複数項目を積み重ねても視認性を保てるよう、カード間に一定の余白を設けています。

06 / Contact Section

2カラムの左テキスト・右フォーム構成の解説です。

左に見出しとリード文、右に入力フォームを配置したコンタクトセクションの定番レイアウトです。

Contact