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

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