モバイルで ActionBar 廃止 TitleBar の primary action がアイコンボタンに

図解 ： モバイルで ActionBar 廃止 — TitleBar の primary action がアイコンボタンに Action Required App Bridge モバイルで ActionBar 廃止 TitleBar の primary action がアイコンボタンに 埋め込みアプリのモバイル表示で、画面下の「アイコン＋テキスト」バー（ActionBar）が消滅。primary action はヘッダー右上のアイコンボタンに、secondary actions はオーバーフローメニューに移動する。アイコン未指定だと + がデフォルト表示になる。 このページの構成 30秒で理解 ： 何が変わるのか 図解 ： モバイル表示の Before / After 変更点の詳細（3つ） 影響範囲と適用日 対応手順 技術者が押さえるべき5つのポイント 業務に活かせる3つのユースケース 提案で使える1行サマリ 1 30秒で理解 ： 何が変わるのか モバイルの埋め込みアプリで、 TitleBar に定義した primary action の表示場所が変わる。 これまで画面下部の「アイコン＋テキスト」バーに出ていたものが、 タイトルバー内のアイコンのみのボタン になる。secondary actions は オーバーフローメニュー へ集約される。 従来（モバイル） primary action は画面下の bottom bar に「アイコン＋テキスト」で表示。secondary actions も画面上に並ぶ。 変更後（モバイル） primary action はヘッダー右上の アイコンのみボタン に。secondary actions はオーバーフローメニューに収納されて一貫した UI に。 2 図解 ： モバイル表示の Before / After 変わるのは モバイルでのレンダリング（見た目と配置） 。 TitleBar に primary／secondary action を定義する API そのものは引き続き使う。デスクトップ表示についての言及は記事に 記載なし 。 3 変更点の詳細（3つ） 変更① primary action → ヘッダーのアイコンボタン これまでの「アイコン＋テキストの下部バー」ではなく、モバイルヘッダー内に アイコンのみのボタン として表示される。 変更② secondary actions → オーバーフローメニュー secondary actions は ⋯ のオーバーフローメニュー内に集約。モバイル UI の一貫性が高まる。 変更③ icon 未指定なら + がデフォルト primary action に icon プロパティを渡していない場合、自動的に ＋（プラス）アイコン が使われる。 4 影響範囲と適用日 項目 内容 影響を受けるアプリ TitleBar に primary action または secondary actions を定義している すべての埋め込みアプリ 適用日 2026年4月15日 対象アプリすべてに一斉適用 対応の要否 デフォルトの + アイコンで問題なければ 対応不要 適切なアイコンを出したい場合は icon の明示指定が必要 対象プラットフォーム モバイル（記事の対象）。デスクトップへの影響は 記載なし 5 対応手順 1 TitleBar の定義を確認 自アプリが primary／secondary action を TitleBar に定義しているか棚卸し。 2 + で十分か判断 デフォルトのプラスアイコンが文脈に合うなら、それ以上の対応は不要。 3 icon を明示指定 文脈に合うアイコンを出したい場合は primary action に icon プロパティを渡す。 記事が明示する対応は 「primary action に icon を渡す」 の一点。これでモバイルでも文脈に最も合うアイコンが表示される。 6 技術者が押さえるべき5つのポイント 1. モバイルの ActionBar は消える 画面下の「アイコン＋テキスト」バーという表示形態がモバイルから無くなる。下部バー前提のレイアウト想定は見直す。 2. icon 未指定は + にフォールバック 「保存」や「公開」など本来＋が不適切なアクションでも、未指定だとプラスで出てしまう。意図しないアイコンの誤読リスクに注意。 3. secondary は一段奥（オーバーフロー） secondary actions は ⋯ の中。タップ数が1つ増えるため、頻用アクションを secondary に置いていた場合は導線を再検討。 4. 全対象アプリに一斉・自動適用 2026年4月15日にオプトイン無しで全員に反映。リリースを止められないため、適用日までにアイコン指定の確認を済ませる。 5. テキストラベルが消える ＝ アイコンの自己説明力が重要 モバイルではボタンが アイコンのみ になり、従来あったテキストが見えなくなる。アクションの意味がアイコン単体で伝わるか（アクセシビリティ・タップ誤りの観点含め）を実機で要確認。具体的な API 名やコード例は記事に 記載なし のため、App Bridge / TitleBar の最新ドキュメントで実装方法を確認すること。 7 業務に活かせる3つのユースケース USE CASE 1 自社・受託の埋め込みアプリを適用日までに無事故で通す 課題 運用中の埋め込みアプリが TitleBar に primary action を持つが、icon を明示していない箇所があり、4/15 以降モバイルで意図しない + が出る恐れ。 打ち手 全アプリの TitleBar 定義を棚卸しし、primary action に文脈に合う icon を明示指定。secondary 多用画面はオーバーフロー化後の導線も確認。 効果 適用日後のUI崩れ・ユーザー混乱・問い合わせ増を未然に防止。 技術メモ 変更はモバイルレンダリングのみ。デスクトップ影響は記載なしのため、実機（モバイル）で Before/After を確認する。 USE CASE 2 モバイル導線の棚卸しと「アクション優先度」設計の見直し 課題 secondary actions に重要操作を複数置いていたが、オーバーフローメニュー化で1タップ奥に隠れ、利用率が落ちる懸念。 打ち手 アクションを「最重要1つ＝primary」「それ以外＝secondary」に再整理。最重要操作を primary に昇格させてヘッダーに常出させる。 効果 モバイルでの主要操作の到達性が向上し、操作完了率の維持・改善につながる。 技術メモ primary は1つに絞られる前提でアイコンの識別性を最優先。オーバーフロー内の並びと文言も合わせて見直す。 USE CASE 3 アイコン＋アクセシビリティのガイドラインを社内標準化 課題 テキストが消えてアイコン単体になるため、アプリごとに選ぶアイコンがバラつき、意味が伝わりにくくなる。 打ち手 「保存＝チェック、追加＝＋、編集＝鉛筆」など、操作とアイコンの対応表を社内ガイドラインとして整備し、全プロジェクトで icon 指定を必須化。 効果 納品物のUI品質が均一化し、ユーザーの学習コストとサポート問い合わせを削減。 技術メモ icon 未指定時の + フォールバックは「設計漏れの兆候」と捉え、レビュー時のチェック項目に入れると検知しやすい。 8 提案で使える1行サマリ 「2026年4月15日から、埋め込みアプリのモバイルで TitleBar の primary action が ヘッダーのアイコンボタン に、secondary はオーバーフローへ。 icon 未指定だと + が出る ので、適用日までに『primary action へ適切な icon を明示指定』のひと手間を。」 source ： shopify.dev/changelog/primary-action-icon-replaces-actionbar-on-mobile 公開日 ： 2026-04-10 ／ 適用日 ： 2026-04-15