Japan Apple Pay Development

日本のApple Pay開発

第7回ペパボテックカンファレンス～ minneアプリのミライ～
https://pepabo.connpass.com/event/49081/

Transcript

1. Japan
   Apple Pay
   Development
   1&1"#05FDI$POG
   !OBLBKJKBQBO
   

   View Slide

2. View Slide

3. @nakajijapan
   GMO PEPABO inc.
   Principal Engineer
   iOS / Web / OS X
   shibuya.swift
   About Me
   Daichi Nakajima
   

   View Slide

4. NKJMultiMovieCaptureView
   NKJMovieComposer
   NKJPagerViewController
   PhotoSlider
   Teiten
   GitHub
   Sengiri
   Shari
   frustration.me
   Kazaguruma
   

   View Slide

5. ϋϯυϝΠυ࡞඼Λ
   ചΕΔɺങ͑Δɻ
   ࠃ಺࠷େڃͷ
   ϋϯυϝΠυϚʔέοτ
   

   View Slide

6. View Slide

7. Apple Pay JP
   launch partner
   

   View Slide

8. Agenda
   • What is Apple Pay?
   • Background
   • Project
   • Required features
   • Problems
   • Conclusion
   

   View Slide

9. Apple Pay
   

   View Slide

10. Apple Pay
    • User
    • Easy
    • No need to re-enter payment and contact information
    • Secure
    • Pay using Touch ID
    • Private
    • Card number not expose to the merchant
    

    View Slide

11. Apple Pay
    • Developer
    • Don't need to handle actual card numbers
    • Higher conversion rates and faster checkouts
    • No onboarding or existing accounts required
    

    View Slide

12. Ͱ͔͍
    Demo
    

    View Slide

13. Apple Pay
    "EE$BSU
    4FMFDU
    4UPDL
    4FMFDU
    1BZNFOUNFUIPE
    $POpSNBUJPO $PNQMFUJPO
    

    View Slide

14. Apple Pay
    "EE$BSU
    4FMFDU
    4UPDL
    4FMFDU
    1BZNFOUNFUIPE
    $POpSNBUJPO $PNQMFUJPO
    $POpSNBUJPO $PNQMFUJPO
    "QQMF1BZ
    #VUUPO
    

    View Slide

15. Apple Pay
    "EE$BSU
    4FMFDU
    4UPDL
    4FMFDU
    1BZNFOUNFUIPE
    $POpSNBUJPO $PNQMFUJPO
    $POpSNBUJPO $PNQMFUJPO
    "QQMF1BZ
    #VUUPO
    Simple!!!!
    

    View Slide

16. Background
    

    View Slide

17. ʊਓਓਓਓਓʊ
    ʼɹಥવͷɹʻ
    ʉY^Y^Y^Y^Yʉ
    

    View Slide

18. “ࣾ௕௚׋ϓϩδΣΫτ”
    

    View Slide

19. ۃൿϛογϣϯ
    

    View Slide

20. Project
    

    View Slide

21. Member
    • ॳظ
    • nakajijapan
    

    View Slide

22. Member
    • ։ൃ࣌
    • ϝϯόʔ
    • Mobile 2
    • Web 3
    • Designer 1
    

    View Slide

23. Source Management
    • ׬શʹ੾Γ཭ͯ͠ൿີཪʹ։ൃ
    • ެࣜൃදޙPull Request
    • ฒߦͯ͠։ൃ͍ͯͨ͠΋ͷ͸࠷ऴஈ֊ͰϚʔδ
    • ಉ࣌͡ظʹಉ͡StoryboardΛฤू͍ͯͨ͠
    

    View Slide

24. Sorry, we could not display the entire diff
    because too many files (472) changed.
    

    View Slide

25. Sorry, we could not display the entire diff
    because too many files (472) changed.
    
    

    View Slide

26. Required Features
    

    View Slide

27. Required Features
    • Mobile
    • Session 702 #WWDC16
    • Web
    • Session 703 #WWDC17
    

    View Slide

28. Design
    • Defaulting
    • σϑΥϧτͱͯ͠ଘࡏ͢΂͖
    • Upstream
    • ۃྗ্ྲྀʹϘλϯ͸഑ஔ͞ΕΔ΂͖
    

    View Slide

29. Defaulting
    

    View Slide

30. Upstream
    "EE$BSU
    4FMFDU
    4UPDL
    4FMFDU
    1BZNFOUNFUIPE
    $POpSNBUJPO $PNQMFUJPO
    ❌
    

    View Slide

31. Payment
    • Account which already registered
    • ……
    

    View Slide

32. Apple Pay
    • Developer
    • Don't need to handle actual card numbers
    • Higher conversion rates and faster checkouts
    • No onboarding or existing accounts required
    

    View Slide

33. Payment
    • Account which already registered
    • Guest
    

    View Slide

34. Problems
    

    View Slide

35. Anonymize
    

    View Slide

36. Situation
    • Ϣʔβ৘ใͷೖྗ͕ඞਢ
    • νΣοΫ͸ࣗલͰߦ͏ඞཁ͋Γ
    

    View Slide

37. PKPaymentAuthorizationViewControllerDelegate
    func paymentAuthorizationViewController(
    controller: PKPaymentAuthorizationViewController,
    didSelectShippingContact contact: PKContact,
    completion: (PKPaymentAuthorizationStatus, [PKShippingMethod],
    [PKPaymentSummaryItem]) -> Void) {
    

    View Slide

38. Problem
    • ໊લΛ࿈བྷઌ͔Βऔಘ͢Δ࣌
    • ձ໊͚ࣾͩͷ৔߹ɺ໊લ͕ۭʹͳΔ
    • ΤϥʔνΣοΫ͕͞Ε͍ͯͳ͍ʂʂ
    • μϝͳͷͰ͸ʁ
    

    View Slide

39. Problem
    • ϓϥΠόγʔ੍ݶ͕͋Δ
    • ඞཁͳ࣌ʹඞཁͳ৘ใ͔͠औಘͰ͖ͳ͍
    • ίετͷܭࢉʹ໊લ͸͍Βͳ͍ʂ
    

    View Slide

40. Problem
    • Contact
    • A contact object representing the new shipping address. To maintain
    privacy, the shipping information is anonymized. For example, in the
    United States it only includes the city, state, and zip code. This provides
    enough information to calculate shipping costs, without revealing
    sensitive information until the user actually approves the purchase.
    IUUQTEFWFMPQFSBQQMFDPNSFGFSFODFQBTTLJUQLQBZNFOUBVUIPSJ[BUJPOWJFXDPOUSPMMFSEFMFHBUFQBZNFOUBVUIPSJ[BUJPOWJFXDPOUSPMM
    

    View Slide

41. Solution
    • ໊લͷνΣοΫ͸ܾࡁ࣌ʹߦ͏
    

    View Slide

42. PKPaymentButton
    

    View Slide

43. View Slide

44. Situation
    • Apple Payະઃఆ࣌
    • Χʔυొ࿥ը໘΁
    • ొ࿥ޙɺߪೖͰ͖ΔΑ͏ʹ͢Δ
    

    View Slide

45. Demo
    

    View Slide

46. PKPayment Button
    let paymentButton = PKPaymentButton(type: .SetUp, style: .Black)
    

    View Slide

47. PKPayment Button
    let paymentButton = PKPaymentButton(type: .SetUp, style: .Black)
    paymentButton.state = .buy
    

    View Slide

48. Problem
    • Ϙλϯ͕ߋ৽͞Εͳ͍
    

    View Slide

49. let paymentButton = PKPaymentButton(type: .SetUp, style: .Black)
    paymentButton.state = .buy
    PKPayment Button
    ❌
    

    View Slide

50. PKPayment Button
    public class PKPaymentButton : UIButton {
    public convenience init(type buttonType: PKPaymentButtonType, style
    buttonStyle: PKPaymentButtonStyle)
    @available(iOS 9.0, *)
    public init(paymentButtonType type: PKPaymentButtonType,
    paymentButtonStyle style: PKPaymentButtonStyle)
    }
    • ΠϯελϯεԽ͔͠ڐ͞Εͳ͍ʂ
    

    View Slide

51. Solution
    • ߋ৽(reloadData())ຖʹΠϯεϯλεԽ͢Δඞཁ͕
    ͋Δ
    

    View Slide

52. Solution
    paymentButton?.removeFromSuperview()
    // ΫϨδοτΧʔυ͕ηοτΞοϓࡁΈ͔
    if PKPaymentAuthorizationViewController.canMakePaymentsUsingNetworks(
    ApplePaymentManager.supportedPaymentNetworks) {
    paymentButton = PKPaymentButton(type: .Buy, style: .Black)
    } else {
    paymentButton = PKPaymentButton(type: .SetUp, style: .Black)
    }
    applePayBackgroundView.addSubview(paymentButton)
    

    View Slide

53. Contacts
    

    View Slide

54. Contacts
    

    View Slide

55. Problem
    • ήετߪೖ
    • Apple PayΛར༻͠ͳ͍έʔε
    • ࿈བྷઌͷೖྗ͕ͩΔ͍
    

    View Slide

56. Solution
    • ࿈བྷઌ͔Βͷࣗಈೖྗ
    • ৘ใ͕ෳ਺͋Δ৔߹͸ActionSheetͰ௨஌
    • ௨ৗͷߪೖϓϩηεͰ΋ೖྗΛۃྗ؆୯ʹ
    

    View Slide

57. import ContactsUI
    • ࿈བྷઌʹΞΫηεͰ͖Δ
    • CNContactPickerViewController
    func contactPicker(picker: CNContactPickerViewController,
    didSelectContact contact: CNContact) {
    picker.dismissViewControllerAnimated(true)
    

    View Slide

58. import Contacts
    • બ୒ͨ͠৘ใCNContact͔Β֤ʑ͢Δ
    public class CNContact : NSObject, NSCopying, NSMutableCopying,
    NSSecureCoding {
    (..snip..)
    public var phoneNumbers: [CNLabeledValue] { get }
    public var emailAddresses: [CNLabeledValue] { get }
    public var postalAddresses: [CNLabeledValue] { get }
    public var urlAddresses: [CNLabeledValue] { get }
    

    View Slide

59. import Contacts
    • ϥϕϧ
    public class CNLabeledValue : NSObject, NSCopying, NSSecureCoding {
    public var identifier: String { get }
    public var label: String? { get }
    @NSCopying public var value: protocol
    { get }
    public init(label: String?, value: protocolNSSecureCoding>)
    (..snip..)
    

    View Slide

60. public class CNLabeledValue : NSObject, NSCopying, NSSecureCoding {
    public var identifier: String { get }
    public var label: String? { get }
    @NSCopying public var value: protocol
    { get }
    public init(label: String?, value: protocolNSSecureCoding>)
    (..snip..)
    import Contacts
    • ϥϕϧ
    

    View Slide

61. Demo
    

    View Slide

62. more
    

    View Slide

63. IUUQUFDIQFQBCPDPNBQQMFQBZJOKBQBO
    

    View Slide

64. Conclusion
    

    View Slide

65. Coclusion
    • Apple Payࣗମٕज़తͳ೉͘͠ͳ͍
    • ৭ʑͭ·ͮ͘Օॴ͕͋Δ
    • UIΛΑΓΑ͘͢ΔͨΊʹෳ਺ͷFrameworkΛཧղ
    ͢Δඞཁ͋Γ
    

    View Slide

66. Coclusion
    • Apple Payࣗମٕज़తͳ೉͘͠ͳ͍
    • ৭ʑͭ·ͮ͘Օॴ͕͋Δ
    • UIΛΑΓΑ͘͢ΔͨΊʹෳ਺ͷFrameworkΛཧղ
    ͢Δඞཁ͋Γ
    • ൿີ͸΍ΊΑ͏
    

    View Slide

67. • Apple Payࣗମٕज़తͳ೉͘͠ͳ͍
    • ৭ʑͭ·ͮ͘Օॴ͕͋Δ
    • UIΛΑΓΑ͘͢ΔͨΊʹෳ਺ͷFrameworkΛཧղ
    ͢Δඞཁ͋Γ
    • ൿີ͸΍ΊΑ͏
    Coclusion
    ߪೖମݧ͕γϯϓ
    ϧʹͳΔʂʂʂʂ
    

    View Slide

68. Coclusion
    • ϏδωεαΠυ
    • ΫϨδοτΧʔυΛରԠ͢Δͷ͸ඞਢ
    • ⭕ Master ❌ JCB ❓ Visa
    

    View Slide

69. Thanks.
    
    

    View Slide