JS.CONF.EU 2012 - Because F$%k Photoshop

JS.CONF.EU 2012 - Because F$%k Photoshop

Cbfa54275010d81ff786ef9b2a711d38?s=128

Julie Ann Horvath

October 06, 2012
Tweet

Transcript

  1. JS

  2. I’M JULIE. I DESIGN & BUILD STUFF AT GITHUB

  3. I’M NRRRDCORE. MOST PLACES ON THE INTERNET

  4. THE TALK* BECAUSE FUCK PHOTOSHOP

  5. I DID SOME RESEARCH AND THE INTERNET TOTALLY AGREES

  6. None
  7. (CREDIBLE SOURCES)

  8. THE PROCESS* BECAUSE FUCK PHOTOSHOP

  9. MY PROCESS* HAPPENS IN THE BROWSER

  10. “A WEBSITE’S DESIGN SHOULD START WHERE IT’S GOING TO LIVE”

    MEAGAN FISHER
  11. None
  12. THINGS N’ STUFF

  13. CSS3 IS FUCKING BEAUTIFUL

  14. None
  15. INCONSISTENCY DOESN’T SOUND LIKE A REAL WORD

  16. INCONSISTENCY GOING FROM COMPS TO THE BROWSER

  17. DON’T PANIC. DO THE WORK NOW INSTEAD OF LATER

  18. None
  19. None
  20. SASS/SCSS YOUR NEW BEST FRIEND

  21. SASS/SCSS WORK FUCKING FASTER

  22. border-top-color: lighten($gray, 10%);

  23. border-bottom-color: darken($gray, 10%);

  24. SASS/SCSS HANDLES ERRORS LIKE A CHAMP

  25. None
  26. FEWER SURPRISES OH SHIT THIS LOOKS AWFUL

  27. CROSS-BROWSER ZEN DO IT ALL AT THE SAME TIME

  28. DEBUG CSS NEEDS MORE WEB INSPECTOR

  29. DEBUG JS NEEDS MORE CONSOLE

  30. WHY JS? THE INTERACTION LAYER

  31. DIE, PHOTOSHOP, DIE. SOFTWARE CRASHES SUCK

  32. PROBLEM? YES, PROBLEM

  33. COMMAND + R DOESN’T AFFECT YOUR CODE

  34. None
  35. VERSION CONTROL IS AN AWESOME DESIGN TOOL

  36. VERSION CONTROL HELPS YOU MANAGE ASSETS

  37. VERSION CONTROL ALLOWS YOU TO TRACK CHANGES

  38. IMAGE DIFFING IS AN AWESOME DESIGN TOOL

  39. None
  40. None
  41. None
  42. None
  43. DESIGNERS ASK YOUR DEVS FOR COMMIT ACCESS

  44. DEVELOPERS GIVE YOUR DESIGNERS COMMIT ACCESS

  45. BUILD MORE TRUST GIVE YOUR DESIGNERS COMMIT ACCESS

  46. TEACH YOUR DESIGNERS THEY MIGHT BREAK SOME THINGS

  47. TRUST YOUR DESIGNERS THEY MIGHT NOT

  48. BUT BUT BUT COMMAND LINE TOOLS ARE HARD

  49. BUT BUT BUT GIT IS SO CONFUSING

  50. WE CAN HELP GITHUB FOR MAC & WINDOWS

  51. None
  52. PROTOTYPING IS GOOD FOR THE SOUL

  53. PROTOTYPING IS EASY WHEN YOU WRITE CODE

  54. GISTS A LIGHT-WEIGHT PROTOTYPING TOOL

  55. ABUSING GISTS USING THE HELL OUT OF THEM

  56. None
  57. None
  58. None
  59. None
  60. None
  61. CSS IS REUSABLE DON’T WRITE THE SAME CODE TWICE

  62. CSS IS REUSABLE UNLESS YOU CAN MAKE IT BETTER

  63. IF IT’S NOT REUSABLE SET IT ALL ON FIRE AND

    START OVER
  64. PATTERN LIBRARIES ARE TOTALLY A THING

  65. PATTERN LIBRARIES ARE REALLY FUCKING AWESOME

  66. PATTERN LIBRARIES LETS LEARN FROM EACH OTHER

  67. None
  68. PATTERN LIBRARIES OPEN SOURCE ALL THE THINGS

  69. THE FUTURE* BECAUSE FUCK PHOTOSHOP

  70. THE FUTURE* HOPEFULLY A MUCH BETTER ONE

  71. THE FUTURE* HOPEFULLY A MUCH BETTER ONE

  72. STATUS QUO PIXEL-PERFECT PHOTOSHOP COMPS

  73. RESPONSIBILITY PIXEL-PERFECT PHOTOSHOP COMPS

  74. END PRODUCT PICTURE OF A WEBSITE

  75. YOU ARE ALL AWESOME. JSCONFEU

  76. RESOURCES * github.com/styleguide * 24 ways: Do Your Mockup in

    Markup * css3exp.com/moon * sass-lang.com * gist.github.com * dribbble.com/nrrrdcore/buckets * pea.rs