Walletはチケットだけじゃない？オリジナルのプロフィールカードをつくってみる

iOSDC2026 ルーキーズLT

Transcript

1. 􀊵 Walletはチケットだけじゃない？ オリジナルのプロフィールカードをつくってみる さき(sakky)/@am2525nyan 1
2. 􀊵 iOSDCでお友達増やしましたか？ 2
3. 􀊵 Walletにプロフィールカードを入れたい ※iOS27の正式リリース前のため、完成イメージは手書きイラストを代わりに載せています 3
4. 􀊵 Walletにプロフィールカードを入れたい こんな感じのプロフィールカードがあったら便利! 4
5. 􀊵 みなさんも入れたいですよね？ 5
6. ※Walletに追加できるのはiOS27~です！iOS26の方もPreviewで確認できます！ ※iOS27の正式リリース前のため、スライドは手書きイラストを代わりに載せています fi 􀊵 MyPro lePass 6
7. 􀊵 実は前から作れた ✈TestFlight 7
8. 􀊵 実は前から作れた ✈TestFlight 8
9. 􀊵 実は前から作れた ✈TestFlight 9
10. 􀊵 実は前から作れた //pass.json { "primaryFields" : [ { "_id" : "CBD6019F-1681-46A0-BA22-1C4CB8CA6F29", "key" : "NAME_ID", "textAlignment" : "PKTextAlignmentNatural", "value" : "SAKI HOSONUMA" }, ] }, … ✈TestFlight 10
11. 􀊵 WWDC26から新しい制作の方法が登場 • Pass Designer • 見た目とフィールドを設計 • 見た目のテンプレを作る • Pass Builder • Swiftのライブラリおよび コマンドラインツール • データの差し込みや署名 ✈TestFlight 11
12. 􀊵 Pass Designer ✈TestFlight 画像置き換えする What's new in Walletより引用 https://developer.apple.com/jp/videos/play/wwdc2026/209/?time=347 12
13. 􀙅􀫊 􀑢 􀊵 Pass Builder Apple Walletを作成、検証、署名する、Swiftライブラリ Swift Build AirDrop ✈TestFlight 13
14. 􀊵 Pass種類の比較 Boarding Pass Store Card Coupon Generic Pass Event Ticket Generic Poster Pass 14
15. 􀊵 Generic Poster Pass • iOS27~ • 文字情報がたくさん入れられる • 背景画像が大きい 15
16. 􀊵 Generic Poster Pass • iOS27~ • 文字情報がたくさん入れられる • 背景画像が大きい プロフィールカードに良さそう！ 16
17. 􀊵 Generic Poster Pass • Header Fields • Birthday • Primary Fields • Name • University • Footer • Favorite • Background • Barcode 17
18. 􀊵 Generic Poster Pass • Header Fields • Birthday • Primary Fields • Name • University • Footer • Favorite • Background • Barcode 18
19. 􀊵 Generic Poster Pass • Header Fields • Birthday • Primary Fields • Name • University • Footer • Favorite • Background • Barcode 19
20. 􀊵 KEYを登録する What's new in Walletより引用 https://developer.apple.com/jp/videos/play/wwdc2026/209/?time=347 20
21. 􀊵 Pass Builder ✈TestFlight 21
22. var pass = try PassPackage(url: con guration.templateURL) pass.pass. elds.setValue( "SAKI HOSONUMA" , forKey: "NAME_ID") pass.pass. elds.setValue( "Digital Hollywood", forKey: "UNIVERCITY_ID") pass.pass. elds.setValue("Swift/iOS Engineer", forKey: "FOOTER_ID") ✈TestFlight fi fi fi 22 fi 􀊵 Swiftからプロフィールを差し込む
23. 􀊵 Swiftからプロフィールを差し込む 23
24. Certi cates.p12 Pass Type ID証明書＋秘密鍵 ✈TestFlight + AppleWWDRCAG4.cer AppleのWWDR中間証明書 PassSigner→署名済みのプロフィールカード 24 fi 􀊵 署名して生成する
25. //pass用の証明書を読み込む let passCerti cate = try PassCerti cate( url: con guration.passCerti cateURL, password: con guration.certi catePassword ) fi fi fi fi fi 25 fi 􀊵 署名して生成する
26. //pass用の証明書を読み込む let passCerti cate = try PassCerti cate( url: con guration.passCerti cateURL, password: con guration.certi catePassword ) //WWDR中間証明書を読み込む let wwdrCerti cate = try PassCerti cate(url: con guration.wwdrCerti cateURL) //証明書をまとめる let signer = PassSigner(passCerti cate: passCerti cate, wwdrCerti cate: wwdrCerti cate) fi fi fi fi fi fi fi fi fi fi fi fi fi 26 fi 􀊵 署名して生成する
27. //pass用の証明書を読み込む let passCerti cate = try PassCerti cate( url: con guration.passCerti cateURL, password: con guration.certi catePassword ) //WWDR中間証明書を読み込む let wwdrCerti cate = try PassCerti cate(url: con guration.wwdrCerti cateURL) fi fi fi fi fi fi fi fi fi fi fi fi fi //証明書をまとめる let signer = PassSigner(passCerti cate: passCerti cate, wwdrCerti cate: wwdrCerti cate) //署名する _ = try await signer.signPass( pass, destination: outputURL, options: [.zipOutput, .overwriteExisting] ) fi 􀊵 署名して生成する 27
28. 􀊵 walletに！ ✈TestFlight 28
29. 􀊵 作ってみた感想 • プレビューしながら比較できた • PassにもHuman Interface Guidelinesがある • PassDesignerとPass Builderを使うことで、デザインとデータを分けて扱い やすくなった https://developer.apple.com/jp/design/human-interface-guidelines/wallet ✈TestFlight 29
30. 􀊵 自己紹介 細沼咲希 (sakky) • 👩💻デジタルハリウッド大学3年生 • ピクシブ株式会社でアルバイト • CA Tech Lounge • ネイル💅/テーマパーク🎡 ✈TestFlight X • The Composable Architecture • X: am2525nyan 30