アシスティブアクセスのためのアプリのカスタマイズ

アシスティブアクセスのためのアプリのカスタマイズ

アシスティブアクセスは、認知障がいのある方がiPhoneやiPadを一人で簡単に使えるようにする、目的が明確な独自のiOS体験です。iOSおよびiPadOS26では、アシスティブアクセスで実行時のアプリをカスタマイズして、より簡単で自立した使用を実現できます。AssistiveAccess SwiftUIシーンタイプを使ってアプリをカスタマイズする方法を学び、誰にとっても高品質なアシスティブアクセス体験を実現するための重要なデザイン原則を確認しましょう。

関連する章
- 0:00 - ようこそ
- 0:59 - アシスティブアクセスの紹介
- 4:09 - シーンの作成
- 7:08 - アプリのカスタマイズ
リソース
関連ビデオ

WWDC25
- SwiftUIの新機能
WWDC23
- アシスティブアクセスについて
こんにちはAnneです Appleの Accessibilityチームのメンバーです今日はアシティブアクセスについてお話できることを嬉しく思います認知障がいのある方のために Appleがすっきりと無駄のない iOS体験とiPadOS体験をデザインしましたアシスティブアクセスはアプリとコントロールの本質を突き詰めてデバイスの操作方法を見直すことにより誕生しました経験を明確にすることですべての人が自力で簡単にデバイスを操作できるようになりました iOS 26とiPadOS 26ではアシスティブアクセスのシーンタイプと組み合わせることで皆さんのアプリとこうした体験をシームレスに統合できます
今日はアシスティブアクセス内のアプリですばらしい体験を構築する方法を紹介します SwiftUIでアシスティブアクセスシーンを作成する方法やアプリの調整を進めるにあたって心に留めておくべき原則も取り上げます
まずアシスティブアクセスについて確認しておきましょう
AppleはiOS 17とiPadOS 17にアシスティブアクセスを導入しました
無駄を排したこのシステム体験は認知障がいのあるユーザーのために特別に設計されています操作の流れを整理して成功への道筋を明確に示すという一貫した設計慣行のもとでアプリとインターフェイスを提供して認知負荷の軽減を目指していますアシスティブアクセスが初めての方にはセッション「Meet Assistive Access」で詳細を紹介していますアシスティブアクセスはご覧の通りカメラやメッセージなど数種類の組み込みアプリに対応しています
これらアプリには共通のスタイルがありコントロールが大きめでインターフェイスに無駄がなくテキストを視覚的要素で補っていますアシスティブアクセスをベースに明確でわかりやすいデザイン言語を確立することで新しいUIを操作する場合にどうしても付きまとう認知的負担を軽減していますデザインは一貫していて期待される内容も一貫しています
デフォルトではアシスティブアクセス用に最適化されていないアプリは小さめのフレームで表示されますデバイス下部に常に表示されるボタン用のスペースを確保するためですボタンを押すとアプリ画面からホーム画面に移動しますこれまでに認知障がいのある方のためのアプリをデザインしたことがある場合はアプリをそのままアシスティブアクセスに移植することをお勧めしますそれを証明してくれる例が拡大代替コミュニケーションアプリ別名「AACアプリ」をサポートする場合です AACアプリのように認知障がいのある方のために設計したアプリがありこれと同じレイアウトと同じ体験をアシスティブアクセスでも実現したい場合はフルスクリーン表示のメリットを利用できる準備はできていますアプリをフルスクリーンで表示するにはアプリのInfo.plistで UISupportsFullScreenInAssistiveAccess キーをtrueに設定しますアプリの外観はアシスティブアクセスをオフにした状態と同じになり唯一の違いは縮小フレーム表示にならず画面の寸法いっぱいに表示されるという点ですランタイムのバリエーションが必要な場合は SwiftUIとUIKitのサポートを使用してアシスティブアクセスのセッションがアクティブであるか検出させます
アシスティブアクセスで全画面表示を採用しているアプリは「アクセシビリティ」設定のサポートアプリのリストに表示されます
アプリが認知障がいの支援用に設計されたものでない場合は iOS 26およびiPadOS 26への対応を機にアシスティブアクセスシーンを作成しましょうこのシーンタイプではカメラやメッセージなどの内蔵アプリでよく見る目立ちやすいスタイルでコントロールが自動的に表示されアプリにマッチした体験を提供しますフルスクリーンサポートとは違い画面のサイズ以外アプリは変更されません
進め方が分からない場合はアシスティブアクセス用に iOS 26とiPadOS 26が提供しているシーンを選んで便利に活用しましょうこのシーンによってアシスティブアクセスでアプリを引き立てる方法を紹介しますアシスティブアクセス採用アプリはわかりやすさ重視のデザインを共有しますそのわかりやすさはアシスティブアクセスを有効にしたときのネイティブのコントロールの独特の表示方法を見れば納得できます
このシーンタイプでは既存のスタイルになじむ形でアプリのコントロールがより大きくわかりやすいスタイルで表示されますなじみのあるデザインによって認知障がいのある方もアプリを最大限に活用できますアシスティブアクセスに対応するにはまず UISupportsAssistiveAccessの Info.plistキーを App Bundleでtrueに設定しますこれによりアプリが「アクセシビリティ」設定のサポートアプリのリストに表示されますアプリはデフォルトの縮小フレームではなくフルスクリーンで起動するようになります
次に AssistiveAccessシーンを採用してわかりやすいアプリ体験を構築します試してみましょう
私が構築していたアプリをアップデートしますこの描画アプリではキャンバスにスケッチしたり作品をフォルダやお気に入りに整理したりさまざまな編集ツールを使用して楽しくて魅力的なイラストを作成できます
SwiftUIのライフサイクルを採用していますこのシーンこれはメインコンテンツビューを宣言するウィンドウグループです
UISupportsAssistiveAccessをアプリのInfo.plistでtrueに設定したら AssistiveAccessシーンをアプリに追加します AssistiveAccessシーンで新しいコンテンツビューを作成してアシスティブアクセス用にデザインしたカスタム階層を使用します新しいコンテンツビューは無駄がなくより軽快なアプリ体験のベースになりますアシスティブアクセスでアプリを起動するとこのシーンを作成してアタッチします
シーンがアクティブになるとアプリ固有のSwiftUIコントロールがアシスティブアクセスらしいデザインで表示されますボタン、リスト、ナビゲーションタイトルはより目立つスタイルで表示されますが追加作業はありません
コントロールの表示は自動的にアシスティブアクセス設定で構成したグリッドまたは行のレイアウトに従います
シーンがアクティブな状態でのアプリのレイアウトをテストするには assitiveAccess特性を SwiftUIプレビューマクロに渡します
UIKitアプリの場合は iOS 26およびiPadOS 26のサポートにより UIKitライフサイクルアプリの SwiftUIシーンの定義とアクティブ化を行い同様のことができますシーン宣言クラスの静的プロパティrootSceneで UIKitから AssistiveAccess SwiftUIシーンを宣言しますシーンをアクティブにするにはアプリデリゲートから AssistiveAccessシーンをホストするよう構成されたシーンdelegateClassを返します
シーンブリッジングの詳細については今年のセッション「What’s New in SwiftUI」をご覧くださいアシスティブアクセスはシンプルで使いやすい操作を軸に構築されていますアシスティブアクセスのための準備ができたら次はアプリのコンテンツに注目しましょうここでアプリのコンテンツをアシスティブアクセス用に絞り込む際の指針になる原則をいくつか紹介しますアプリ体験について検討する際はアプリの本質を見極めましょう気をそらすような変化をなくし複数の方法で情報を伝え理解しやすくユーザーを支援する手順を構築できないか検討しましょう
まずはアプリの核になる機能を見極めましょうアプリでサポートするべき最も重要な機能を 1つか2つに絞り込んでアシスティブアクセスで実現します機能を削除すると操作の直感性が失われてしまいそうですが選択肢が少ないため気をそらす要因が減り全体的な認知負荷を軽減できます心配ならば引き続きシンプルで的が絞られたアシスティブアクセス体験を使いましょうこのアプリではアシスティブアクセスに 2つの機能を導入しますキャンバスにスケッチする機能と描画結果を表示する機能ですアプリのルートビューにはこれらUI要素だけを表示しますお気に入りをマークする機能やスケッチを編集する機能などアプリが提供するその他の機能は残しておきますアシスティブアクセスの外では体験重視の状態をキープしますデザイン見直し後のアプリのルートビューです先に特定しておいた2つの機能 DrawとGalleryを実装しています
2つの機能はナビゲーションリンクのリストとして表示されますアシスティブアクセスのシーンがアクティブになっているのでリンクは自動的にグリッドまたは行レイアウトのスタイルで表示されます
ビュー内でアシスティブアクセスのボタンを押すとアプリのナビゲーションスタックをさかのぼります追加作業は必要ありません
アプリはより的を絞ったものになりました画面上のUI要素はアプリの本質的な機能だけに絞り込まれ UI自体もおなじみのアシスティブアクセススタイルでの表示です操作経路も DrawとGalleryの2つを明確に示しました整理された選択肢に合わせてオプションの数を減らし選択肢を整理することでユーザーがアプリの操作をうまくやり遂げる可能性が高まりますアプリ体験を凝縮させる最適の方法が決まったらある程度のカスタマイズを加えることも可能ですアシスティブアクセスに機能を追加する方法を紹介しますアシスティブアクセスに取り組む際は目的はあくまで認知的負担の軽減であることをお忘れなく
豊富な機能やカスタマイズによってアプリの完成度は高まりますが認知障がいのある方にとっては画面に大量のコンテンツが表示されると難易度が上がってしまう可能性があります意思決定に集中できるよう表示するオプションの数は抑えましょうこれは画面に表示する要素の数とビューの目的の両方に適用するべき原則ですオプションを減らすことでアプリ操作中に気が散る原因がなくなりますオプションが多すぎると圧倒されてしまい認知的負荷が増大しかねません次に表示されるコントロールははっきりと見えるようにしましょうわかりにくいジェスチャや入れ子状のUIは避けましょうこのような操作は認知障がいのある方には見つけにくい場合があります代わりにはっきりと見やすく目立ちやすいコントロールを使用しましょう
アプリを操作する速度は人それぞれに異なります誰でも自分のペースでタスクを完了できるよう時間制限は避けましょうタイムアウト後にUIやビューが消えたりステータスが変化したりする場合は体験のデザインを見直しましょうアプリの操作を無事に完了させられるよう十分な時間を設けましょう
アシスティブアクセスでは選択プロセスを通じてユーザーを導くよう体験をデザインします複数のオプションを一度に提示するのではなく一歩一歩段階的に進められるようなフローを構築しましょう適切なステップ数でユーザーを導くようにしましょう完了までのプロセスが長すぎるとやる気が損なわれてしまいます
カスタマイズを追加する場合はゆっくりと慎重に行うよう注意しましょう特定の決定を行う順序の入れ替えが必要になる場合があります決定は1つずつ順を追って行うよう徹底しましょうこれにより認知機能への負担が軽減されより快適なアプリ体験を実現できます一部の重要なアクションには実行後の復旧が難しいものがあります写真の削除などですねこうした機能は完全に取り除くことを検討しましょうまたは削除のようにより恒久的なアクションの実装を予定している場合必要に応じて2回確認を求めるようにしましょう目指すのはユーザーが本来意図していなかった状況に陥らないようにすることです
ここまで提示するオプションの数を減らしたり UIを目立たせたり操作に時間制限を設けないなどアシスティブアクセスにおけるベストプラクティスを紹介しました段階を追ったガイド付きのフローを構築する方法やユーザーの気をそらすアクションを突き止め見直す方法も紹介しましたこれらのデザインガイドラインを私のアプリにも適用してみましょう
アプリのアシスティブアクセス体験に描画色変更へのサポートを追加しますアシスティブアクセスが無効の場合描画色の選択にはカラーピッカーを使用します
不透明度などのカラーピッカーオプションが便利に働くアプリもありますが私のアプリは色があれば十分ですこの点は調整しておきましょう
選択肢を減らすためアシスティブアクセス用にアプリ専用の色選択ビューをデザインしましたカラーピッカーの機能を見直して決定すべき項目を線つけ色の 1つに絞り込みました選択できる色の数も数色に減らしました描きたい色をタップするだけです
Drawオプションと Canvas入力の間にこのビューを追加しましたこうした段階的なアプローチによってアプリを使用する誰もが色の選択を済ませた状態でキャンバスにたどり着けますカラーピッカーではキャンバス内のオプションとして色を選択しますがそれとは操作の順番が異なる点に注意してくださいここでは色の選択という決定を 1つのビューとして独立させ常にキャンバスに到着する手前で表示させるようにしています混乱を招きそうな機能や元に戻すのが難しそうな機能もアプリから削除しましたキャンバスビューにはストロークを元に戻す機能がありません
ギャラリーには作品を削除するオプションがありませんこのような判断に至ったのはユーザーの意図していなかったアクションを実行してしまうリスクを取り除くことで安全でユーザー支援を重視した環境を作るためでしたアシスティブアクセスの肝となるのが直感的で理解しやすいデザインです認知障がいのある一部の方にとっては画像とアイコンがあればテキスト単体の場合よりも理解しやすくなりますつまり情報は複数の方法で提示する必要があるのですテキストだけに頼るのではなくアシスティブアクセスでアプリを実行している間は視覚的な代替手段も使って意味を伝えましょうボタンやナビゲーションリンクなどのコントロールを実装する際はアイコンとラベルの両方を使いましょう
アシスティブアクセスではナビゲーションバーでアイコンをサポートしていることもありナビゲーションタイトルにもビジュアルデザインが適用されています
アプリでこれを実装するにはアシスティブアクセスナビゲーションアイコン修飾子を使用して画像またはシステム画像の名前を渡しますこれでアシスティブアクセスのシーンがアクティブ状態のときアイコンがナビゲーションタイトル横に表示されますすべてのナビゲーションタイトルにアイコンを添えるよう徹底しましょう
認知障害のある方のためにデザインする方法を学んだところで SwiftUIシーンを採用してアプリをアシスティブアクセスに展開しましょうセッションで説明したデザイン演習を皆さんのアプリで実行してみましょうアシスティブアクセスのサポート対象である体験に集中してこれを洗練させるという目標を常に意識しましょう最後にひとつフィードバックの情報源としてユーザーに勝るものはありませんアシスティブアクセスのコミュニティ内でテストする機会を見つけましょうご視聴ありがとうございましたアプリをすべての人のために設計してくださることに感謝します

5:21 - Create a scene for Assistive Access

// Create a scene for Assistive Access

import SwiftUI
import SwiftData

@main
struct WWDCDrawApp: App {
  var body: some Scene {
    WindowGroup {
      ContentView()
        .modelContainer(for: [DrawingModel.self])
    }
    AssistiveAccess {
      AssistiveAccessContentView()
          .modelContainer(for: [DrawingModel.self])
    }
  }
}

6:25 - Display an Assistive Access preview

// Display an Assistive Access preview

import SwiftUI

struct AssistiveAccessContentView: View {
  @Environment(\.modelContext) var context
  var body: some View {
    VStack {
      Image(systemName: "globe")
        .imageScale(.large)
        .foregroundStyle(.tint)
      Text("Hello, world!")
    }
    .padding()
  }
}

#Preview(traits: .assistiveAccess)
    AssistiveAccessContentView()
}

6:35 - Declare a SwiftUI scene with UIKit

// Declare a SwiftUI scene with UIKit

import UIKit
import SwiftUI

class AssistiveAccessSceneDelegate: UIHostingSceneDelegate {

  static var rootScene: some Scene {
    AssistiveAccess {
      AssistiveAccessContentView()
    }
  }
    
    /* ... */
}

6:55 - Activate a SwiftUI scene with UIKit

// Activate a SwiftUI scene with UIKit

import UIKit

@main
class AppDelegate: UIApplicationDelegate {
  func application(_ application: UIApplication, configurationForConnecting connectingSceneSession: UISceneSession, options: UIScene.ConnectionOptions) -> UISceneConfiguration {
    let role = connectingSceneSession.role
    let sceneConfiguration = UISceneConfiguration(name: nil, sessionRole: role)
    if role == .windowAssistiveAccessApplication {
      sceneConfiguration.delegateClass = AssistiveAccessSceneDelegate.self
    }
    return sceneConfiguration
  }
}

14:36 - Display an icon alongside a navigation title

// Display an icon alongside a navigation title

import SwiftUI

struct ColorSelectionView: View {
  var body: some View {
    Group {
      List {
        ForEach(ColorMode.allCases) { color in
          NavigationLink(destination: DrawingView(color: color)) {
            ColorThumbnail(color: color)
          }
        }
      }
      .navigationTitle("Draw")
      .assistiveAccessNavigationIcon(systemImage: "hand.draw.fill")
    }
  }
}

- 0:00 - ようこそ
- Apple's Accessibility team has developed Assistive Access, a new feature for iOS and iPadOS 26, which simplifies the device interface for users with cognitive disabilities. The feature focuses on essential apps and controls, enhancing navigation and independence. Developers can integrate their apps using the Assistive Access scene type in SwiftUI, following specific principles to create a user-friendly experience.
- 0:59 - アシスティブアクセスの紹介
- Apple introduced Assistive Access in iOS and iPadOS 17, a feature designed to simplify the system experience for users with cognitive disabilities. The feature offers streamlined interactions, clear pathways, and consistent design practices across a few distilled built-in apps like Camera and Messages, which have large controls and visual alternatives to text. Apps not optimized for Assistive Access are displayed in a reduced frame with a persistent back button. Developers of apps already designed for cognitive disabilities can enable full-screen mode for their apps within Assistive Access. For developers of non-optimized apps, support will be available in iOS and iPadOS 17, allowing them to create tailored experiences with automatically displayed controls in a familiar style.
- 4:09 - シーンの作成
- In Assistive Access, apps are designed with clarity in mind, utilizing a larger, clearer control style for native controls. To enable this, developers set a specific key in the app bundle to true, which lists the app as optimized and launches it in full screen. Developers then create a separate Assistive Access scene within their app, which presents a streamlined and lightweight version of the interface. This scene automatically displays native controls in a more prominent, grid-based style, enhancing usability for people with cognitive disabilities. For SwiftUI apps, this is achieved by adding a new content view within the Assistive Access scene. UIKit apps can also support this feature by defining and activating SwiftUI scenes from the scene delegate class.
- 7:08 - アプリのカスタマイズ
- To optimize an app for Assistive Access, developers should distill the app to its core functionality, focusing on one or two essential features. This streamlined approach reduces distractions and cognitive load. The app's interface should be designed with clear, prominent controls, and avoid hidden gestures or timed interactions. Information should be presented in multiple ways, such as using icons and labels alongside text. Navigation should be intuitive and step-by-step, with back buttons automatically conforming to the preferred layout style. Developers should also consider removing potentially confusing or irreversible actions, or providing multiple confirmations for such actions. Also, consider reducing selectable options in cases where it makes sense to do so such as replacing a color picker with a discrete set of selectable colors. By following these guidelines, developers can create a safe, supportive, and user-friendly experience for individuals with cognitive disabilities.

関連する章

リソース

関連ビデオ

WWDC25

WWDC23