Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.

Atomic Design という名のデザイン整理術

This presentation describes how you and all the members of your team can organize your idea of UI design with Atomic Design.

  • Identifiez-vous pour voir les commentaires

Atomic Design という名のデザイン整理術

  1. 1. 

  2. 2. YUSUKE GOTO 
 
 
 
 

  3. 3.
  4. 4. 
 

  5. 5. 
 

  6. 6. https://www.youtube.com/watch?v=Ai6PEagQpAs
  7. 7. https://www.youtube.com/watch?v=Ai6PEagQpAs
  8. 8. https://www.youtube.com/watch?v=Ai6PEagQpAs
  9. 9. https://www.youtube.com/watch?v=Ai6PEagQpAs
  10. 10. https://www.psdvault.com/basics/essential-photoshop-shortcuts-beginners-learn-part/
  11. 11. https://www.psdvault.com/basics/essential-photoshop-shortcuts-beginners-learn-part/
  12. 12.
  13. 13. https://www.psdvault.com/basics/essential-photoshop-shortcuts-beginners-learn-part/
  14. 14. https://www.psdvault.com/basics/essential-photoshop-shortcuts-beginners-learn-part/
  15. 15. https://www.psdvault.com/basics/essential-photoshop-shortcuts-beginners-learn-part/
  16. 16. https://www.psdvault.com/basics/essential-photoshop-shortcuts-beginners-learn-part/
  17. 17. https://www.psdvault.com/basics/essential-photoshop-shortcuts-beginners-learn-part/
  18. 18. https://pixabay.com/en/burden-heavy-man-overworked-people-1296754/ 
 

  19. 19. 
 
 https://pixabay.com/en/burden-heavy-man-overworked-people-1296754/
  20. 20. https://www.psdvault.com/basics/essential-photoshop-shortcuts-beginners-learn-part/
  21. 21. https://www.websitedesign.co.uk/ordering-layers-in-photoshop/
  22. 22. https://www.websitedesign.co.uk/ordering-layers-in-photoshop/
  23. 23. https://www.websitedesign.co.uk/ordering-layers-in-photoshop/
  24. 24. https://www.websitedesign.co.uk/ordering-layers-in-photoshop/
  25. 25. https://www.websitedesign.co.uk/ordering-layers-in-photoshop/
  26. 26. https://www.websitedesign.co.uk/ordering-layers-in-photoshop/
  27. 27. https://www.websitedesign.co.uk/ordering-layers-in-photoshop/
  28. 28. https://www.websitedesign.co.uk/ordering-layers-in-photoshop/
  29. 29. https://www.websitedesign.co.uk/ordering-layers-in-photoshop/
  30. 30. https://www.youtube.com/watch?v=Ai6PEagQpAs
  31. 31. https://www.youtube.com/watch?v=Ai6PEagQpAs
  32. 32. https://www.youtube.com/watch?v=Ai6PEagQpAs 

  33. 33.
  34. 34.
  35. 35. 
 

  36. 36.
  37. 37.
  38. 38. ? ?
  39. 39. http://bradfrost.com/blog/post/atomic-web-design/
  40. 40. http://bradfrost.com/blog/post/atomic-web-design/
  41. 41. 
 

  42. 42. 
 

  43. 43. Pages Templates Organisms Molecules Atoms
  44. 44. Pages Templates Organisms Molecules Atoms
  45. 45. Pages Templates Organisms Molecules Atoms
  46. 46. Pages Templates Organisms Molecules Atoms
  47. 47. Pages Templates Organisms Molecules Atoms
  48. 48. Pages Templates Organisms Molecules Atoms Photo by Dhyamis Kleber from Pexels
  49. 49. Pages Templates Organisms Molecules Atoms Photo by Dhyamis Kleber from Pexels 
 

  50. 50. Pages Templates Organisms Molecules Atoms Photo by Dhyamis Kleber from Pexels 

  51. 51. Photo by Dhyamis Kleber from Pexels 
 
 Pages Templates Organisms Molecules Atoms 

  52. 52. Photo by Dhyamis Kleber from Pexels 
 
 Pages Templates Organisms Molecules Atoms
  53. 53. Photo by Dhyamis Kleber from Pexels 
 Pages Templates Organisms Molecules Atoms 

  54. 54. Photo by Dhyamis Kleber from Pexels Pages Templates Organisms Molecules Atoms 

  55. 55. Photo by Dhyamis Kleber from Pexels 
 Pages Templates Organisms Molecules Atoms 

  56. 56. Photo by Dhyamis Kleber from Pexels 
 Pages Templates Organisms Molecules Atoms 

  57. 57.
  58. 58. Organism A Organism B Organism D Organism E Organism C Template A
  59. 59. Organism A Organism B Organism D Organism E Organism C Organism A Organism B Organism C Organism E Organism D Template A Template B
  60. 60. Organism A Organism B Organism D Organism E Organism C Organism A Organism B Organism C Organism E Organism D Template A Template B
  61. 61. Organism A Organism B Organism E Organism C Template A
  62. 62. 
 Organism A Organism B Organism E Organism C Template A
  63. 63. Organism A Organism B Organism E Organism C Template A Organism A Organism B Organism E Organism C Template A
  64. 64.
  65. 65. 
 

  66. 66. 
 

  67. 67. 
 

  68. 68. 
 
 

  69. 69.
  70. 70. 
 
 

  71. 71.
  72. 72. https://www.wantedly.com/companies/abema/post_articles/53312
  73. 73. https://www.amazon.co.jp/dp/477419705X
  74. 74. https://www.slideshare.net/ygoto3q/atomic-design-for-agile-ui-development-100961721
  75. 75. https://www.slideshare.net/ygoto3q/update-to-an-agile-design-flow
  76. 76. YUSUKE GOTO https://ygoto3.com/ @ygoto3_

×