2019/05/18に開催された 3DCG Meetup #15 で登壇したときの資料 https://3dmu.connpass.com/event/128459/
サンプルコード https://github.com/macneko-ayu/20190518-3dcg-meetup-sample
ExtendScriptͷ࠷৽։ൃڥͱCEPʹ͍ͭͯ3DCG Meetup #152019/5/18@macneko_ayu
View Slide
ࣗݾհ• @macneko_ayuʢ͜͏ͪΌΜࠇೣ·ΈΕʣ• iOSΞϓϦΤϯδχΞ• DTPͷࣗಈॲཧϓϩάϥϜͷडୗ։ൃ• DTPerͷεΫϦϓτ͘͘ձओ࠵• https://dtpmkmk.connpass.com/
ࠓ͢͜ͱ• ExtendScriptͷ࠷৽։ൃڥ• CEPͷ֓ཁ• CEPͷ։ൃڥ• CEPΛ࡞ͬͯΈΔ• CEPͰ࣮ݱͰ͖Δ͜ͱ
αϯϓϧίʔυ• GitHubͰެ։த• https://github.com/macneko-ayu/20190518-3dcg-meetup-sample
ExtendScriptͷ࠷৽։ൃڥ
ExtendScript ToolKitɺ͍ͬͯ·͔͢ʁExtendScriptͷ࠷৽։ൃڥ
ExtendScriptͷ࠷৽։ൃڥ• ExtendScript ToolKitʢҎ߱ESTKʣɺAdobeΞϓϦέʔγϣϯͷεΫϦϓτ։ൃ༻ͷσόοάπʔϧ• εΫϦϓτͷ࣮ߦɺ มʹ֨ೲ͞Εͨσʔλͷ֬ೝɺ ϒϨΠΫϙΠϯτΛར༻ͨ͠σόοά͕ՄೳExtendScript ToolKitͱ
Goodbye, ExtendScript ToolKitExtendScriptͷ࠷৽։ൃڥ
ExtendScriptͷ࠷৽։ൃڥ• 201811݄ɺESTKͰεΫϦϓτͷ࣮ߦ͕Ͱ͖ͳ͍ ෆ۩߹͕ൃੜͨ͠• ࢀߟɿExtendScript Toolkit Debugger Error #1116• 201812݄ɺࠓޙ৽όʔδϣϯͰͳ͘ɺ Visual Studio CodeʢҎ߱VS CodeʣͷϓϥάΠϯͱͯ͠ ϦϦʔε͞ΕΔ͜ͱ͕ൃද͞Εͨ• ࢀߟɿThe Future of ExtendScript Development: AVSCode Plugin৽ͨͳσόοάπʔϧͷҠߦ
Hello, ExtendScript DebuggerExtendScriptͷ࠷৽։ൃڥ
ExtendScriptͷ࠷৽։ൃڥ• Adobe͕։ൃͨ͠VS Code্ͰExtendScriptΛ༻͍ͨεΫϦϓτͷ։ൃɺσόοάɺ ࣮ߦΛߦ͏ͨΊͷϓϥάΠϯExtendScript Debuggerͱ
ExtendScriptͷ࠷৽։ൃڥ• VS Codeͷ֦ுػೳ͔ΒΠϯετʔϧ͢Δ1. αΠυύωϧͷ֦ுػೳΛΫϦοΫ͢Δ2. ݕࡧϑΟʔϧυʹʮextendscriptʯͱ ೖྗ͢Δ3. ExtendScript DebuggerΛΫϦοΫ͢Δ4. InstallϘλϯΛΫϦοΫ͢ΔΠϯετʔϧํ๏
ExtendScriptͷ࠷৽։ൃڥ• ઃఆϑΝΠϧʢlaunch.jsonʣΛ༻ҙ͢Δ1. ࡞ۀ༻ͷσΟϨΫτϦΛ࡞͢Δ2. 1ͷσΟϨΫτϦΛVS CodeͰ։͘3. αΠυύωϧͷσόοάΛΫϦοΫ͢Δ4. ࣃंΛΫϦοΫ͢Δ5. ExtendScript DebugΛબ͢Δ6. 1ͷσΟϨΫτϦʹlaunch.json͕Ͱ͖Δσόοάͷ४උ
launch.jsonͷॳظઃఆ※ৄࡉϓϥάΠϯͷSupported launch.json setteings:ͷ߲ΛࢀরExtendScriptͷ࠷৽։ൃڥ• σόοά࣮ߦ࣌ʹରϑΝΠϧΛࢦఆ͢Δઃఆʹͳ͍ͬͯΔ
ExtendScriptͷ࠷৽։ൃڥ• VS Code্Ͱݱࡏ։͍͍ͯΔϑΝΠϧΛରʹ͢ΔઃఆΑ͍ͬͯ͘Δઃఆ
ExtendScriptͷ࠷৽։ൃڥ1. ίϚϯυύϨοτΛ։͘2. ʮλʔήοτΞϓϦέʔγϣϯΛબʯΛબ͢Δ3. ࣮ߦରͷΞϓϦέʔγϣϯΛબ͢Δ4. αΠυύωϧͷσόοάΛΫϦοΫ͢Δ5. ύωϧ্෦ͷ࠶ੜϘλϯΛΫϦοΫ͢Δ6. σόοά͕࣮ߦ͞ΕΔσόοάΛ࣮ߦ͢Δ
Πϯετʔϧ ʙ σόοάDemoExtendScriptͷ࠷৽։ൃڥ
৽͍͠σόοάڥͰɺ շదͳ։ൃΛָ͠Ή…ʹɺ·ͩͪΐͬͱΓͳ͍ExtendScriptͷ࠷৽։ൃڥ
ExtendScriptͷ࠷৽։ൃڥ• ESTKͱൺͯExtendScript Debuggerͷෆศͳͱ͜Ζɺίʔυͷิ͕ޮ͔ͳ͍ͱ͜Ζ• ESTKͷίʔυิ͍͘͢ͳ͍͕…• TypeScriptͷܕఆٛϑΝΠϧΛར༻͢Δ͜ͱͰɺίʔυͷิ͕ՄೳʹͳΔίʔυͷิ͕͍ͨ͠
ExtendScriptͷ࠷৽։ൃڥ• ࡞ۀ༻σΟϨΫτϦʹҠಈͯ͠ɺ λʔϛφϧͰ࣍ͷίϚϯυΛ࣮ߦ͢ΔύοέʔδྨΛΠϯετʔϧ※Node.jsͷΠϯετʔϧʹׂ͍ͭͯѪ
ExtendScriptͷ࠷৽։ൃڥ• λʔϛφϧͰ࣍ͷίϚϯυΛ࣮ߦ͢Δtsconfig.jsonΛ४උ͢Δ• tsconfig.jsonͷઃఆΛมߋ͢ΔʢҰ෦ൈਮʣ
ExtendScriptͷ࠷৽։ൃڥ• ֦ுࢠ.tsͷϑΝΠϧΛ࡞͢Δ• ϑΝΠϧͷઌ಄ʹTriple-slash directivesΛՃ• ʮPhotoshop 2015.5ʯͷ෦ΛλʔήοτͷΞϓϦέʔγϣϯʹ͢Δ• εΫϦϓτ࣮࣌ʹίʔυͷิ͕ޮ͘Α͏ʹͳͬͨεΫϦϓτΛ࣮͢Δ
ExtendScriptͷ࠷৽։ൃڥ• PhotoshopͳͲͰ࣮ߦ͢ΔͨΊʹTypeScriptΛJavaScriptʹτϥϯεύΠϧ͢Δඞཁ͕͋ΔεΫϦϓτΛτϥϯεύΠϧ͢Δ• ੜ͞ΕͨJavaScriptΛPhotoshopͳͲͰ࣮ߦ͢Δ
TypeScriptؔ࿈DemoExtendScriptͷ࠷৽։ൃڥ
CEPͷ֓ཁ
CEPͷ֓ཁ• Adobe Common Extensibility PlatformʢCEPʣͷ͜ͱ• HTML5ɺCSS3ɺJavaScriptͱ͍͏Webͷ։ൃٕज़ΛͬͯɺAdobe CCΞϓϦέʔγϣϯͷΤΫεςϯγϣϯΛ࡞Ͱ͖Δ• CC 2014Ҏ߱Node.js͕Έࠐ·Ε͍ͯΔͷͰɺNPM͔ΒύοέʔδΛΠϯετʔϧͯ͠ ར༻Ͱ͖ΔCEPͱ
CEPͷ֓ཁ• CEP 4CC 2013?͔ΒରԠ͍ͯ͠Δ• 2019/05/18ݱࡏͷ࠷৽όʔδϣϯCEP 9ͰɺCC 2019ʹ֘͢Δ• ಉ͡ʹϦϦʔε͞ΕͨΞϓϦέʔγϣϯͰCEPͷόʔδϣϯ͕ҟͳΔ͜ͱ͕͋ΔͷͰҙ͢ΔCEPͷରԠόʔδϣϯ 1
CEPͷ֓ཁ• ΞϓϦέʔγϣϯ͝ͱͷCEPͷόʔδϣϯ• https://github.com/Adobe-CEP/CEP-Resources/blob/master/CEP_9.x/Documentation/CEP%209.0%20HTML%20Extension%20Cookbook.md#applications-integrated-with-cep• Node.jsͷόʔδϣϯ• https://github.com/Adobe-CEP/CEP-Resources/blob/master/CEP_9.x/Documentation/CEP%209.0%20HTML%20Extension%20Cookbook.md#chromium-embedded-framework-cefCEPͷରԠόʔδϣϯ 2
CEPͷ֓ཁ• ެࣜϦϙδτϦ• https://github.com/Adobe-CEP• ެࣜυΩϡϝϯτ• https://github.com/Adobe-CEP/CEP-Resources/blob/master/CEP_9.x/Documentation/CEP%209.0%20HTML%20Extension%20Cookbook.md• ΞϓϦέʔγϣϯࣗಈԽ૯߹ίϛϡχςΟϑΥʔϥϜ(Japan) ͷ จॻ• https://forums.adobe.com/docs/DOC-8785υΩϡϝϯτͳͲ
CEPͷ։ൃڥ
• CC Extension BuilderɺCEPͷςϯϓϨʔτΛ࡞Ͱ͖ΔVS CodeͷϓϥάΠϯCEPͷ։ൃڥϓϥάΠϯΛར༻͢Δ
CEPͷ։ൃڥ• VS Codeͷ֦ுػೳ͔ΒΠϯετʔϧ͢Δ1. αΠυύωϧͷ֦ுػೳΛΫϦοΫ͢Δ2. ݕࡧϑΟʔϧυʹʮcepʯͱೖྗ͢Δ3. CC Extension BuilderΛΫϦοΫ͢Δ4. InstallϘλϯΛΫϦοΫ͢ΔΠϯετʔϧํ๏
CEPͷ։ൃڥ• CEPΛΞϓϦέʔγϣϯ͔Βར༻͢ΔͨΊʹɺύοέʔδͨ͠ZXPΛΠϯετʔϧ͢Δඞཁ͕͋Δ• ύοέʔδ͢Δʹূ໌ॻઐ༻ͷπʔϧ͕ඞཁ• σόοάϞʔυΛ༗ޮʹ͢Δ͜ͱͰɺύοέʔδ͢Δ͜ͱͳ͘CEPΛ࣮ߦͰ͖ΔσόοάϞʔυʹ͍ͭͯ
CEPͷ։ൃڥ1. VS CodeͷίϚϯυύϨοτΛදࣔ͢Δ2. ݕࡧϑΟʔϧυʹʮcep debugʯͱೖྗ͢Δ3. બࢶͷத͔ΒʮExtension Creator: EnableCEP Debug ModeʯΛબ͢Δ4. ॴఆͷσΟϨΫτϦʹCEPΛઃஔ͢Δ͜ͱͰσόοά࣮ߦͰ͖ΔPlayer Debug ModeΛઃఆ͢Δ
CEPͷ։ൃڥ※ެࣜυΩϡϝϯτΑΓൈਮCEPͷઃஔσΟϨΫτϦ
CEPΛ࡞ͬͯΈΔ
CEPΛ࡞ͬͯΈΔ1. VS CodeͷίϚϯυύϨοτΛදࣔ͢Δ2. ݕࡧϑΟʔϧυʹʮcreate ccʯͱೖྗ͢Δ3. બࢶͷத͔ΒʮExtension Creator: Createa New CC ExtensionʯΛબ͢ΔςϯϓϨʔτΛ࡞͢Δ 1
CEPΛ࡞ͬͯΈΔ4. Extension IDΛೖྗ͢ΔύϨοτ͕දࣔ͞ΕΔɻσϑΥϧτͰ com.example.helloworld ͱೖྗ͞Ε͍ͯΔͷͰɺҙͷIDΛೖྗͯ͠EnterΛԡ͢5. Extensitonͷ໊લΛೖྗ͢ΔύϨοτ͕දࣔ͞ΕΔɻҙͷ໊લΛೖྗͯ͠EnterΛԡ͢6. ࡞͢ΔςϯϓϨʔτͷܗࣜΛબ͢Δɻbasicɺtopcoatɺspectrumɺthemeͷ4छྨ͔Βબ͢ΔςϯϓϨʔτΛ࡞͢Δ 2
CEPΛ࡞ͬͯΈΔ7. ΤΫεςϯγϣϯ͕࣍ͷσΟϨΫτϦʹ࡞͞ΕΔ~/Library/Application Support/Adobe/CEP/extensions/com.example.helloworldςϯϓϨʔτΛ࡞͢Δ 3
CEPΛ࡞ͬͯΈΔ• manifest.xmlCEP֦ுػೳΛߏ͢ΔͨΊʹඞཁͳใ͕هࡌ͞Ε͍ͯΔ• CEPͷCSXSσΟϨΫτϦʹ֨ೲ͞Ε͍ͯΔ• Α͘มߋ͢ΔՕॴ࣍ͷೋՕॴ• HostListλά• CEFCommandLineλάmanifest.xmlͷઃఆΛ֬ೝ
CEPΛ࡞ͬͯΈΔ• HostListλάͰCEPΛར༻͢ΔΞϓϦέʔγϣϯΛઃఆ͢ΔʢςϯϓϨʔτͰPhotoshopͷΈ༗ޮʹͳ͍ͬͯΔʣ1. ͷίϝϯτΞτΛ֎͢2. Version="[18.0,99.9]" ͷόʔδϣϯNo.ʢࣈͷ෦ʣΛมߋ͢Δ• [࠷খόʔδϣϯNo., ࠷େόʔδϣϯNo.]ͱ͍͏ҙຯmanifest.xmlͷઃఆΛมߋ 1
CEPΛ࡞ͬͯΈΔ• CEFCommandLineλάͰNode.jsΛ༗ޮʹ͢Δ• --enable-nodejsΛՃ͢Δmanifest.xmlͷઃఆΛมߋ
CEPΛ࡞ͬͯΈΔ1. Photoshop CC 2019Λىಈ͢Δ2. ϝχϡʔ͔ΒʮΟϯυʼΤΫεςϯγϣϯʼHello World ʯΛબ͢Δ3. CEPͷύωϧ͕දࣔ͞ΕΔͷͰɺ Call ExtendScriptϘλϯΛΫϦοΫ4. Ξϥʔτ͕දࣔ͞Εɺʮhello fromExtendScriptʯͱ͍͏ϝοηʔδ͕දࣔ͞ΕΔCEPΛར༻͢Δ
CEPΛ࡞ͬͯΈΔ• ࣍ͷΛ֬ೝ͢Δ• Player Debug Mode ͕༗ޮʹͳ͍ͬͯΔ͔• ར༻͍ͨ͠ΞϓϦέʔγϣϯ͕ manifest.xml ͰίϝϯτΞτ͞Ε͍ͯͳ͍͔ɺ͘͠هࡌ͕আ͞Ε͍ͯͳ͍͔• ར༻͍ͨ͠ΞϓϦέʔγϣϯͷόʔδϣϯ͕ manifest.xml ʹؚ·Ε͍ͯΔ͔CEP͕ಡΈࠐ·Εͳ͍߹
CEPͰ࣮ݱͰ͖Δ͜ͱ
ྫ͑• ΞϓϦέʔγϣϯ͔Β࣮ߦ݁ՌΛड͚औͬͯύωϧʹදࣔ͢Δ• APIΛίʔϧͯ͠ϨεϙϯεΛऔಘ͠ɺΞϓϦέʔγϣϯʹ͢• ύωϧΛReactͰ࣮͢Δ• MySQLͳͲͷDBͱ࿈ܞ͢ΔCEPͰ࣮ݱͰ͖Δ͜ͱ
ࢀߟ• ެࣜGitHub• https://github.com/Adobe-CEP/Samples• ReactΛͬͨαϯϓϧ• https://github.com/HendrixString/adobe-cep-react-createCEPͰ࣮ݱͰ͖Δ͜ͱ
σϞ 1• GitHubͷϢʔβʔIDʹඥ͍͍ͯΔϦϙδτϦΛऔಘͯ͠ɺϩάग़ྗ• requestύοέʔδΛͬͯɺGitHubͷAPIʹଓ͍ͯ͠ΔCEPͰ࣮ݱͰ͖Δ͜ͱ
σϞ 2• GoogleεϓϨουγʔτͱPhotoshopͷ࿈ܞ• σʔλΛऔಘͯ͠ɺυΩϡϝϯτʹஔ͞ΕͨεϚʔτΦϒδΣΫτʢPSDʣΛஔ• ࢀߟɿhttps://developers.google.com/sheets/api/quickstart/nodejs• ্هͷαϯϓϧΛ࣮ߦ͠ͳ͍ͱtoken.json͕࡞ΒΕͳ͍ͷͰҙCEPͰ࣮ݱͰ͖Δ͜ͱ
·ͱΊ
·ͱΊ• ESTK͔ΒVS CodeʴExtendScript DebuggerʹҠߦ͢Δ• CEPWeb։ൃٕज़Λ࣮ͬͯݱ͞Ε͍ͯͯɺεΫϦϓτ͚ͩͰͰ͖ͳ͔ͬͨ͜ͱ͕Ͱ͖ΔΑ͏ʹͳΔ
ྑ͍εΫϦϓτˍCEPϥΠϑΛʂ
͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠
macnekoayu
mfunaki
monicaribeiro
mrasu
tonkotsuboy_com
m_coder
lnit
shibe23
beenos
afilina
peaceiris
uhooi
ogiwarat
jacobian
mraible
colly
zakiwarfel
lara
sachag
addyosmani
bryan
swwweet
keavy
garrettdimon
mongodb