Upgrade to Pro — share decks privately, control downloads, hide ads and more …

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

Julie Ann Horvath
October 06, 2012
Design
16
4.6k

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

Julie Ann Horvath

October 06, 2012
Tweet

More Decks by Julie Ann Horvath

See All by Julie Ann Horvath
Engineering Learning Lunch on Writing CSS as a Team
nrrrdcore
1
180
Because People
nrrrdcore
7
1.4k
Coder Day Of Service Keynote
nrrrdcore
3
600
Just Ship It
nrrrdcore
37
4.2k
Open Source Needs More Design Superheroes
nrrrdcore
10
690
GitHub for Designers
nrrrdcore
18
2.5k
Fast Design Decision-Making for the Everyday Developer
nrrrdcore
15
1.1k
Building a Design Environment
nrrrdcore
17
15k
GitHub Summit 2012
nrrrdcore
5
920

Other Decks in Design

See All in Design
UXA2022 Day 1; Natasha Ballantyne - The life-changing potential of digital inclusion
uxaustralia
PRO
0
120
UXA2022 Day 1; Ted Drake - Inclusive design for cognitive disabilities, neurodiversity, and chronic illness
uxaustralia
PRO
0
110
UXA2022 Day 2; Christian Crumlish - Product Management for UX People
uxaustralia
PRO
0
140
【デザイナー採用】YUMEMI_会社紹介/yumemi_company_introduction_designer
yumemi_design
3
970
tsunasapo_branch-concept202007
tsunasapo
1
210
BtoBtoC × プラットフォーム型サービスへのデザイナーの挑戦
suuminbot
0
390
Growing the WordPress design system
tammielis
1
170
自分のYUMEMIに出会ってから、内定承諾までのストーリー
tact0001
0
450
広告クリエイティブは、AIで拡張する。
cyberagentdevelopers
PRO
0
420
デザインシステムと画面パターン
fkady
0
470
新卒UIデザイナーが職種を超えて活躍するために意識した2つの視点
cyberagentdevelopers
PRO
0
980
コミュニケーションデザイン組織のタタキ台 - SmartHR Communication Design Group
bebe
11
20k

Featured

See All Featured
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
213
20k
Design by the Numbers
sachag
271
17k
Documentation Writing (for coders)
carmenintech
49
2.7k
Six Lessons from altMBA
skipperchong
15
1.5k
Imperfection Machines: The Place of Print at Facebook
scottboms
254
12k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
42
14k
What's in a price? How to price your products and services
michaelherold
230
9.5k
The Power of CSS Pseudo Elements
geoffreycrofte
48
4.1k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
656
120k
Principles of Awesome APIs and How to Build Them.
keavy
114
15k
Building Adaptive Systems
keathley
25
1.2k
Robots, Beer and Maslow
schacon
152
7.2k

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