理由あって、順風満帆！ -アイドルマスター SideMのプロデューサーに学ぶ-

AKIBA.swift × エウレカ コードレイアウト勉強会 - connpass
https://classmethod.connpass.com/event/81032/
の発表資料です。何故発表した。

# 参考リンク

## アニメ「アイドルマスター SideM」公式サイト

http://imas-sidem.com/

## WTFAutoLayout

https://www.wtfautolayout.com

## Auto Layoutガイド: 不定なレイアウト

https://developer.apple.com/jp/documentation/UserExperience/Conceptual/AutoLayoutGuide/AmbiguousLayouts/AmbiguousLayouts.html

Transcript

1. ཧ༝͋ͬͯɺॱ෩ຬൕʂ
   -ΞΠυϧϚελʔSideMͷϓϩσϡʔαʔʹֶͿ-
   by.
   2018/3/28 AKIBA.swift × Τ΢ϨΧ
   ίʔυϨΠΞ΢τษڧձ
   1
   

   View Slide

2. takasek
   iOS Developer
   @takasek
   OSS
   ActionClosurable౳
   Xcode Extension
   PasteTheType
   2
   

   View Slide

3. ΞΠυϧϚελʔͱ͍͏ήʔϜͷγϦʔ
   ζ
   ϓϨΠϠʔ͸315ϓϩμΫγϣϯͱ͍͏
   ࣄ຿ॴͷϓϩσϡʔαʔͱͳͬͯɺΞΠ
   υϧΛҭ੒͢Δ
   உੑΞΠυϧΛҭͯΔͷ͕SideMͱ͍͏
   ήʔϜͰɺͦͷΞχϝԽ
   THE IDOLM@STER
   sideM
   3
   

   View Slide

4. Ξχϝʹొ৔͢ΔΞΠυϧ͸ɺ͜Ε͚͍ͩ·͢ɻ͏
   Θͬଟ͍ɻ
   ※ήʔϜ൛Ͱ͸15Ϣχοτ46ਓ͍·͕͢ɺΞχϝ࣌
   ؒ࣠Ͱ͸·ͩࣄ຿ॴՃೖ͍ͯ͠ͳ͍ͱ͍͏ઃఆͰ͢
   ʹͯ͠΋ଟ͍ɻ19ਓͰߏ੒͞ΕΔνʔϜͰಇ͍ͯΔ
   ਓɺͲΕ͚͍ͩ·͔͢ɻ
   315ϓϩμΫγϣϯ͸ɺͦΜͳ19ਓͷνʔϜϝϯόʔ
   ʹΔνʔϜͰ͢ɻͰ͸ɺνʔϜΛ؅ཧ͢Δϓϩσϡʔ
   αʔ͸ɺԿਓ͍Δ͔ɻ
   6Ϣχοτ
   19ਓ
   4
   

   View Slide

5. ҰਓͰ͢ɻ
   ͔͠͠ແཧήʔײ͸ͳ͘ɺΉ
   ͠Ζܶதͷࣄ຿ॴӡӦͷඳࣸ
   ͸ෆࢥٞͳઆಘྗ͢Β͋Γ·
   ͢ɻ
   P = 1ਓ
   5
   

   View Slide

6. ΞΠυϧϚελʔSideM͸ʮΘ͚͋ͬͯΞΠυϧʯ
   ͱ͍͏ΩϟονϑϨʔζͳͷͰ͕͢ɺ࣮͸ΞΠυϧ
   ͨͪ͸΄ͱΜͲօɺࣾձਓܦݧऀͰ͢ɻݩหޢ࢜΍
   ݩڭࢣɺݩαοΧʔબखͳͲɻͦͷͨΊجຊతʹܶ
   தͰɺใ࿈૬ͷෆඋ΍ײ৘తͳ͢Εҧ͍ʹΑΔί
   ϛϡχέʔγϣϯͷ໰୊͸Ұ੾ى͜Γ·ͤΜɻͨ
   ͩɺͦͷࣄ຿ॴӡӦͷ੒ޭͷൿ݃͸ΞΠυϧͷਓ֨
   ͚ͩͰ͸͋Γ·ͤΜɻϓϩσϡʔαʔͷνʔϜϦʔ
   μʔͱͯ͠ͷεΩϧͷߴ͞΋ɺൈ܈ͳͷͰ͢ɻ
   6
   

   View Slide

7. ͋·Γʹ͕ͦͭͳ͍ͷͰɺऴ
   ൫Ͱཪ੾ΔͷͰ͸ͱ͍͏৺഑
   ͢Βੜ·ΕΔϨϕϧɻͦ͏͍
   ͏Ξχϝ͡Όͳ͍͔Βɻ
   7
   

   View Slide

8. ࠓ೔͸ͦΜͳϓϩσϡʔαʔʹɺ
   νʔϜΛ೗Կʹճ͍͚ͯ͠͹͍͍
   ͔ͷൿ݃Λֶͼ·͠ΐ͏ɻϓϩ
   σϡʔαʔ͸ҰମɺԿނνʔϜ
   Ϧʔμʔͱͯ͠༏लͳͷ͔ɻ
   ཧ༝͋ͬͯɺ
   ॱ෩ຬൕͳϓϩσϡʔεʂ
   -ΞΠυϧϚελʔSideMͷϓϩσϡʔαʔʹֶͿ-
   8
   

   View Slide

9. ཧ༝ᶃ
   νʔϜͷػೳɾ໨తΛ
   ཧղ͍ͯ͠Δ
   9
   

   View Slide

10. ͍Ζ͍Ζ͋ͬͯແॴଐͰΞΠυϧ׆ಈΛ
    ͢Δɻ਺ʑͷࣄ຿ॴ͕ɺۚͳΒग़͔͢Β
    ͱJupiterʹΦϑΝʔΛֻ͚Δ͚Ͳɺ
    Jupiter͸ͦΕΛड͚෇͚ͳ͍ɻ͔ͭͯ
    ࣄ຿ॴͱ৭ʑ͋ͬͨ͠ɺࠓ͸ࣗ෼ͨͪͷ
    खͰ׆ಈͰ͖͍ͯΔखԠ͕͑͋Δɻ
    Jupiter
    લ৬: τοϓΞΠυϧ
    ࣄ຿ॴ: ແॴଐ (0࿩࣌఺)
    10
    

    View Slide

11. ͔ͦ͜͠͠ʹݱΕͨ315ϓϩͷࣾ௕͸ɺ͜͏ݴ͍·
    ͢ɻ
    ࣮͸ɺݩτοϓΞΠυϧͷJupiterͷϥΠϒ͸ɺݟʹདྷ
    ΕΔϑΝϯͷ਺͕ݶΒΕ͍ͯ·ͨ͠ɻखห౰Ͱ͓͑͞
    ΒΕΔϥΠϒϋ΢εͰ͸ɺϑΝϯ͕ऩ·Γ͖Βͳ͔ͬ
    ͨͷͰ͢ɻ315ϓϩͷ໨ઢ͸ɺ਺ʑͷࣄ຿ॴͱ͸ҧ͍
    ·ͨ͠ɻͦ͏͍͏ϑΝϯͨͪʹϥΠϒΛಧ͚ΔͨΊ
    ʹɺ͏ͪʹདྷͳ͍͔ɺͱ315ϓϩ͸JupiterΛק༠ͨ͠
    ͷͰ͢ɻ
    315ϓϩ ࣾ௕
    ʮ܅ͨͪ͸ΞΠυϧͱ͠
    ͯେ੾ͳ΋ͷΛݟམͱ͠
    ͍ͯΔʯ1
    1 ୈ0࿩ʮEpisode of JupiterʯΑΓ
    11
    

    View Slide

12. - ސ٬΁ಧ͚ΔՁ஋ΛୈҰʹ
    - ͦͷ໨తͱͯ͠νʔϜ͕͋Δ
    12
    

    View Slide

13. ཧ༝ᶄ
    ϩʔϧͷॏཁੑΛ
    ཧղ͍ͯ͠Δ
    13
    

    View Slide

14. [0࿩]
    ҏूӃ ๺ే (20)
    ʮ͜͏͍͏࢓ࣄ͸ɺҰ൪େਓͳԶͷ໾ׂͩɺ౰વͷ͜
    ͱ͞ʯ2
    2 ୈ0࿩ʮEpisode of JupiterʯΑΓ
    14
    

    View Slide

15. [9࿩]
    ਂ໷ɺࣄ຿ॴʹͯ3
    ๺ేʮख఻͍·͢Αʯ
    Pʮ͍͑ɻͦΕΛͤ͞ͳ͍ҝʹ๻͕ډ·͔͢Βʯ
    3 ୈ9࿩ʮOver Again...ʯΑΓ
    15
    

    View Slide

16. - ઐ໳৬Λۀ຿ʹूதͤ͞Δ
    - ؅ཧ৬͸ͦͷͨΊͷ؀ڥΛ࡞Δ
    16
    

    View Slide

17. ࡩఉ ܆ (26)
    લ৬ɿҩऀ
    ΞΠυϧΛ໨ࢦͨ͠ཧ༝ɿۚΛՔ͙
    ͨΊ
    17
    

    View Slide

18. ΦʔόʔϫʔΫؾຯͷࡩఉʹରͯ͠…4
    ࡩఉʮٳଉ͸ඞཁͳ͍ʯ
    Pʮঝ୚Ͱ͖·ͤΜʯ
    4 ୈ12࿩ʮͲΜͳཧ༝΋ɺͲΜͳເ΋ɺɺɺʯΑΓ
    18
    

    View Slide

19. - ٳଉ΋ॏཁࢹ
    - ૬ख͕ݩҩऀͰ͋Ζ͏ͱ࠷ऴ൑அ͸ৡΒͳ͍
    19
    

    View Slide

20. ཧ༝ᶅ
    ద੾ʹݖݶҠৡ͠
    ϝϯόʔͷࣗ཯ੑΛ
    ׆༻͢Δ
    20
    

    View Slide

21. એࡐࣸਅͱ͸ɺΞΠυϧͱͯ͠ͷ
    ചΓग़͠ํʹ௚݁͢Δɺॏཁͳࣸ
    ਅͰ͢ɻ
    ͔ͦ͠͠ΕΛࡱӨ͢Δʹ͋ͨͬ
    ͯɺϓϩσϡʔαʔ͔Βͷࣄલͷ
    ࢦࣔ͸͋Γ·ͤΜͰͨ͠ɻ
    [એࡐࣸਅࡱӨݱ৔]
    21
    

    View Slide

22. χίχίੜ์ૹͰ΋૲͕ੜ͑·
    ͘Δ༗༷Ͱͨ͠ɻSEM͚ͩͰ
    ͸ͳ͘ଞϢχοτ΋ಉ͡Α͏ͳ
    ঢ়گɻ໌Β͔ʹࣦഊͰ͢ɻͰ͸
    ϓϩσϡʔαʔͷ൓Ԡ͸ɻ
    S.E.M
    લ৬ɿߴߍڭࢣ
    ʮաڈ50೥ͷਓؾΞΠυϧͷ
    ಛ௃Λूܭ෼ੳ͠ɺ
    ࠷దղΛಋ͖ग़ͨ͠ʯ5
    5 ୈ2࿩ʮͦΕͧΕͷً͖ʯΑΓ
    22
    

    View Slide

23. ϓϩσϡʔαʔ
    ʮ;Ήɺ͜Ε͕օ͞Μͷݟ͍ͤͨ࢟Ͱ͔͢ʯ
    23
    

    View Slide

24. pʮͱ͍͏Θ͚ͳΜͰ͕͢ʯ
    ΧϝϥϚϯʮࡱΓ௚͠ʁεέδϡʔϧ࣍ୈ͔ͳʯ
    Pʮͪ͜Β͸དྷिʹ͸ϥΠϒ͕ೖͬͯ·ͯ͠ʯ
    ΧϝϥϚϯʮ͏ʔΜ͜ͷลΓͰௐ੔ͯ͠Έ·͔͢ʯ
    24
    

    View Slide

25. ϓϩσϡʔαʔͷࢥ࿭
    খࣦ͘͞ഊ͢Δ
    ΠςϨʔγϣϯΛૉૣ͘ճ͢
    → 315ͷՁ஋Λಧ͚Δ
    25
    

    View Slide

26. ʮօ͞Μͷݟ͍ͤͨ࢟ʯͱެ
    ࣜҥ૷͕Α͘ࣅ͍ͯΔ݅
    ΋͏ͻͱͭͷϓϩσϡʔ
    αʔͷࢥ࿭ʢͨͿΜʣ
    ϘτϜΞοϓͷൃࢄϑΣʔζ
    τοϓμ΢ϯͷऩଋϑΣʔζ
    26
    

    View Slide

27. 315ϓϩͷϓϩσϡʔε͕ॱ෩ຬൕͳཧ༝
    ϓϩσϡʔαʔ͕…
    1. νʔϜͷػೳɾ໨తΛཧղ͍ͯ͠Δ
    2. ϩʔϧͷॏཁੑΛཧղ͍ͯ͠Δ
    3. ద੾ʹݖݶҠৡ͠ϝϯόʔͷࣗ཯ੑΛ׆༻͢Δ
    27
    

    View Slide

28. AutoLayout
    ͷ࿩΋͠Α͏͔
    28
    

    View Slide

29. www.wtfautolayout.com
    29
    

    View Slide

30. www.wtfautolayout.com
    30
    

    View Slide

31. Auto LayoutΨΠυ: ෆఆͳϨΠΞ΢τ
    https://developer.apple.com/jp/documentation/UserExperience/Conceptual/AutoLayoutGuide/AmbiguousLayouts/
    AmbiguousLayouts.html
    31
    

    View Slide

32. ࠷ޙʹ
    ୲౰ΞΠυϧͷ
    ϓϨθϯ͍ͤͯͩ͘͞͞
    32
    

    View Slide

33. S.E.M
    Science, English, Mathematics
    33
    

    View Slide

34. Study Equal Magic!
    ӖɿS.E.M
    Let’s Think! Կ͍͍ͩͬͯ…
    ͦ͏ɺ܅ͷʰ໘ന͍ʱ͔Β৭Μͳٙ໰୳ͯ͠
    ͦ͏͞Ұॹʹ౴Λݟ͚ͭͯḷΓணͨ͘Ί…
    Զ͕͍ͨͪΔͷ͞ʂ
    Study Equal Magic!
    ʢTell me question! Tell you suggestion!ʣ
    ͊͞ɺੈքͰ༡ΜͰΈΑ͏
    34
    

    View Slide

35. typealias Study = Magic
    35
    

    View Slide