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

World of No Interface Builder

satoshin21
March 08, 2018

World of No Interface Builder

try!Swift Tokyo 2018 After talks Day 1

## description
私のチームでは、現在Storyboardやxib/nibファイルなど、Interface Builderを用いない実装が推奨されています。なぜ、ほぼ全てのUIをコードで実装する決断をしたのか?Interface Builderとチーム開発という観点からお話します。
また、コード上でUIを実装する為のTips、またInterface Builderを用いるべきタイミングについてもお話できればと思います。

satoshin21

March 08, 2018
Tweet

More Decks by satoshin21

Other Decks in Technology

Transcript

  1. Copyright © 2017 eureka, Inc. All rights reserved.
    Interface Builderͷແ͍ੈք
    World of No Interface Builder

    View full-size slide

  2. Copyright © 2017 eureka, Inc. All rights reserved.
    2
    $ whoami
    !TBUPTIJO
    QBJST+1J04"QQMJDBUJPO&OHJOFFSBUFVSFLB *OD
    "VUIPSPG$IBJO"OJNBUJPO-JCSBSZl"OJNBz
    TUBSPWFS

    View full-size slide

  3. Do you use
    Interface Builder?

    View full-size slide

  4. Copyright © 2017 eureka, Inc. All rights reserved.
    4
    Do you use Interface Builder?
    QBJST+1UFBNEPFTO`UVTF*OUFSGBDF#VJMEFS
    wJUI"VUP-BZPVU

    View full-size slide

  5. Copyright © 2017 eureka, Inc. All rights reserved.
    5
    Do you use Interface Builder?
    "MTP QBJST(MPCBMUFBNEPFTO`UVTF*OUFSGBDF#VJMEFS
    wJUI5FYUVSF BTZODISPOPVT6*'SBNFXPSLCZ'BDFCPPL

    .PSF5FYUVSF
    ",*#"TXJGUʷΤ΢ϨΧίʔυϨΠΞ΢τษڧձ

    View full-size slide

  6. Why We don’t use
    Interface Builder?

    View full-size slide

  7. IUO
    prepareForSegue:sender:
    Storyboard × Generics
    UI Parts
    Reusability
    IBOutlet, IBAction

    View full-size slide

  8. The BIGGEST
    reason is..

    View full-size slide

  9. Team Development
    ×
    Interface Builder

    View full-size slide

  10. You want to review
    xml?
    Or open Xcode?
    Also, If this PR is conflicted?

    View full-size slide

  11. Where should
    string, colors,
    and other attributes
    be defined?

    View full-size slide

  12. 4DSFFO
    "
    4DSFFO
    #
    ˞KVTUBEEFETPNF
    WJFXTUP4DSFFO"
    4DSFFO
    $
    ˞KVTUDIBOHFE
    4DSFFO#

    View full-size slide

  13. 4DSFFO
    "
    4DSFFO
    #
    ˞KVTUBEEFETPNF
    WJFXTUP4DSFFO"
    4DSFFO
    $
    ˞KVTUDIBOHFE
    4DSFFO#
    If screen A is developed
    with Storyboard or xib,
    What will you do?
    Copy storyboards?
    Or make FAT viewController?

    View full-size slide

  14. 1 years ago,

    Switch to layout with
    Codes, no IBs.

    View full-size slide

  15. Copyright © 2017 eureka, Inc. All rights reserved.
    18
    Code layout: Review and Conflict
    .PSFSFBEBCMF PO(JU)VC 9DPEFPSXIFSFWFS
    3FEVDFTUSFTTPGSFWJFXJOHBOEDPOqJDUpYJOH

    View full-size slide

  16. Copyright © 2017 eureka, Inc. All rights reserved.
    19
    Code layout: Where attributes should be defined
    $PEFTPOMZ
    %POPUXPSSJFTBCPVUJU

    View full-size slide

  17. Copyright © 2017 eureka, Inc. All rights reserved.
    20
    Code layout: Continuous Developing
    %P"UPNJD%FTJHO NPSFFBTJMZ
    5IFSFXBTBMPUPGDPEFPGMBZPVU
    5BMLXJUIEFTJHOFSTBCPVUBUPNJDT NPMFDVMFTBOEPUIFSEFTJHO
    QBSUT
    .PSFQPXFSGVMEFTJHO7$NPSFUIBO*OUFSGBDF#VJMEFS
    (FOFSJDT *OJUJBMJ[JOH

    View full-size slide

  18. Copyright © 2017 eureka, Inc. All rights reserved.
    22
    Using tools/libraries in code layout
    3FWFBM
    3VOUJNFWJFXEFCVHHJOHUPPM
    $IBOHJOHDPOTUSBJOUTBOEWJFX
    BUUSJCVUFTJOSFBMUJNF
    .PSFQPXFSGVMUIBO9DPEF`T7JFX
    EFCVHHJOH

    View full-size slide

  19. Copyright © 2017 eureka, Inc. All rights reserved.
    23
    Using tools/libraries in code layout
    SPCC$BSUPHSBQIZ
    "EFDMBSBUJWF"VUP
    -BZPVU%4-GPS4XJGU
    8SJUF"VUP-BZPVUNPSF
    JOUVJUJWFMZ

    View full-size slide

  20. Copyright © 2017 eureka, Inc. All rights reserved.
    24
    Timing to use Interface Builder
    %FWFMPQQSPUPUZQFNPSFGBTUFS
    %FTJHOFSTEFWFMPQ
    5FBNTLJMMPGJ04EFWFMPQJOH

    View full-size slide

  21. Thank you
    IUUQTXXXOBTBHPWNJTTJPO@QBHFT/11OFXTFBSUIBUOJHIUIUNM

    View full-size slide