SAP Fiori
SAP Fiori / 2013– / スタイル / プラットフォームの画面言語
巨大な業務トランザクションを役割ごとの小さなアプリへ分解し、role-based、adaptive、simple、coherent、delightfulの五原則で揃えるSAPの画面言語。



ひと目で判断
見た目の特徴
- 役割別のタイルとカード
- 上部の常設シェルバーと検索
- 表とフォームを床面図の型で整理
- 端末幅に応じて詳細面を段階的に開く
向いている用途
- ERPの大きな機能を職種と作業単位へ分け直すとき
- デスクトップとモバイルで同じ業務を継続できる画面を設計するとき
このスタイルを使う
短い指針を制作へ持ち込むか、構造化された仕様をAIへ渡せます。
詳しい作り方と出典制作ルール、実在作例、比較、研究、引用形式
辞書情報
- 文字
- 短い業務語と数値を明確にし、長い説明は必要な場面でだけ開く。
- 構成
- シェル、要約、作業面の三段に分け、一覧から詳細へ幅に応じて展開する。
- 素材
- 白い作業面と淡い青灰を基礎に、青を主操作、状態色を意味へ割り当てる。
- 注意
- 既存ERPの全項目を小さくして移すだけではFioriにならない。役割に不要な機能を先に外す。
- 関連研究
- Fioriの五原則 / floorplans / role-based appsとLaunchpad
関連項目
- Ant Design(Ant Design)同じ「プラットフォームの画面言語」の系統。SAP FioriとAnt Designの違いを見る
- Carbon Design System(Carbon Design System)同じ「プラットフォームの画面言語」の系統。SAP FioriとCarbon Design Systemの違いを見る
プラットフォームの画面言語をさらに見る
同じ「プラットフォームの画面言語」から、共通する印象が多い順に次の項目を選んだ。
- アドワイタ(Adwaita)共通する印象:技術 / 静けさ / 信頼。
- GOV.UK デザインシステム(GOV.UK Design System)共通する印象:信頼 / 静けさ / 技術。
- ブリーズ(Breeze)共通する印象:技術 / 静けさ / 信頼。
この項目を引用する
辞典はリンクされるためにある。書いている場所に合う形をそのまま持っていってよい。
- Link
- https://indexstyle.org/ja/styles/sap-fiori
- Markdown
- [SAP Fiori(SAP Fiori) — デザインスタイル辞典](https://indexstyle.org/ja/styles/sap-fiori)
- HTML
- <a href="https://indexstyle.org/ja/styles/sap-fiori">SAP Fiori(SAP Fiori) — デザインスタイル辞典</a>