Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Native macOS application, or the world of AppKit

1024jp
March 21, 2019

Native macOS application, or the world of AppKit

presentation slides for "try! Swift Tokyo 2019"
video: https://youtu.be/lSiwCAQVKQk

1024jp

March 21, 2019
Tweet

More Decks by 1024jp

Other Decks in Technology

Transcript

  1. title:
    presenter:
    place:
    date:
    Native macOS application, or the world of AppKit
    try! Swift 2019
    2019-03-21
    1024jp
    ʢnative macOS applicationɺ·ͨ͸AppKitͷੈքʣ

    View full-size slide

  2. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    Who’s 1024jp ?
    academic researcher in real life
    Dr. 1024jp

    View full-size slide

  3. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    Who’s 1024jp ?
    CotEditor Gapplin Qli
    application work
    plain-text editor SVG viewer movie player
    macOS
    meet-up
    hobby macOS developer/designer
    @1024jp
    icon work
    (academic researcher in real life)

    View full-size slide

  4. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    CotEditor
    lightweight plain-text editor

    written in pure Swift + Cocoa
    github.com/coteditor

    View full-size slide

  5. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    CotEditor
    Seriously, I tried hundreds of different text editors,
    I'm extremely picky and I couldn't believe I found
    this one. Tons of features and customization
    options, but also straight to the point and really
    fast. Excellent code formatting, excellent
    native, minimal UI. No useless extra features
    or weird themes. It launches instantly on any
    machine. I use CotEditor every single day for every
    text related task, and it's all I need.
    #1 text editor for Mac
    Nov 10, 2018 | Italy
    ˒˒˒˒˒
    I was looking for another really light-weight
    multipurpose editor with proper syntax highlighting
    that was Cocoa native. This will finally replace
    Smultron which I loved until the developer thought
    he was a designer and fubar'd the UI. Particularly
    love being able to customise line height, because
    this is too often forgotten, Kudos for this app.
    Finally, another lightweight and simple editor
    Jul 14, 2017 | Japan ˒˒˒˒˒
    This is the one what I'm looking for whole this time.
    I was looking for simple text editor with mac
    os interface elements and some basic
    features. I gave up searching. I decided to develop
    one on my own. And, I almost start to develop.
    Then, I found this app. It's saves my time.

    My request: Only I missing is project file directory
    as sidebar.
    This is the One
    Dec 1, 2018 | Sri Lanka
    ˒˒˒˒˒
    Great code editor! /* Please add a left Sidebar */
    Simple, Powerful, and True to macOS UI
    Feb 1, 2019 | United States ˒˒˒˒˒
    4.7
    out of 5
    346
    37
    11
    4
    8
    ˒˒˒˒˒
    ˒˒˒˒
    ˒˒˒
    ˒˒
    ˒

    View full-size slide

  6. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    Survey
    ʢௐࠪʣ

    View full-size slide

  7. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    Survey | Q1
    Experienced developing a macOS app using AppKit
    ʢAppKitΛ࢖ͬͨmacOSΞϓϦέʔγϣϯͷ։ൃܦݧ͕͋Δʣ

    View full-size slide

  8. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    Survey | Q2
    Develop macOS apps still actively
    ʢࠓͰ΋׆ൃʹmacOSΞϓϦέʔγϣϯΛ։ൃ͍ͯ͠Δʣ

    View full-size slide

  9. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    Survey | Q3
    Code Swift mainly on Mac
    ʢීஈMacͰSwiftΛॻ͍͍ͯΔʣ

    View full-size slide

  10. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    Subject of this talk
    developing native macOS application
    ① ②

    View full-size slide

  11. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    What’s a native macOS application?
    programming language Swift / Obj-C
    framework Cocoa
    UI design macOS Human Interface Guidelines
    ?
    ?
    ?
    ʢϓϩάϥϜݴޠʣ
    ʢϑϨʔϜϫʔΫʣ
    ʢϢʔβΠϯλʔϑΣΠεઃܭʣ

    View full-size slide

  12. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    “an application that is designed for macOS”
    “Native”
    native | ˈneɪtɪv |

    1 associated with the place or circumstances of a person's birth: …

    2 (of a plant or animal) of indigenous origin or growth: …

    3 (of a quality) belonging to a person's character from birth; innate: …

    4 (of a metal or other mineral) found in a pure or uncombined state.

    5 Computing designed for or built into a given system, especially
    denoting the language associated with a given processor,
    computer, or compiler, and programs written in it.
    (特定のシステムに向けて
      設計もしくはビルドされた)
    Oxford Dictionary of English
    ʢmacOSͷͨΊʹઃܭ͞ΕͨΞϓϦέʔγϣϯʣ

    View full-size slide

  13. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    “Native”
    ab$#inu@ moof!
    non-native language
    ʢඇωΠςΟϒͳݴޠʣ
    ?
    what want to say
    ʢݴ͍͍ͨ͜ͱʣ
    listener
    ʢฉ͖खʣ

    View full-size slide

  14. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    Importance of native in macOS applications

    View full-size slide

  15. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    Application’s domain in display
    macOS app
    iOS app
    control the entire display.
    ʢը໘͢΂ͯΛࢧ഑ʣ
    control only a part of the display.
    ʢը໘Ұ෦ͷΈࢧ഑ʣ

    View full-size slide

  16. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    Window to content
    content
    ʢຊ࣭ʣ
    window
    ʢ΢Πϯυ΢=૭ʣ
    user
    ʢϢʔβʣ

    View full-size slide

  17. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    application

    content
    application

    content
    Window to content
    macOS app
    iOS app
    frame = device
    ʢ࿮ʹσόΠεʣ
    frame = window
    ʢ࿮ʹ΢Πϯυ΢ʣ

    View full-size slide

  18. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    CotEditor File Edit Format View Text Find Window Help

    Physical objects in macOS
    Moof!

    View full-size slide

  19. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    System features among applications
    App A
    App B
    App C
    App A App A

    View full-size slide

  20. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    Titlebar
    Example
    highlight
    toolbar button
    document icon
    titlebar
    standard titlebar
    ʢඪ४తͳλΠτϧόʔʣ
    cross section
    ʢஅ໘ʣ

    View full-size slide

  21. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    Titlebar
    Example

    modern? titlebar
    ʢϞμϯͳʁλΠτϧόʔʣ
    index.html

    View full-size slide

  22. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    Titlebar
    Example

    View full-size slide

  23. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    Titlebar
    Example

    modern? titlebar
    ʢϞμϯͳʁλΠτϧόʔʣ

    View full-size slide

  24. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    Integrate into platform culture

    View full-size slide

  25. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    Developer’s ego
    aim
    application
    user
    ʢϢʔβʣ ʢΞϓϦέʔγϣϯʣ ʢ໨తʣ
    developer
    ʢ։ൃऀʣ

    View full-size slide

  26. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    Skill-set for GUI application development
    ʢίʔσΟϯάʣ
    ʢ͓ֆ͔͖ʣ
    ʢઃܭʣ
    Designing
    Coding
    Drawing
    Aesthetic work
    – Creating visual components
    – Determining color scheme
    – …
    Programming work
    – Implementing features
    – Performance optimization
    – …
    Planning work
    – Shaping the future direction of apps
    – Designing UI/UX
    – …

    View full-size slide

  27. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    Tools for native macOS application
    AppKit’s APIs

    View full-size slide

  28. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    Tools for native macOS application
    AppKit’s APIs macOS HIG
    +

    View full-size slide

  29. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    How about Marzipan?
    “iOS-style Mac app is just a good-looking Electron”
    ʢiOS෩ͷMac App͸ͨͩͷΩϨΠͳElectronͰ͔͠ͳ͍ʣ

    View full-size slide

  30. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    AppKit is not dead

    View full-size slide

  31. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    A good application should…
    be transparent, be native.

    View full-size slide

  32. try! Swift 2019 Native macOS application, or the world of AppKit
    © 2019 1024jp
    Thank you.

    View full-size slide