Sketch 3 Basic -Osaka-

2014.06.22　ふにセミWS Vol.3 - Sketch3ことはじめ - スライド

Transcript

1. Sketch 3 Basics
   Masaaki Komori at Osaka, June 22 2014
   

   View Slide

2. Profile
   ͜΋Γ·͖͋͞
   ೥୅લ൒ɺ౎಺ͷσβΠϯձࣾʹͯΞϧόΠτΛ։࢝ɻ
   େֶଔۀޙͦͷ··ਖ਼ࣾһͱͳΓɺೖग़ྗɺσβΠϯۀ຿ɺ
   ωοτϫʔΫؔ࿈ۀ຿ʹฒߦͯ͠ैࣄɻ೥ʹձࣾΛୀ৬
   ͠ϑϦʔϥϯεʹɻҊ݅͝ͱʹۀ຿಺༰΍ཱͪҐஔ͕ҟͳΔ
   ͨΊɺ৬Ҭతͳݞॻ͖͸ͳ͠ɻࣥචଟ਺ɻ
   

   View Slide

3. Agenda
   • Sketch Fundamentals
   4LFUDIͷجૅ
   • Artboards, Pages, Templates
   ΞʔτϘʔυɺϖʔδɺςϯϓϨʔτ
   • Styles and Symbols
   ελΠϧͱγϯϘϧ
   • Using plugins
   ϓϥάΠϯͷར༻
   • Let's try
   Ͱ͸ɺ΍ͬͯΈ·͠ΐ͏
   ˞ຊεϥΠυ͸ɺษڧձ༻ͷ΋ͷͰ಺༰ͷଟ͘͸ޱ಄Ͱઆ໌͍ͯ͠Δ΋ͷͰ͢ɻ
   

   View Slide

4. View Slide

5. Sketch Fundamentals
   Sketch is built for modern graphic designers.
   4LFUDI͸ɺ͍·Ͳ͖ͷάϥϑΟοΫσβΠφʔͷͨΊʹ࡞ΒΕ͍ͯ·͢ɻ
   

   View Slide

6. They are already using
   There is a lot of companies that are already using Sketch.
   ΄ΜͷҰѲΓͰ͕͢ɺҎԼͷஶ໊ͳձࣾͰطʹ࢖ΘΕ͍ͯ·͢ɻ
   

   View Slide

7. Artboards
   Sketch has an in nite canvas.
   You can draw any artboards as you like.
   4LFUDIʹ͸ແݶͷΩϟϯόε͕͋Δ͚ͩͰ͢ɻͦ͜ʹࣗ෼͕޷͖ͳΑ͏ʹΞʔτϘʔυΛ࡞Ε·͢ɻ
   

   View Slide

8. Pages
   Supports multiple pages, and any number of artboards per page.
   ඪ४ͰϚϧνϖʔδΛαϙʔτ͍ͯ͠·͢ɻϖʔδΛෳ੡͢Δ͜ͱ͸΋ͪΖΜɺϖʔδຕ͋ͨΓʹΞʔτϘʔυ͕͍ͭ͋ͬͯ͘΋ߏ͍·ͤΜɻ
   

   View Slide

9. Templates
   Create new le from template.
   Work better, faster.
   ςϯϓϨʔτ͔Β৽نϑΝΠϧ͕࡞ΕΔͷͰɺ࢓ࣄ͸଎͘ޮ཰Α͓͘͜ͳ͑·͢ɻ
   

   View Slide

10. Shared Styles and Symbol
    Sketch has shared styles, text styles and Symbol.
    It's like Illustrator.
    4LFUDIʹ͸ɺγΣΞʔυɾελΠϧͱςΩετɾελΠϧɺͦͯ͠γϯϘϧͷػೳ͕͋Γ·͢ɻ·ΔͰ*MMVTUSBUPSͷΑ͏Ͱ͢Ͷɻ
    

    View Slide

11. Various export options
    Sketch has various export options.
    You can export les with command-line that called 'Sketchtool'.
    4LFUDI͸͞·͟·ͳॻ͖ग़͠Φϓγϣϯ͕͋Γ·͢ɻ4LFUDIUPPMΛ࢖͑͹ɺίϚϯυϥΠϯ͔Β΋ॻ͖ग़ͤ·͢ɻ
    

    View Slide

12. Plugins
    Sketch supports plugins.
    4LFUDI͸ϓϥάΠϯΛαϙʔτ͍ͯ͠·͢ɻ
    

    View Slide

13. How to install
    Download .zip le or git clone to Sketch plugin directory.
    ϓϥάΠϯ͸ɺެ։ઌͷαΠτ͔Βμ΢ϯϩʔυ͠·͢ɻ[JQϑΝΠϧΛμ΢ϯϩʔυ͢Δ͔ɺ(JU)VCͳΒ(JUΛ࢖ͬͯ௚઀Ϋϩʔϯ͢ΔͱΞοϓσʔτΛ௥͍͔͚ΒΕ·͢ɻ
    

    View Slide

14. Sketchpack.in & Sketch Toolbox.app
    Plugin registory and plugin manager app has come.
    ࠷ۙɺϓϥάΠϯϨδετϦͱͯ͠4LFUDIQBDLJO͕ొ৔ɻ·ͨ৽ͨʹ4LFUDI5PPMCPYͱ͍͏ϓϥάΠϯϚωʔδϟʔΞϓϦͷ։ൃ΋ਐΜͰ͍·͢ɻ
    

    View Slide

15. Let's try
    ͊͞ɺ࣮ࡍʹ͞ΘͬͯΈ·͠ΐ͏
    

    View Slide

16. Thank you.
    This slide made with Sketch 3.
    ΋ͪΖΜɺ͜ͷεϥΠυ΋4LFUDIͰ࡞ΒΕ͍ͯ·͢ɻ
    

    View Slide