flow_005

flow_005.zip

サービス導入や申込みの流れを**整った印象で伝えられる**、囲みSTEP付きのフローデザイン。

各カラムは「STEP（囲み）・アイコン・見出し・本文」の4要素で構成され、視認性とバランスを両立しています。

STEPラベルは囲み表示＋中央揃えで、背景全体に広がらないスマートな見せ方に。

カラムの背景には角丸の装飾を加え、全体にやさしくまとまりのある印象を与えます。

アイコンは、220pxの画像枠に128pxサイズのデザインを中央配置。

背景を透明にし、サイトのテーマカラーに合わせたアイコンを使えば、**デザインの統一感**がさらにアップします。

カラム間にはfontawesomeの**矢印（before要素）**を自動挿入。

ステップの進行をスムーズに伝えることができ、DRESSから内容変更も可能です。

スマホ表示ではカラムが縦に並び、矢印やレイアウトも自動調整。

5ステップ以内なら目次ブロック、6ステップ以上ならアルバムブロックを使用することで、デザインを維持しながら柔軟に対応できます。

整った情報設計と進行表現を両立した、**伝わる力のあるBlockDesign**です。

https://bindism.com/blockdesign/flow/flow_005.html