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

Sketch Pluginを作ってみた

Sketch Pluginを作ってみた

28f57a43ae8eba102877b7a3d64f688a?s=128

Kohei Tabata

January 31, 2017
Tweet

Transcript

  1. Sketch PluginΛ ࡞ͬͯΈͨ 2017/01/31 AKIBA.swift@Ϋϥεϝιου

  2. ࣗݾ঺հ ɾKohei Tabata(@nerd0geek1) ɾSaib Studio LLC ɾiOS/MacOS/tvOS Developer ɾWAmazingɹɹ ͱ͍͏ελʔτΞοϓͰ

    ɹiOSΞϓϦ։ൃͷ͓ख఻͍ Said Studio LLC Kohei Tabata Next! Remote quick-zip plus
  3. Agenda ɾSketchͱ͸ ɾSketch Pluginͱ͸ ɾͳͥ௅ઓ͔ͨ͠ ɾ࣮ࡍʹ΍ͬͨ͜ͱ ɾ·ͱΊ

  4. Sketchͱ͸ ɾBohemian codingࣾʹΑΔσβΠϯπʔϧ(MacΞϓϦ) ɾweb/MobileΞϓϦͷσβΠϯʹಛԽ ɾϕΫλʔͷऔΓѻ͍͕ಘҙɺϏοτϚοϓͷऔΓѻ͍͕ۤख ɾAdobeͷσβΠϯπʔϧΑΓܰͯ͘ɺ҆Ձ

  5. Sketch Pluginͱ͸ ɾSketchͱ࿈ܞ͢Δ͜ͱ͕Ͱ͖ΔαʔυύʔςΟ੡ͷϓϥάΠϯ ɾCocoaScript((Javascript + ObjC) / 2తͳݴޠ) or JavascriptͰهड़Ͱ͖Δ

    ɾσβΠφʔͱiOSΤϯδχΞͷ࿈ܞΛָʹͯ͘͠ΕΔ΋ͷ΋ଟ਺ ɾSketch Toolboxɹɹɹ ͱ͍͏Plugin؅ཧΞϓϦΛ࢖ͬͯ؅ཧͰ͖Δɻ
  6. Sketch Pluginͷྫ ɾAEIconizer(iconॻ͖ग़͠ͷ؆қԽ)

  7. Sketch Pluginͷྫ ɾsketchplugin-swift-color(Sketch্ͷsymbol͔ΒUIColor/NSColorΛॻ͖ग़͠)

  8. Sketch Pluginͷྫ ɾAuto-Layout(Sketch্ͰAutoLayoutͷڍಈ֬ೝ)

  9. Sketch Pluginͷྫ ࠓ঺հͨ͠΋ͷ΋ଞʹ΋ ɾXport(ૉࡐΛͦͷ··xcassetsͱͯ͠exportՄೳʹ͢Δ) ɾiosViews(symbolΛϕδΤۂઢͷ૊Έ߹ΘͤͰωΠςΟϒඳըՄೳʹ͢Δ) ɾAnimateMate(Sketch্ͷsymbolʹΞχϝʔγϣϯΛద༻) ͳͲศརͦ͏ͳϓϥάΠϯ͕ଟ਺ɻ

  10. ͳͥ௅ઓ͔ͨ͠ ɾtry! Swift 2016ͷ1ͭͷηογϣϯΛ຋༁ͨ͠ࡍʹɺSwiftͰϓϥάΠϯ͕։ൃͰ͖Δͱ ɹ͍͏࿩͕͋ͬͨ(ެࣜͰ֬ೝͰ͖ͳ͔͕ͬͨɺSketch4(࣍όʔδϣϯ)͔ΒՄೳΒ͍͠) ɾݴޠ࢓༷΍ઃܭʹֶ͍ͭͯͿ͜ͱͰiOS։ൃͷߴ଎ԽΛ࣮ݱ͢Δ͜ͱ͸Ͱ͖Δ͕ɺ ɹσβΠϯ㲗iOSͷϫʔΫϑϩʔΛվળ͢Δ͜ͱͰɺΑΓେ͖ͳϓϩμΫτ։ൃͷߴ଎ԽΛ ɹ࣮ݱͰ͖ͦ͏ͩͬͨͨΊɻ

  11. ࣮ࡍʹ΍ͬͨ͜ͱ Sketch Color Palette (બ୒͞Εͨlayerͷ໊લͱഎܠ৭͔Β.clrϑΝΠϧΛੜ੒͢Δ)

  12. ࣮ࡍͷ࣮૷

  13. ྑ͔ͬͨ఺ ɾσβΠφʔͱڠۀ͢ΔࡍͷϫʔΫϑϩʔ͕վળͰ͖ΔΑ͏ʹͳͬͨɻ ɾSketchʹର͢Δཧղ͕ਂ·ͬͨɻ ɾϫʔΫϑϩʔͷվળʹର͢Δ΍Δؾ

  14. ਏ͔ͬͨͱ͜Ζ ɾCocoaScript͕७ਮͳJavaScriptͰ΋CocoaScriptͰ΋ͳ͍ͨΊɺsyntax error͕ଟൃ ɾ͍͍ײ͡ͷ։ൃ؀ڥ͕ͳ͘ɺσόοά͕ਏ͍ɻɻɻ ɾυΩϡϝϯτ͕੔උ͞Ε͓ͯΒͣɺਏ͍ɻɻɻ

  15. ·ͱΊ ɾSketch Pluginͷ։ൃɺ։ൃ؀ڥ΍υΩϡϝϯτ͕੔උ͞Ε͍ͯͳͯ͘ ɹ։ൃ͢Δͷʹπϥϛ͕͋Δɻɻɻ ɾͨͩɺͦͷπϥϛΛ্ճΔϝϦοτΛڗडͰ͖ΔՄೳੑ΋ൿΊ͍ͯΔ ɾ͜Ε͔Β΋Sketch Plugin࡞Γʹ͸௅ઓ͍ͯ͘͠༧ఆɻ ɾօ͞Μ΋ੋඇʂ

  16. ࠷ޙʹએ఻ 2/21ʹOrigami͞ΜͰfastlaneษڧձ΍Γ·͢ʂ

  17. WAmazingͰ͸iOSΤϯδχΞΛืू͍ͯ͠·͢ʂ We are hiring!! They

  18. ͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ɻ

  19. ࢀߟ ɾSketch Plugins ɹ(https://www.sketchapp.com/extensions/plugins/) ɾSketch Plugin Basics ɹ(http://developer.sketchapp.com/introduction/) ɾtadija/AEIconizer ɹ(https://github.com/tadija/AEIconizer)

    ɾnaoty/clr ɹ(https://github.com/naoty/clr) ɾnerd0geek1/SketchColorPalette ɹ(https://github.com/nerd0geek1/SketchColorPalette)