Sass: The gateway drug for designers who Want to code

Sass: The gateway drug for designers who Want to code

Today, a lot of designers are learning how to code to understand the medium they work with. Some just learn the basics of HTML and CSS, but some (like me) get addicted and go a little further. This addiction isn’t a bad thing. In this talk, I'll explain how learning how to code with Sass and JavaScript gave me the power to design and test out my solutions, as well as the the experience to communicate with the developers that build my designs and speed up the feedback process with product owners, stakeholders, and clients.

9627abc56bc436faecbe45f2645159d6?s=128

Adekunle Oduye

June 25, 2015
Tweet

Transcript

  1. 2.

    My Name is... • Product Designer at NASDAQ • Co-organizer

    at Gotham Sass & SassConf Adekunle Oduye (Add-eh-koon-lay Oh-due-yay)
  2. 5.

    I hope you will learn how Sass: • Can introduces

    programming concepts for designers • With Javascript can be used to test UX design solutions • Improves communication & collaboration with developers & stakeholders
  3. 19.
  4. 23.

    My problems with JavaScript were: • Syntax • Process •

    Docs weren’t made for designers • Education Platforms focused on writing than thinking
  5. 26.

    Sass Benefits • DRY (Don’t Repeat Yourself) Code • Breakdown

    CSS files with partials • Faster Development
  6. 28.

    Sass Tools • Patterns Frameworks (Bourbon & Compass) • Grid

    Frameworks (Susy & Singularity) • Workflow tools (Sassmeister & Scout)
  7. 31.
  8. 32.
  9. 34.
  10. 35.
  11. 37.
  12. 39.
  13. 40.
  14. 42.
  15. 43.
  16. 50.
  17. 51.
  18. 52.
  19. 53.
  20. 54.
  21. 55.
  22. 56.
  23. 57.
  24. 58.
  25. 59.
  26. 60.
  27. 61.
  28. 62.
  29. 63.
  30. 64.
  31. 66.

    Rapid Prototyping A process of quickly mocking up the future

    state of a system, be it a website or application, and validating it with a broader team of users, stakeholders, developers and designers. http://www.smashingmagazine.com/2010/06/16/design-better-faster-with-rapid-prototyping/
  32. 71.
  33. 72.
  34. 73.

    Better Feedback Loop with Stakeholders • Prototypes are great for

    meeting • Right Questions get asked • See holes in workflow