Building a Design Environment

Transcript

2. @NRRRDCORE MOST PLACES ON THE INTERNET
3. I’M JULIE I DESIGN & BUILD STUFF AT GITHUB
4. I’M JULIE I’M A DESIGNER WHO WRITES CODE
5. THE TALK* HACKING A DESIGN ENVIRONMENT
6. THE TALK* WHAT’S A DESIGN ENVIRONMENT
7. THE PROCESS* BECAUSE FUCK PHOTOSHOP
8. MY PROCESS* HAPPENS IN THE BROWSER
9. MY PROCESS* HAPPENS IN CODE
10. MY PROCESS* HAPPENS (MOSTLY) IN CODE
11. STATUS QUO PIXEL-PERFECT PHOTOSHOP COMPS
12. RESPONSIBLE FOR PIXEL-PERFECT PHOTOSHOP COMPS
13. END PRODUCT IS A PICTURE OF A WEBSITE
14. “A WEBSITE’S DESIGN SHOULD START WHERE IT’S GOING TO LIVE.” MEAGAN FISHER
16. THINGS N’ STUFF
17. CSS3 IS FUCKING BEAUTIFUL
19. RETINA IS FUCKING BEAUTIFUL
20. RETINA CAN BE EASIER
21. ASSETS THAT SCALE WITH ICON FONTS
22. 4X FOR DETAIL
23. SASS/SCSS YOUR NEW BEST FRIEND
24. SASS/SCSS WORK FUCKING FASTER
25. border-top-color: lighten($gray, 10%);
26. border-bottom-color: darken($gray, 10%);
27. SASS/SCSS HANDLES ERRORS LIKE A CHAMP
29. INCONSISTENT GOING FROM COMPS TO THE BROWSER
30. DON’T PANIC DO THE WORK NOW INSTEAD OF LATER
32. NO SURPRISES OH SHIT THIS LOOKS AWFUL
33. ZEN MODE DO IT ALL AT THE SAME TIME
34. DEBUG CSS NEEDS MORE WEB INSPECTOR
35. DEBUG JS NEEDS MORE CONSOLE
36. WHY JS? THE INTERACTION LAYER
37. DON’T DIE SOFTWARE CRASHES SUCK
38. DESIGNERS ASK YOUR DEVS FOR COMMIT ACCESS
39. DEVELOPERS GIVE YOUR DESIGNERS COMMIT ACCESS
40. MORE TRUST GIVE YOUR DESIGNERS COMMIT ACCESS
41. TEACH YOUR DESIGNERS THEY MIGHT BREAK SOME THINGS
42. TRUST YOUR DESIGNERS THEY MIGHT SURPRISE YOU
43. TRUST YOUR DESIGNERS BUT LIKE, IN A GOOD WAY
44. PROBLEM? YES, PROBLEM
45. COMMAND + S ZERO RISK TO WHAT YOU’RE WORKING ON
46. COMMAND + R ZERO RISK TO WHAT YOU’RE WORKING ON
47. DESIGN TOOLS FOR BUILDING REAL WEBSITES
48. DESIGN TOOLS FOR BUILDING REAL APPS
49. DESIGN TOOLS FOR BUILDING REAL TOOLS
50. VERSION CONTROL IS AN AWESOME DESIGN TOOL
51. VERSION CONTROL HELPS YOU MANAGE ASSETS
52. VERSION CONTROL TRACK CHANGES TO YOUR CODE
53. VERSION CONTROL TRACK CHANGES TO YOUR DESIGN
54. GITHUB TRACK CHANGES TO YOUR DESIGN
55. IMAGE DIFFING IS AN AWESOME DESIGN TOOL
60. PROTOTYPING IS PRETTY AWESOME
61. PROTOTYPING IS EASY WHEN YOU WRITE CODE
62. GISTS A LIGHT-WEIGHT PROTOTYPING TOOL
63. ABUSING GISTS USING THE HELL OUT OF THEM
64. WAT WHAT’S IN A GIST?
65. IN A GIST YOU CAN DO MORE THAN YOU’D EXPECT
71. A FOUNDATION YOU DON’T HAVE TO START FROM SCRATCH
72. BOOTSTRAP YOU DON’T HAVE TO START FROM SCRATCH
73. CSS IS REUSABLE DON’T WRITE THE SAME CODE TWICE
74. CSS IS REUSABLE CAN YOU MAKE IT BETTER?
75. ALWAYS YOU CAN ALWAYS MAKE IT BETTER
76. ALWAYS YES, YOU FUCKING CAN
77. PUT IT OUT THERE GET MORE EYES ON YOUR CODE
78. CHANCES ARE IF YOU CAN’T, SOMEONE ELSE CAN
79. IF IT’S NOT REUSABLE SET IT ALL ON FIRE AND START AGAIN
80. PATTERN LIBRARIES ARE TOTALLY A THING
81. PATTERN LIBRARIES ARE REALLY FUCKING AWESOME
82. PATTERN LIBRARIES CONSTANTLY IMPROVE YOUR CODE
83. PATTERN LIBRARIES LEARN FROM PAST YOU
84. PATTERN LIBRARIES LEARN FROM EACH OTHER
86. STYLEGUIDES KIND OF SUCK, DON’T THEY
87. CONSIDERATIONS THINGS TO THINK ABOUT INSTEAD
89. USE THE WEB TO MAKE THE WEB
90. USE THE WEB NO, REALLY
92. BUT BUT BUT COMMAND LINE TOOLS ARE HARD
93. BUT BUT BUT GIT IS SO CONFUSING
94. WE CAN HELP GITHUB FOR MAC & WINDOWS
96. THE FUTURE* BECAUSE FUCK PHOTOSHOP
97. THE FUTURE* HOPEFULLY A MUCH BETTER ONE
98. THE FUTURE* HOPEFULLY A MUCH BETTER ONE
100. LET’S TALK JULIE @ GITHUB DOT COM
101. LET’S TALK @NRRRDCORE