Save 37% off PRO during our Black Friday Sale! »

つたわるイラスト vol. 3 〜ペンツールを使わずに美しいイラストを描いてみよう〜 / Understandable illustrations vol. 3 -how to draw illustrations without a pen tool

つたわるイラスト vol. 3 〜ペンツールを使わずに美しいイラストを描いてみよう〜 / Understandable illustrations vol. 3 -how to draw illustrations without a pen tool

ノンデザイナーがドローツールを扱う際の最大の難関は、ペンツールを使った美しい「ベジェ曲線」です。 本発表では、黄金比やシェイプ形成ツールを使うことで、ドローツールの扱いに慣れていないノンデザイナーでも、複雑なデザイン案を美しい線と構図で表現するためのコツについて説明します。

米倉裕基 /LINE株式会社 テクニカルライター・テクニカルイラストレーター

※以下のイベントで発表された資料です。
https://line.connpass.com/event/226589/

53850955f15249a1a9dc49df6113e400?s=128

LINE Developers
PRO

October 14, 2021
Tweet

Transcript

  1. ʙ ϖ ϯ π ʔ ϧ ͳ ͠ Ͱ Π

    ϥ ε τ Λ ͔ ͍ ͯ Έ Α ͏ ʙ ̏
  2. ຊ ೔ ͷ Ξ δΣϯ μ

  3. ɾ ൃ ද ऀ ঺ հ ɾ ΠϥετϨ ʔ λ

    ʔͱͯ͠ ͷ ࣮ ੷ ɾ W P M   ͷ ৼΓฦΓ ɾ W P M   ͷ ৼΓฦΓ ɾ W P M   ͷ ς ʔ Ϛ ɾ ԫ ۚ ൺͬͯ ͳ ʹ ɾ ԫ ۚ ൺ Λ ࢖ͬͨ ݱ ୅ ͷ σ β Πϯ ɾ ԫ ۚ ൺ Λ ࢖ͬͯ ΠϥετΛ ඳ ͍ ͯ Έ Α͏ ɾ ຊ ೔ ͷ ·ͱΊ ɾ ิ ଍ ຊ೔ͷΞδΣϯμ
  4. ൃ ද ऀ ঺ հ

  5. ɾ̑ࡀࣇΛࢠʹ࣋ͭ̐̎ࡀͷ͓͡͞Μ ɾ໊ݹ԰ͷήʔϜձࣾͰγφϦΦϥΠλʔΤϯδχΞͱͯ͠ &;ΞϓϦ޲͚ͷήʔϜΛଟ਺։ൃ ɾͦͷޙϚχϡΞϧ੍࡞ձࣾͰςΫχΧϧϥΠλʔ ςΫχΧϧΠϥετϨʔλʔ υΩϡϝϯτίϯαϧλϯτͱͯ͠ۈ຿ ɾݱࡏ-*/&%FWFMPQFSTαΠτͷίϯςϯπ੍࡞Λ୲౰ ɾ҉߸ࢿ࢈औҾϗϥʔήʔϜΪλʔϐΞ ϊ͕झຯ ถ

    ૔  ༟ ج -*/&גࣜձࣾ ։ൃ̐ηϯλʔ %FWFMPQFS$POUFOUνʔϜ
  6. Πϥε τϨʔλʔͱͯ͠ͷ࣮੷

  7. None
  8. None
  9. None
  10. W P M    ͷ ৼΓฦΓ

  11. ✔ ײ ಈ Λ ݺ Ϳ ΠϥετΛ ඳ͘ίπ ߦ ಈ

    Λ ଅ ͢ ΠϥετΛ ඳ͘ίπ ҙ ਤ ͕ ͭ ͨ Θ Δ Πϥ ετ Λ ඳ͘ίπ ˺Ξ ʔτ ˺঎ ۀ σ β Π ϯ ˺ς Ϋ χ Χ ϧ Πϥ ετ
  12. Ξ ʔτ ʢ ײ ಈ ͞ ͤ Δ ֆ ʣ

    ς Ϋ χ Χ ϧ Πϥ ετ ʢ ҙ ਤ Λ ౳ Ձ ʹ ͭ ͨ ͑ Δ ֆ ʣ ঎ ۀ σ β Π ϯ ʢ ߦ ಈ Λ ଅ ͢ ֆ ʣ ˺Ξ ʔτ ݸ ʑ ͷ ਓ ϝ ϯ λ ϧ Ϟ σ ϧ ϖ ϧ ι φ ΧςΰϦʔ ओͳλʔήο τ
  13. ϝϯ λ ϧ Ϟ σ ϧ ͸ ɺ ֎ ք

    ͷ ݱ ࣮ Λ Ծ આ త ʹ આ ໌ ͢ Δ ΂͘ߏ ங ͞ Ε ͨ ಺ త ͳ ه ߸ ·ͨ ͸ ද ݱ Ͱ ͋Γɺ ೝ ࣝͱҙ ࢥ ܾ ఆ ʹ ͓ ͍ ͯ ॏ ཁ ͳ ໾ ׂ Λ Ռ ͨ ͢ ɻ ϝϯ λ ϧ Ϟ σ ϧ ͕ ߏ ங ͞ Ε Δͱɺ ࣌ ؒͱΤ ω ϧ Ϊ ʔ Λ અ ໿ ͢ Δ ख ஈͱͯ͠ ৻ ॏ ʹ ߟ ྀ ͞ Ε ͨ ෼ ੳ Λ ஔ ׵ ͢ Δ ɻ ɹ ɹ ɹ ɹ ɹ ɹ ɹ ɹ ɹ ɹ ɹ ɹ ɹ ɹ ɹ ɹ ɹ ɹ ɹ ɹ ɹ ɹ ɹ ɹ ɹ ɹ ɹ ɹ ɹ ɹ 8 J L J Q F E J B ΑΓҾ ༻ ϝϯλϧϞσϧ
  14. ݸʑͷਓ ϖϧιφ ϝϯλϧϞσϧ

  15. ͭͨΘΔΠϥετ Λඳ͘ίπ͸ ϝϯλϧϞσϧΛ λʔήο τʹ͢Δ

  16. W P M    ͷ ৼΓฦΓ

  17. ΄͛΄͛΄ ͛΄͛΄͛ ΄͛΄͛΄ ϐϤϐϤϐ ϤϐϤϐϤ ϐϤϐϤϐ ϗήϗήϗ ήϗήϗή ϗήϗήϗ ਧ͖ग़͠Ͱ͢

    ϗήϗήϗήϗήϗήϗήϗήϗήϗήϗήϗήϗ ήϗήϗήϗήϗήϗήϗήϗήϗήϗήϗήϗή ϗήϗήϗήϗή ̍ ̎ ։࠵࣌ؒ ɿ ݄̕̕೔ ʢ໦༵೔ʣ ࣌ʙ࣌̐෼ ϑΝϛϦʔ૚ ถ૔༟ج גࣜձࣾϤωΦσβΠϯ ి࿩൪߸ ɿ 99999999 ϝʔϧ ɿ OFUKPCDBSFFST!HNBJMDPN ॅॴ ɿ ౦ژ౎೔໺ࢢ˘˘˘˘˘˘˘˘˘ όου ϊ ΢ ϋ ΢ Ұ ཡ
  18. ΄͛΄͛΄ ͛΄͛΄͛ ΄͛΄͛΄ ϐϤϐϤϐ ϤϐϤϐϤ ϐϤϐϤϐ ϗήϗήϗ ήϗήϗή ϗήϗήϗ ϗήϗήϗήϗήϗήϗήϗήϗήϗήϗήϗήϗ

    ήϗήϗήϗήϗήϗήϗήϗήϗήϗήϗήϗή ϗήϗήϗήϗή ̍ ̎ ։࠵࣌ؒ ̕̕ʙ̐ ϑΝϛϦʔ૚ ZPOFPEFTJHODPMUE ถ૔༟ج גࣜձࣾϤωΦσβΠϯ 99999999 OFUKPCDBSFFST!HNBJMDPN ౦ژ౎೔໺ࢢ˘˘˘˘˘˘˘˘˘ άου ϊ ΢ ϋ ΢ Ұ ཡ
  19. ଗ͑Δ ·ͱΊΔ Ҿ͖ࢉ͢Δ 5 * 5 - & 5*5-&

  20. ʮͳΜͱͳ͘ʯ ඳ͔ͳ͍ ͢΂ͯͷΦϒδΣΫτɺ ૷০ɺ ઢɺ ഑ஔɺ Χϥʔɺ άϧʔϓʹઆ໌ʹ଱͑͏Δ ʮҙຯʯ Λ࣋ͨͤΔ

  21. W P M    ͷ ς ʔ Ϛ

  22. Πϥετ͔Β ʮͳΜͱͳ͘ʯ Λഉআ͢Δ

  23. ԫۚൺ B B C

  24. ԫۚൺ B B C ʮԫۚൺʯ Λ࢖ͬͯ Πϥετͷ ʮߏਤʯ ͱ ʮઢʯ

    ͔Β ʮͳΜͱͳ͘ʯ Λ ഉআ͢Δํ๏Λڞ༗͠·͢
  25. ԫ ۚ ൺͬͯ ͳ ʹ

  26. ԫۚൺ B B C

  27. ԫۚൺ

  28. ԫۚൺ

  29. ԫۚൺ

  30. ԫۚൺ

  31. ԫۚൺ

  32. ԫۚൺ

  33. ԫۚൺ

  34. ԫۚൺ

  35. ԫۚൺ

  36. ԫۚൺ    

  37. ʰ΢Ο τϧ΢Ο΢εతਓମਤʱ

  38. ʰ΢Ο τϧ΢Ο΢εతਓମਤʱ

  39. ʰ΢Ο τϧ΢Ο΢εతਓମਤʱ ݐங෺ͷઃܭ͸ਓମͷൺ཰Λ༻͍Δ΂͖ ʰϨΦφϧυ ɾ μ ɾ ϰΟϯνʱ Ҿ༻ ɿ

    IUUQTXXXSJKLTNVTFVNOMOMDPMMFDUJF3110# ̍ ̍
  40. ʰ΢Ο τϧ΢Ο΢εతਓମਤʱ Ҿ༻ ɿ IUUQTKBXJLJQFEJBPSHXJLJ΢Ο τ΢Ο΢εతਓମਤ ݐங෺ͷઃܭ͸ਓମͷൺ཰Λ༻͍Δ΂͖ ʰϨΦφϧυ ɾ μ

    ɾ ϰΟϯνʱ Ҿ༻ ɿ IUUQTKBXJLJQFEJBPSHXJLJϨΦφϧυ ɾ μ ɾ ϰΟϯν ̍ ̍ ͦΜͳ͜ΜͳͰ ʮԫۚൺʯ ʹ ʮඒͷई౓ʯ ͱ͍͏ਆ࿩͕ੜ·Εͨ
  41. ԫ ۚ ൺ Λ ࢖ͬͨ ݱ ୅ ͷ σ β

    Πϯ
  42. ԫۚൺ B B C

  43. ԫۚൺ B B C

  44. ԫۚൺ

  45. ԫ ۚ ൺ Λ ࢖ͬͯ Πϥ ετ Λ ඳ ͍

    ͯ Έ Α͏
  46. ߏਤ ઢ

  47. ߏਤ ઢ ߏਤ 2จࣈͱృΓ͚ͩͰ ຊͷදࢴΛඳ͍ͯΈΑ͏

  48. λΠτ ϧɿ ) P X  U P  E

    F T J H O  X J U I  H P M E F O  S B U J P ஶ ऀɿ : V L J  : P O F L V S B ग़ ൛ ࣾɿ 5 8 .  Q V C M J T I આ ໌ จɿ - P S F N  J Q T V N  E P M P S  T J U  B N F U  D P O T F D U F U V S  B E J Q J T D J O H  F M J U  T F E  E P  F J V T N P E U F N Q P S  J O D J E J E V O U  V U  M B C P S F  F U  E P M P S F  N B H O B  B M J R V B   6 U  F O J N  B E  N J O J N W F O J B N  R V J T  O P T U S V E  F Y F S D J U B U J P O  V M M B N D P  M B C P S J T  O J T J  V U  B M J R V J Q  F Y  F B D P N N P E P  D P O T F R V B U  ߏਤ
  49. ԫۚൺ άϦο υແ͠

  50. ԫۚൺ άϦο υແ͠ TWM publish L o r e m

    i p s u m d o l o r s i t a m e t , c o n s e c - t e t u r a d i p i s c i n g e l i t , s e d d o e i u s m o d t e m p o r i n c i d i d u n t u t l a b o r e e t d o l o r e m a g n a a l i q u a . U t e n i m a d m i n i m v e n i a m , q u i s n o s t r u d e x e r c i t a t i o n u l l a m c o l a b o r i s n i s i u t a l i q u i p e x e a c o m m o d o c o n s e q u a t . How to design with golden ratio YUKI YONEKURA
  51. ԫۚൺ άϦο υ༗Γ

  52. ԫۚൺ άϦο υ༗Γ

  53. TWM Publish ԫۚൺ άϦο υ༗Γ L o r e m

    i p s u m d o l o r s i t a m e t , c o n s e c t e t u r a d i - p i s c i n g e l i t , s e d d o e i u s m o d t e m p o r i n c i - d i d u n t u t l a b o r e e t d o l o r e m a g n a a l i q u a . U t e n i m a d m i n i m v e n i a m , q u i s n o s t r u d e x e r c i t a t i o n u l l a m c o l a b o r i s n i s i u t a l i q u i p e x e a c o m m o d o c o n - s e q u a t . How to design with golden ratio Yuki Yonekura
  54. ԫۚൺ άϦο υ༗Γ TWM Publish L o r e m

    i p s u m d o l o r s i t a m e t , c o n s e c t e t u r a d i - p i s c i n g e l i t , s e d d o e i u s m o d t e m p o r i n c i - d i d u n t u t l a b o r e e t d o l o r e m a g n a a l i q u a . U t e n i m a d m i n i m v e n i a m , q u i s n o s t r u d e x e r c i t a t i o n u l l a m c o l a b o r i s n i s i u t a l i q u i p e x e a c o m m o d o c o n - s e q u a t . How to design with golden ratio Yuki Yonekura
  55. TWM publish L o r e m i p s

    u m d o l o r s i t a m e t , c o n s e c - t e t u r a d i p i s c i n g e l i t , s e d d o e i u s m o d t e m p o r i n c i d i d u n t u t l a b o r e e t d o l o r e m a g n a a l i q u a . U t e n i m a d m i n i m v e n i a m , q u i s n o s t r u d e x e r c i t a t i o n u l l a m c o l a b o r i s n i s i u t a l i q u i p e x e a c o m m o d o c o n s e q u a t . How to design with golden ratio YUKI YONEKURA TWM Publish L o r e m i p s u m d o l o r s i t a m e t , c o n s e c t e t u r a d i - p i s c i n g e l i t , s e d d o e i u s m o d t e m p o r i n c i - d i d u n t u t l a b o r e e t d o l o r e m a g n a a l i q u a . U t e n i m a d m i n i m v e n i a m , q u i s n o s t r u d e x e r c i t a t i o n u l l a m c o l a b o r i s n i s i u t a l i q u i p e x e a c o m m o d o c o n - s e q u a t . How to design with golden ratio Yuki Yonekura
  56. ߏਤ ઢ 2ϖϯπʔϧΛ࢖Θͣʹ ϩΰΛඳ͍ͯΈΑ͏ ઢ

  57. ̍ࢴʹखඳ͖ͰΠϥετΛඳ͘ ̎*MMVTUSBUPSͰखඳ͖ͷΠϥετΛऔΓࠐΉ ԫۚൺͷԁܗΛखඳ͖ͷۂઢʹ߹͏Α͏ʹ഑ஔ͢Δ ̐ ʮγΣΠϓ੒ܗπʔϧʯ Λ࢖ͬͯඞཁͳઢͷΈ࢒͢ ̑ ʮύεͷ୯७Խʯ Λ࢖ͬͯແବͳύεΛ࡟আ͢Δ ̒৭ΛృΔͳͲͷௐ੔Λߦ͏

  58. ̍ࢴʹखඳ͖ͰΠϥετΛඳ͘ ̎*MMVTUSBUPSͰखඳ͖ͷΠϥετΛऔΓࠐΉ

  59. ԫۚൺͷԁܗΛखඳ͖ͷۂઢʹ߹͏Α͏ʹ഑ஔ͢Δ

  60. ̐ ʮγΣΠϓ੒ܗπʔϧʯ Λ࢖ͬͯඞཁͳઢͷΈ࢒͢

  61. ̑ ʮύεͷ୯७Խʯ Λ࢖ͬͯແବͳύεΛ࡟আ͢Δ

  62. ̒৭ΛృΔͳͲͷௐ੔Λߦ͏

  63. None
  64. ԫۚൺΛ࢖ͬͨ ʮߏਤʯ ͱ ʮઢʯ TWM Publish L o r e

    m i p s u m d o l o r s i t a m e t , c o n s e c t e t u r a d i - p i s c i n g e l i t , s e d d o e i u s m o d t e m p o r i n c i - d i d u n t u t l a b o r e e t d o l o r e m a g n a a l i q u a . U t e n i m a d m i n i m v e n i a m , q u i s n o s t r u d e x e r c i t a t i o n u l l a m c o l a b o r i s n i s i u t a l i q u i p e x e a c o m m o d o c o n - s e q u a t . How to design with golden ratio Yuki Yonekura
  65. TWM Publish L o r e m i p s

    u m d o l o r s i t a m e t , c o n s e c t e t u r a d i - p i s c i n g e l i t , s e d d o e i u s m o d t e m p o r i n c i - d i d u n t u t l a b o r e e t d o l o r e m a g n a a l i q u a . U t e n i m a d m i n i m v e n i a m , q u i s n o s t r u d e x e r c i t a t i o n u l l a m c o l a b o r i s n i s i u t a l i q u i p e x e a c o m m o d o c o n - s e q u a t . How to design with golden ratio Yuki Yonekura ԫ ۚ ൺ Λ ࢖͏͜ͱ Ͱ ʮͳΜͱͳ͘ʯ Λഉআͨ͠ ʮߏਤʯ ͱ ʮઢʯ Λඳ͚Δ
  66. ຊ ೔ ͷ ·ͱ Ί

  67. ʮͳΜͱͳ͘ʯ ˺ ʮηϯεʯ

  68. ϝϯλϧϞσϧʹ ޡղͳ͘ҙਤΛ఻͑ΔͨΊʹ͸ ʮͳΜͱͳ͘ʯ ˺ ʮηϯεʯ ͸ωΨςΟϒͳཁૉʹͳΔ

  69. ʮͳΜͱͳ͘ʯ Λഉআ͢ΔͨΊʹ ϧʔϧ΍ΨΠυϥΠϯ͕ඞཁʹͳΔ ࠓ೔ͷൃදͰ͸ΨΠυϥΠϯͷҰྫͱͯ͠ ʮԫۚൺʯ Λ঺հͨ͠

  70. ิ ଍

  71. %FWFMPQFS$POUFOUνʔϜ͸ɺ ʰ-*/&%FWFMPQFSTαΠ τʱ ͷ ίϯςϯπΛҰॹʹ࡞ͬͯ͘ΕΔ ςΫχΧϧϥΠλʔΛืू͍ͯ͠·͢ɻ ςΫχΧϧϥΠλʔืू ʂ %$5͸͋ͳͨͷ࠽ೳΛٻΊ͍ͯ·͢ IUUQTMJOFDPSQDPNKBDBSFFSQPTJUJPO

    ʲඞਢͷܦݧ ɾ εΩϧʳ ɾ ϓϩάϥϜ࡞੒ೳྗ  ʢ+BWB4DSJQUͳͲɻ ಈ࡞ݕূΛߦ͏ͨΊʹ೔ৗత ʹίʔ υΛॻ͖·͢ʣ ɾ ෆಛఆଟ਺ͷํʹ޲͚ͨจॻΛɺ νʔϜͰॻ͍ͨ ܦݧ ʢୈࡾऀ͔Βͷߍਖ਼Λड͚ͨܦݧʣ ɾ ϝϯόʔͱͷίϛϡχέʔγϣϯܦݧ  ʢࣗࠃҎ֎ͷํͱͷίϛϡχέʔγϣϯ͕ඞͣൃੜ ͠·͢ʣ ɾ ߴ͍೔ຊޠೳྗ ʢࠃ੶Λ໰͍·ͤΜʣ ɾ ϏδωεϨϕϧͷӳޠೳྗ ʢಡΈɺ ॻ͖ʣ
  72. B