Back to the Future: No More Static Mockups!
summary
Argues that building designs in the browser removes surprise signoffs and saves work, shows concrete tooling and workflow: 46 Photoshop files (300 MB): 40 desktop, 6 mobile, 0 tablet as evidence of the problem, uses Sketch internally but moves to PatternLab + Drupal one-to-one mapping for components, demonstrates a header and article rendering pixel-for-pixel parity between pattern and CMS, and reports faster QA, a living style guide, and one-line CSS fixes replacing dozens of image edits.
AI-written summary · about
chapters (23)
- 0:00Intro
- 1:06Mark Conroy
- 3:44An Outline
- 4:41Does this Sound Familiar?
- 5:56The Problem
- 8:09Drive Photoshop into the Ground
- 9:50Death to Photoshop
- 11:06Not Responsive
- 13:14Designs are Zoomed Out
- 14:10Too Easy for Bonkers Ideas
- 16:45What's Better? SketchApp.
- 18:25Solution? Design in the Browser
- 20:02The Solution
- 21:00Atomic Design
- 21:18PatternLab Drupal
- 23:58PatternLab + Drupal (the code) - Main Menu
- 24:51PatternLab + Drupal (the code) - Branding
- 25:02PatternLab + Drupal (the code) - Article
- 26:56Why So Good? Sustainable
- 27:50Why So Good? QA
- 29:22Why So Good? Living Styleguide
- 31:27Why So Good? Regression Testing
- 33:26Drupal Camp Dublin 2017
related talks
46mThe New Photoshop, Part 2: The Revenge of The Web
48mResponsive Design Workflow
28mBecause F$%k Photoshop
33mA Modern Designer's Workflow
29mDesigning in the Browser
39mDesigning with Components
15mModern Approach to Designer ❤️ Developer Collaboration
53mLess look, more feel. Improving the user experience as a frontender