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

ブロックエディタ利用を想定したテーマ制作と今後必要なこと / gifuwpm17

Koji Kuno
December 28, 2019

ブロックエディタ利用を想定したテーマ制作と今後必要なこと / gifuwpm17

Koji Kuno

December 28, 2019
Tweet

More Decks by Koji Kuno

Other Decks in Programming

Transcript

  1. ϒϩοΫΤσΟλར༻Λ૝ఆͨ͠
    ςʔϚ੍࡞ͱࠓޙඞཁͳ͜ͱ
    ೥݄೔ʢ౔ʣ
    ΈΜͳͷ৿͗;ϝσΟΞίεϞε͔Μ͕͑ΔελδΦ
    0MFJO%FTJHOٱ໺ߊ࢘

    View Slide

  2. ࣗݾ঺հ
    w ϑϦʔϥϯε8FC੍࡞ऀˏذෞࢢ
    w 8PSE1SFTT$POUSJCVUPS DPSF
    NFFUVQ USBOTMBUJPO QMVHJOEFW UIFNFEFW

    w $PEFS%PKPذෞνϟϯϐΦϯ
    w άϥϑΟοΫσβΠϯग़਎8FCؔ࿈ձ
    ࣾۈ຿ྺ͸ͳ͠
    w 8FC͸ಠֶ8PSE1SFTTྺ೥Ҏ্
    w [email protected]

    View Slide

  3. Έͳ͞Μ͸ͲΜͳਓʁʢෳ਺ճ౴Մʣ
    w ҰൠϢʔβʔʢۚમतडͳ͠ʣ
    w ఏҊଆʢσΟϨΫλʔӦۀʣ
    w ੍࡞ଆʢσβΠφʔΤϯδχΞʣ

    View Slide

  4. લఏ
    w 8PSE$BNQ0TBLBͰةػײΛಘ͖ͯͨ
    w ނʹগʑݴ༿͕ڧ͍෦෼͕͋Γ·͢
    w େࣄͳ͜ͱ͸Կճ΋ݴٴ͍ͯ͠·͢
    w ֶͼଓ͚·͠ΐ͏ʢࣗռʣ
    Ϗδωεతͳଆ໘Ͱ8PSE1SFTTͱؔΘ͍ͬͯΔਓʹಛʹ఻͍͑ͨ

    View Slide

  5. ͲͪΒ͕৴༻Ͱ͖Δʁ
    w ͦͷຊΛಡΜͩ͜ͱ͕ͳ͍ॻళళһ͞
    Μ
    w ͦͷຊΛಡΜͩ͜ͱ͕͋Δॻళళһ͞
    Μ

    View Slide

  6. ࢲͨͪ͸Ͳ͏ͩΖ͏͔ʁ
    w ஌͍ͬͯΔͭ΋ΓͰࢭ·ͬͯͳ͍͔
    w ஌͍ͬͯΔ৘ใ͕ݹ͘ͳ͍ͬͯͳ͍͔
    w Α͘෼͔Βͳ͍΋ͷΛקΊ͍ͯͳ͍͔
    ͍ͬͯ͏͔࣮ࡍʹ࢖ͬͯΔʁ

    View Slide

  7. ࢓ࣄͰ8PSE1SFTTʹܞΘΔͷͰ͋Ε
    ͹࠷৽৘ใΛ௥͍ͬͯ͘͜ͱ΋࢓ࣄ
    Ͱ͋Δ
    ʢ(JGV8PSE1SFTT.FFUVQͰ৘ใަ׵͍͖ͯ͠·͠ΐ͏ʣ

    View Slide

  8. ΞδΣϯμ
    w ϒϩοΫΤσΟλΛ׆༻͢ΔͨΊͷGVODUJPOTQIQ5JQT
    w ϒϩοΫΤσΟλ׆༻ͷఏҊʹ͍ͭͯ
    w ࠓޙͷ8PSE1SFTT։ൃͰҙࣝ͢΂͖͜ͱ

    View Slide

  9. ϒϩοΫΤσΟλΛ׆༻͢ΔͨΊͷ
    GVODUJPOTQIQ5JQT

    View Slide

  10. 0MFJOTUSBQ
    IUUQT
    HJUIVCDPN0MFJOKQPMFJOTUSBQ
    ৗʹΞοϓσʔτ͍ͯ͠·͢

    View Slide

  11. ಛ௃
    w ࠷௿ݶͷnpm scriptͰศརͳ։ൃ؀ڥ͕ར༻Ͱ͖Δ
    w 4BTTɺ+BWB4DSJQUɺ*NBHFͷίϯύΠϧ
    w ඞཁ࠷௿ݶͷςϯϓϨʔτϑΝΠϧΛ༻ҙ
    w ϞδϡʔϧϑΝΠϧΛฤू͢Δ͜ͱͰฤूը໘༻ελΠϧ΋ࣗಈతʹ࡞੒
    ࠓޙɺࣗ෼͕࢖͍΍͍͢Α͏ʹվྑ͍͖ͯ͠·͢

    View Slide

  12. ///
    // Define block colors for in editor.
    ///
    @function block-colors() {
    @return (
    white : #ffffff,
    black : #000000,
    charcoal : #282c34,
    regent : #8c97a7,
    husk : #b9a364,
    red-stage : #b15330
    );
    }

    View Slide

  13. ///
    // Return a single block color value by name
    ///
    @function block-color( $name ) {
    @return map-get( block-colors(), $name );
    }

    View Slide

  14. ////
    /// Create CSS classes for color palette.
    ///
    /// @author Koji Kuno
    ////
    @each $color-name, $color-value in block-colors() {
    .has-#{ $color-name }-color {
    color : #{ $color-value };
    }
    .has-#{ $color-name }-background-color {
    background-color: #{ $color-value };
    }
    }

    View Slide

  15. .has-white-color {
    color: #ffffff; }
    .has-white-background-color {
    background-color: #ffffff; }
    .has-black-color {
    color: #000000; }
    .
    .
    .
    .

    View Slide

  16. ฤूը໘ͷελΠϧొ࿥
    ग़དྷΔ͚࣮ͩࡍͷελΠϧͰฤूͰ͖ΔΑ͏ʹ

    View Slide

  17. add_action( 'after_setup_theme', function() {
    add_theme_support( 'editor-styles' );
    add_editor_style( 'assets/css/editor-style.min.css' );
    }

    View Slide

  18. ͜ͷΑ͏ͳελΠϧΛࢦఆͯ͠ΈΔ
    body {
    background-color: yellow;
    }

    View Slide

  19. ϒϩοΫΤσΟλͷ৔߹
    .editor-styles-wrapper {
    background-color: yellow;
    }
    ΫϥγοΫΤσΟλͷ৔߹
    body {
    background-color: yellow;
    }
    ΫϥγοΫΤσΟλͷ৔߹ɺ
    ͷதʹฤूը໘͕ͭ͘ΒΕ͍ͯΔͷͰ

    View Slide

  20. ޿෯ͷ༗ޮԽ
    ඞཁ͔Ͳ͏͔͸ཁ֬ೝ

    View Slide

  21. add_action( 'after_setup_theme', function() {
    add_theme_support( 'align-wide' );
    }
    ?>
    .alignfullͱ.alignwideͱ͍͏$44ΫϥεʹରԠ͢Δඞཁ͕͋Δ

    View Slide

  22. .alignfull {
    width:100vw;
    margin-left: calc( (100vw - $content_width ) * -0.5);
    ɹmax-width:100vw;
    }
    .alignwide {
    width:calc( $content_width + $added_width );
    margin-left: $added_width / 2;
    max-width:100vw;
    }

    View Slide

  23. ΧϥʔύϨοτ
    ϒϥϯυΧϥʔΛొ࿥͓ͯ͘͠ͱت͹ΕΔ
    എܠ৭ͱςΩετΧϥʔʹར༻Ͱ͖Δ

    View Slide

  24. add_action( 'after_setup_theme', function() {
    add_theme_support( 'editor-color-palette', [
    [
    'name' => __( 'Gray' ),
    'slug' => 'gray',
    'color' => '#555555' // use this for inline style.
    ],
    [
    ...
    ]
    ] );
    }

    View Slide

  25. ςΩετΧϥʔͷ৔߹
    .has-text-color .has-{slug}-color
    ͱ͍͏Ϋϥε͕෇༩͞ΕΔͷͰ
    .has-gray-color {
    color: #555555;
    }
    ͱϑϩϯτଆʹελΠϧΛ༻ҙ͢ΔʢΤσΟλଆʹ͸ඞཁͳ͠ʣ

    View Slide

  26. എܠ৭ͷ৔߹
    .has-background .has-{slug}-background-color
    ͱ͍͏Ϋϥε͕෇༩͞ΕΔͷͰ
    .has-gray-background-color {
    background-color: #555555;
    }
    ͱϑϩϯτଆʹελΠϧΛ༻ҙ͢ΔʢΤσΟλଆʹ͸ඞཁͳ͠ʣ

    View Slide

  27. add_theme_support('editor-color-palette')ࣗମΛهड़͠ͳ͍৔
    ߹ɺσϑΥϧτͰҎԼͷΧϥʔύϨοτ͕༻ҙ͞ΕΔ
    ελΠϧࣗମ͸8PSE1SFTT#MPDL-JCSBSZ͔Βৗ࣌ఏڙ

    View Slide

  28. ϑΥϯταΠζηοτ

    View Slide

  29. ϑΥϯταΠζΛஈ֊తʢδϟϯϓ཰͝ͱʣ
    ʹ͋Β͔͡Ίઃఆ͓ͯ͘͜͠ͱͰɺσβΠϯ
    όϥϯεΛอͭҰ໾Λ୲͑Δ

    View Slide

  30. add_action( 'after_setup_theme', function() {
    add_theme_support( 'editor-font-sizes', [
    [
    'name' => __( 'Small' ),
    'shortName' => __( 'S' ),
    'size' => 12, // use this for inline style.
    'slug' => 'small'
    ],
    [
    ...
    ]
    ] );
    }

    View Slide

  31. .has-{slug}-font-sizeͱ͍͏Ϋϥε͕෇͘ͷͰɺ͜ͷ৔߹
    .has-small-font-size {
    font-size: 12px;
    }
    ͱ͍͏۩߹ʹϑϩϯτଆͷελΠϧʹهड़

    View Slide

  32. 8PSE1SFTT#MPDL-JCSBSZ͔Βࣗಈతʹఏڙ͞ΕΔҎԼͷΑ͏ͳελΠϧ͕͋Δ
    .has-small-font-size {
    font-size: 13px
    }
    .has-normal-font-size,.has-regular-font-size {
    font-size: 16px
    }
    .
    .
    ׆༻͢Δ͜ͱ΋Մೳ
    !
    XQJODMVEFTDTTEJTUCMPDLMJCSBSZTUZMFNJODTTߦลΓΛࢀর

    View Slide

  33. ϒϩοΫΤσΟλ׆༻ͷఏҊʹ͍ͭ
    ͯ

    View Slide

  34. ओͳ׆༻ํ๏ͷఏҊϑΣʔζ
    طଘϒϩοΫʹελΠϧΛ෇༩֦ͯ͠ு
    ϓνΧελϜϒϩοΫ
    ˠ্ͰରԠͰ͖ͳ͍͚Ͳෳࡶߏ଄Ͱͳ͍΋ͷ
    ΨνΧελϜϒϩοΫ
    ˠಈతʹϨϯμϦϯά͢Δ%ZOBNJD#MPDL

    View Slide

  35. ͪͳΈʹ
    ΧελϜϒϩοΫΛఏڙͯ͘͠ΕΔ
    ϓϥάΠϯͳͲΛ׆༻͢Δͱ͍͏બ୒ࢶ΋͋Γ·͢
    ͨͩ͠ɺґଘ͢Δ͜ͱʹͳΔͷͰ༻๏ʹ͸͝஫ҙΛ

    View Slide

  36. 8PSE1SFTTΛར༻͢Δར఺
    ʮϢʔβʔ͕ฤूͰ͖Δʯ఺

    View Slide

  37. ͦͷମݧʢ69ʣΛ؅ཧ͢Δ͜ͱ͸
    ఏҊɾ੍࡞ଆͷ੹຿

    View Slide

  38. طଘϒϩοΫʹ
    ελΠϧΛ෇༩͢Δߟ͑ํ

    View Slide

  39. ίΞϒϩοΫͷछྨ
    DPSFQBSBHSBQI DPSFIFBEJOH DPSFJNBHF DPSFRVPUF DPSFHBMMFSZ
    DPSFMJTU DPSFBVEJP DPSFDPWFS DPSFpMF DPSFWJEFP DPSFDPEF
    DPSFGSFFGPSN DPSFIUNM DPSFQSFGPSNBUUFE DPSFQVMMRVPUF DPSFUBCMF
    DPSFWFSTF DPSFCVUUPO DPSFDPMVNOT DPSFNFEJBUFYU DPSFNPSF
    DPSFOFYUQBHF DPSFTFQBSBUPS DPSFTQBDFS DPSFTIPSUDPEF DPSFBSDIJWFT
    DPSFDBUFHPSJFT DPSFMBUFTUDPNNFOUT DPSFMBUFTUQPTUT DPSFFNCFE
    DPSFFNCFEUXJUUFS DPSFFNCFEZPVUVCF DPSFFNCFEGBDFCPPL DPSFFNCFEJOTUBHSBN
    DPSFFNCFEXPSEQSFTT DPSFFNCFETPVOEDMPVE DPSFFNCFETQPUJGZ
    DPSFFNCFEqJDLS DPSFFNCFEWJNFP DPSFFNCFEBOJNPUP DPSFFNCFEDMPVEVQ
    DPSFFNCFEDPMMFHFIVNPS DPSFFNCFEEBJMZNPUJPO DPSFFNCFEGVOOZPSEJF
    DPSFFNCFEIVMV DPSFFNCFEJNHVS DPSFFNCFEJTTVV DPSFFNCFELJDLTUBSUFS
    DPSFFNCFENFFUVQDPN DPSFFNCFENJYDMPVE DPSFFNCFEQIPUPCVDLFU
    DPSFFNCFEQPMMEBEEZ DPSFFNCFESFEEJU DPSFFNCFESFWFSCOBUJPO
    DPSFFNCFETDSFFODBTU DPSFFNCFETDSJCE DPSFFNCFETMJEFTIBSF DPSFFNCFETNVHNVH
    DPSFFNCFETQFBLFSEFDL DPSFFNCFEUFE DPSFFNCFEUVNCMS DPSFFNCFEWJEFPQSFTT
    DPSFFNCFEXPSEQSFTTUW

    View Slide

  40. ίΞϒϩοΫͷछྨ
    DPSFQBSBHSBQI DPSFIFBEJOH DPSFJNBHF DPSFRVPUF DPSFHBMMFSZ
    DPSFMJTU DPSFBVEJP DPSFDPWFS DPSFpMF DPSFWJEFP DPSFDPEF
    DPSFGSFFGPSN DPSFIUNM DPSFQSFGPSNBUUFE DPSFQVMMRVPUF DPSFUBCMF
    DPSFWFSTF DPSFCVUUPO DPSFDPMVNOT DPSFNFEJBUFYU DPSFNPSF
    DPSFOFYUQBHF DPSFTFQBSBUPS DPSFTQBDFS DPSFTIPSUDPEF DPSFBSDIJWFT
    DPSFDBUFHPSJFT DPSFMBUFTUDPNNFOUT DPSFMBUFTUQPTUT DPSFFNCFE
    DPSFFNCFEUXJUUFS DPSFFNCFEZPVUVCF DPSFFNCFEGBDFCPPL DPSFFNCFEJOTUBHSBN
    DPSFFNCFEXPSEQSFTT DPSFFNCFETPVOEDMPVE DPSFFNCFETQPUJGZ
    DPSFFNCFEqJDLS DPSFFNCFEWJNFP DPSFFNCFEBOJNPUP DPSFFNCFEDMPVEVQ
    DPSFFNCFEDPMMFHFIVNPS DPSFFNCFEEBJMZNPUJPO DPSFFNCFEGVOOZPSEJF
    DPSFFNCFEIVMV DPSFFNCFEJNHVS DPSFFNCFEJTTVV DPSFFNCFELJDLTUBSUFS
    DPSFFNCFENFFUVQDPN DPSFFNCFENJYDMPVE DPSFFNCFEQIPUPCVDLFU
    DPSFFNCFEQPMMEBEEZ DPSFFNCFESFEEJU DPSFFNCFESFWFSCOBUJPO
    DPSFFNCFETDSFFODBTU DPSFFNCFETDSJCE DPSFFNCFETMJEFTIBSF DPSFFNCFETNVHNVH
    DPSFFNCFETQFBLFSEFDL DPSFFNCFEUFE DPSFFNCFEUVNCMS DPSFFNCFEWJEFPQSFTT
    DPSFFNCFEXPSEQSFTTUW

    View Slide

  41. ͜ΕΒͷίϯϙʔωϯτͰ
    ϖʔδ͸࡞Εͳ͍ʁ
    ஈམɾݟग़͠ɾը૾ɾҾ༻ɾΪϟϥϦʔɾϦετɾΧόʔը૾ɾ
    ϘλϯɾΧϥϜɾը૾ͱจষ

    View Slide

  42. طଘϒϩοΫΛ্खʹར༻͢Δ͜ͱ
    Ͱɺे෼όϦΤʔγϣϯ๛෋ͳϖʔ
    δΛ࡞Δ͜ͱ͕Ͱ͖Δ͸ͣ

    View Slide

  43. ͔͠͠
    ϒϩοΫͷ׆༻ʹ͸ίϯϙʔωϯτ
    Λ׆༻ͨ͠σβΠϯࢥߟ͕ඞཁ

    View Slide

  44. w اըɾఏҊ
    ˠ8PSE1SFTTͰԿ͕Ͱ͖Δͷ͔஌Βͳ͍ͱاըΛఏҊͰ͖ͳ͍
    w σβΠϯ੍࡞
    ˠ8PSE1SFTTͰԿ͕Ͱ͖Δͷ͔஌Βͳ͍ͱίϯϙʔωϯτԽͰ͖ͳ͍
    w ߏங
    ˠϒϩοΫΤσΟςΠϒϧͳ8PSE1SFTT؀ڥߏஙʹؔ͢Δ஌ݟ͕ͳ͍ͱߏஙͰ͖ͳ͍
    8PSE1SFTTΛ஌͍ͬͯͳ͍ͱઃܭͰ͖ͳ͚Ε͹ࢦࣔ΋ग़ͤͳ͍͠
    ྑ͠ѱ͠ͷ൑அ΋Ͱ͖ͳ͍͠࡞Εͳ͍

    View Slide

  45. -FUTHFUCBDLPOUSBDL
    &YUFOEJOH%FGBVMU#MPDLT
    طଘϒϩοΫʹελΠϧΛ෇༩͢Δํ๏

    View Slide

  46. ಡ΋͏
    #MPDL&EJUPS)BOECPPL

    View Slide

  47. 0MFJO#MPDLT
    IUUQT
    HJUIVCDPN0MFJOKQPMFJOCMPDLT
    ϒϩοΫΛαϙʔτ͢ΔͨΊͷϓϥάΠϯͱͯ͠࡞͍ͬͯ·͢
    ʢৗ࣌Ξοϓσʔτʣ

    View Slide

  48. !XPSEQSFTTTDSJQUT
    ΊͬͪΌָͪΜ
    !XPSEQSFTTTDSJQUT

    View Slide

  49. ࡞ΓํͷྲྀΕ
    ϓϥάΠϯΛ࡞ΔʢςʔϚʹೖΕΔ͔൑அ͠Α͏ʣ
    ϝΠϯ1)1͔Βenqueue_block_editor_assetsIPPLͰ+4ϑΝΠ
    ϧΛಡΈࠐΉ
    +4͔ΒregisterBlockStyleͰొ࿥
    $44Λ࡞੒ͯ͠ϝΠϯ1)1͔Βenqueue_block_assetsIPPLͰ
    $44ϑΝΠϧΛಡΈࠐΉ

    View Slide

  50. ϓϥάΠϯͷߏ੒ྫ
    - index.php
    /src
    - index.js
    - style.scss
    /build
    - index.asset.php
    - index.js
    - style.css

    View Slide

  51. index.php
    function ob_extending_blocks_enqueue() {
    wp_enqueue_script( 'ob-extending-blocks-script',
    plugins_url( 'build/index.js', __FILE__ ),
    array( 'wp-blocks' )
    );
    }
    add_action( 'enqueue_block_editor_assets', 'ob_extending_blocks_enqueue' );

    View Slide

  52. src/index.js
    wp.blocks.registerBlockStyle(
    'core/button',
    {
    name: 'original-button',
    label: 'Original Button'
    }
    );

    View Slide

  53. TSDTUZMFTDTT
    .is-style-original-button {
    margin: 30px 0;
    .wp-block-button__link {
    background-color: darkblue;
    }
    }

    View Slide

  54. JOEFYQIQ
    function ob_extending_blocks_styles() {
    wp_enqueue_style( 'ob-extending-blocks-style',
    plugins_url( 'build/style.css', __FILE__ ) );
    }
    add_action( 'enqueue_block_assets', 'ob_extending_blocks_styles' );

    View Slide


  55. View Slide

  56. ࠓޙͷ8PSE1SFTT։ൃͰҙࣝ͢΂͖͜ͱ
    w 1)1όʔδϣϯ
    w ૯߹తͳεΩϧʢඞཁͱߟ͑ΔͳΒʣ
    w 8PSE1SFTT3PBE.BQ
    IUUQTKBXPSEQSFTTPSHBCPVUSPBENBQ

    View Slide

  57. 1)1όʔδϣϯ
    όʔδϣϯ ϦϦʔε ΞΫςΟϒ ηΩϡϦςΟ



    IUUQTXXXQIQOFUTVQQPSUFEWFSTJPOTQIQ

    View Slide

  58. εΩϧͷόʔδϣϯΞοϓ΋
    ແ໊ؔ਺ɾ഑ྻɾ໊લۭؒɾ$PNQPTFSFUD

    View Slide

  59. ૯߹తͳεΩϧʢඞཁͱߟ͑ΔͳΒʣ
    w .PEFSO+BWB4DSJQU
    w $44ઃܭ
    w BZʢ8$"(""ʣ΁ͷཧղͱ࣮૷ྗ

    View Slide

  60. 8PSE1SFTT3PBE.BQ
    ࠓޙɺ8PSE1SFTT͸ͲͷΑ͏ʹਐԽ͍ͯ͘͠ͷ͔

    w φϏήʔγϣϯϝχϡʔΛϒϩοΫԽ
    w طଘ΢ΟδΣοτΛશͯϒϩοΫ΁Ҡ২
    ͜ͷಓے͔Βඞཁͳٕज़΍৘ใΛબ୒͢Δ

    View Slide

  61. ηογϣϯΛ௨ͯ͠஌Βͳ͔ͬͨ͜ͱ͕̍ͭͰ΋͋ͬͨํͳΒ
    Θ͔Δ͸ͣ
    8PSE1SFTTJT/05FBTZ

    View Slide

  62. ઃܭ΋੍࡞΋
    ೉қ౓্͕ͬͯ·͢ʂ

    View Slide

  63. ӡ༻΋ߟ͑ͨ࢓༷ࡦఆ
    w ͲΜͳೖྗํ๏͕ඞཁ͔
    w ඞཁͳίϯϙʔωϯτ͸Կ͔

    View Slide

  64. ϒϩοΫΤσΟλʔΛཧղ͢Δ
    w ͲΜͳϒϩοΫ͕͋Δ͔
    w Կ͕Ͱ͖Δͷ͔ʢԿ͕Ͱ͖ͳ͍ͷ͔ʣ
    w ͲΜͳ)5.-͕ॻ͖ग़͞ΕΔͷ͔
    w ίϯϙʔωϯτ΁ͷཧղͱઃܭ

    View Slide

  65. ʢվΊͯʣ
    εΩϧΞοϓ͢ΔͨΊʹ͸

    View Slide

  66. ެࣜυΩϡϝϯτͱ
    ༷ʑͳιʔείʔυΛ
    ಡΉ
    8PSE1SFTT(JUIVC
    8PSE1SFTT%FWFMPQFS3FTPVSDFT

    View Slide

  67. ͦͯ͠
    ஌Γ͚ͨΕ͹࢖͏

    View Slide

  68. Ͳ͜ͷ୭͕ॻ͍͔ͨ෼͔Βͳ͍Α͏
    ͳϒϩάهࣄ͔Β͸αΫοͱιʔε
    ίʔυίϐϖͯ͘͠Δਓʹݶͬͯ
    ެࣜυΩϡϝϯτΛಡ·ͳ͍ਓଟ͢
    ͗໰୊ʢࣗռ

    View Slide

  69. FYDVTF
    w ӳޠ͔ͩΒಡΈʹ͍͘
    ˠ(PPHMF຋༁ͰͳΜͱ͔ͳΔ
    ˠ͔ͬͯͲ͔͜ͷ୭͔Θ͔Βͳ͍৴༻Ͱ͖ͳ͍ਓͷ৘ใΛӏವΈʹͪ͠ΌͩΊ
    FYDVTF
    w Ҋ݅ਐߦதͰಡΜͰཧղ͍ͯ͠Δ͕࣌ؒऔΕͳ͍
    ˠͦΜͳΜ͔ͩΒ͍ͭ·Ͱͨͬͯ΋ͰLT;͊ʀKCDʀTEKD͍ͭ΍Δͷʁ

    View Slide

  70. ·ͱΊ

    View Slide

  71. 8PSE1SFTTʹܞΘΔਓؒͱͯ͠
    ͋ͳͨ͸ɺͲ͏͍ͨ͠ʁ
    Ͳ͏ͳΓ͍ͨʁͲ͏͋Γ͍ͨʁ

    View Slide

  72. ਖ਼௚ɺద౰ʹ΍ͬͯͯ΋
    ʮಈ͚͹ྑ͍ʯϨϕϧͰࡁ·ͤΔͳ
    ΒͳΜͱ͔ͳΔ

    View Slide

  73. Ͱ΋ɺͦΕͬͯ
    ϓϩͱ͔ͯͬ͜͠ѱ͘Ͷʁ
    ϓϩʹগͳ͔ΒͣͦΕͰ͓ۚΛ໯͏ਓ

    View Slide

  74. Ͱ͖Δ͜ͱΛҰͭͣͭ͜ͳ͍ͯ͘͠
    ͔͠ͳ͍

    View Slide

  75. ͩΕͰ΋Ͱ͖Δ͜ͱ
    w 8PSE1SFTTΛʢ৮ΔͰ͸ͳ͘ʣ࢖͏
    w ͲΜͳϒϩοΫ͕͋Δͷ͔ɺԿ͕Ͱ͖Δͷ͔Λ஌Δ
    w ίʔυΛॻ͍ͯΈΔʢ࡞ͬͯΈΔʣ

    View Slide

  76. ܹࢗݩ
    ࡾ໦ప 5PSV.JLJ
    (VUFOCFSHҎ߱ͷςʔϚ࡞੒ʹ޲͚ͯɺࠓֶͿ
    ΂͖͜ͱ
    ௕୩઒޿෢ӡ༻΋࠷େݶߟྀʂίʔϙϨʔταΠτͰϒϩοΫΤ
    σΟλϑϧ׆༻ͷࣄྫ঺հ
    #MPDL&EJUPSΧελϚΠζೖ໳81NFFUVQ0TBLB
    εϥΠυɿӡ༻΋࠷େݶߟྀʂίʔϙϨʔταΠτͰϒϩοΫΤσΟλϑϧ׆༻ͷࣄྫ঺հ
    εϥΠυɿ(VUFOCFSHҎ߱ͷςʔϚ࡞੒ʹ޲͚ͯɺࠓֶͿ΂͖͜ͱ

    View Slide

  77. 8PSE1SFTT.FFUVQʹࢀՃͯ͠ɺ
    ͨ͘͞Μ8PSE1SFTTͱؔΘΖ͏ʂ

    View Slide

  78. ͓ΘΓ

    View Slide