2020 in Review: The Smashing Podcast Year in Clips
As the year draws to a close, it’s worth taking a moment to reflect on the conversations that shaped 2020. Across the episodes we published, we covered a wide range of topics and heard from a diverse set of voices in the web design and development community. In this retrospective, we revisit some of the standout moments and key takeaways from the interviews that defined the year.
Recapping the Conversations That Mattered
Throughout the year, we sat down with a variety of guests, each bringing their own expertise and perspective. From deep dives into technical workflows to broader discussions about the industry's direction, the episodes offered something for everyone. Whether you’re a front-end developer, a designer, or a project manager, there were valuable insights to glean from the conversations we had.
To give you a sense of the range and depth of the discussions, we’ve pulled together a selection of audio clips from the year’s episodes. These snippets highlight the most impactful advice and observations shared by our guests, and they serve as a reminder of just how much ground we covered in the past twelve months.
A Look at the Show’s Highlights
One recurring theme across the year was the importance of adaptability—whether that meant adjusting to new tools, embracing remote work, or rethinking long-held assumptions about the craft. Our guests repeatedly emphasized the need to stay curious and open to change, a sentiment that resonated particularly strongly given the challenges of 2020. Another frequent topic was the growing sophistication of the tools available to developers and the ways those tools are reshaping everyday practice.
We also spent time exploring the human side of the industry. Several episodes touched on collaboration, communication, and the value of shared knowledge. Those conversations served as a good reminder that the most effective work is rarely done in isolation, and that the community’s collective insight remains one of its biggest strengths.
The clips below offer a snapshot of these themes, but they only scratch the surface. For a deeper look at any of the topics discussed, you can revisit the full episodes. Every interview is accompanied by a complete transcript, making it easy to skim the content or find a specific quote whenever you need it.
The year may be ending, but the insights and ideas we shared will continue to inform how we work in the year ahead.
That wraps up our look back at this year’s episodes. A big thank you to everyone who tuned in and to all the guests who gave their time to share their knowledge. If you missed any of the conversations, or if you simply want to hear them again, you can find the entire archive online at podcast.smashingmagazine.com. Each page includes a full transcript of the interview, so you can review or share your favorite parts. We look forward to bringing you more discussions in the new year—see you in 2021!
Design Systems, Teamwork, And Persistence
Design systems are often thought of as a way to offload work — get the community to build components for you while the core team sits back. Amy Hupe, who worked on the UK government’s design system, told us that the reality is quite the opposite. The most complex part of the job is not writing the code, but getting people to contribute in the first place and then supporting them through the process. It’s often slower to help someone else make a change than it is to just do it yourself. The key, Hupe said, was to start building those relationships long before anything was public. The team went out and found all the different patterns across government — ten different ways to ask for an address, to name one example — and ran workshops to consolidate them together. That early investment in collaboration, plus a lot of persistence, is what made the project work.
Browser Engines And The Open Web
When Edge moved to Chromium, the web lost another rendering engine. Drew asked Microsoft’s Aaron Gustafson whether that consolidation is a threat to the open web. Gustafson acknowledged the business case for Microsoft’s decision, and the relief for developers who no longer have to test against a divergent engine. But he pushed back on the idea that the move ends healthy competition. In the old browser wars, companies were reverse-engineering each other’s JavaScript in a game of one-upsmanship. Today, the competition happens inside open source projects — in serious discussions about what goes into the spec, and about the tradeoffs of different implementations. Gustafson said he was heartened to see Microsoft actively vetting what lands in Chromium, not just passively accepting whatever comes downstream.
Frameworks, Buttons, And Ripple Effects
UI frameworks promise speed, but they also force you into compromises on the details that affect usability. Stephanie Walter told us about her experience working with Material UI: the ripple effect on buttons, for instance, is designed for mobile, where big feedback matters. But on the desktop, a full-width ripple can feel like overkill. Yet removing it would be so complicated — it’s built into the React framework — that the team just lives with it. That’s the tradeoff, she said, and it cuts both ways. You need to decide how much of the framework’s opinion you’re willing to accept in exchange for the speed it gives you.
Ethics, Long-Term Thinking, And Hidden Costs
Designing ethically means resisting dark patterns, and Martin Michael Fredrickson made the case that it’s also a long-term business strategy. He drew an analogy to a shop on a main street, where your reputation is everything. If you treat customers badly, they’ll go elsewhere. Online, the same logic applies, but it’s easier to lose sight of it in pursuit of short-term sales. Fredrickson also pointed out that manipulative or convoluted design has a hidden cost. Decluttering and simplifying saves money in the long run — but that’s never calculated when a business model is drawn up.
Static Sites And The CMS Gap
Static site generators are fast and simple, but authoring content for them can be awkward. Eduardo Bouças came on the show to talk about his tool, Sourcebit, which bridges that gap. It pulls content from headless CMSs and other remote sources, making them available for your build. Bouças described two ways to use it. In a deployment pipeline, you’d add a command like sourcebit fetch to your build process, so the static files get regenerated with fresh content at deploy time. For local development, there’s a watch mode, so whenever you change an entry in the CMS, previously-generated files are refreshed automatically — meaning you can see your content changes reflected on a local site in real time.
Measuring What Actually Matters
Conversion optimization is about more than just tracking sales. Paul Boag joined us to talk about the metrics that matter. Conversion rate is a starting point, but it’s too coarse. You need to look at average order value, and especially customer lifetime value — high churn often points to dark patterns or poor service. Engagement metrics matter too: are users watching your videos, how long are they on the site, and are they interacting with the content? Usability is the third pillar. Boag recommended the system usability scale as a standard measure, and tools like maze.design to time someone through a checkout process. The picture is far broader than a quarterly sales figure.
Privacy And The Creepy Algorithm
Laura Kalbag from Better Blocker came on the show to talk about privacy, and shared a chilling personal anecdote. Shortly after her mother died, she started seeing ads for funeral directors. She hadn’t posted anything online, and her family had deliberately stayed silent on social media. When she asked around, her sister admitted she’d messaged a friend in Australia via Facebook Messenger. Facebook already knew they were sisters — through explicit relationships or just inferred connections from shared locations and surnames. The system connected the dots. Kalbag said the site’s so-called creepiness is rarely the microphone you think is listening to you, but rather the complex web of your behaviors and relationships that platforms model, connecting signals you don’t even realize are being tracked.
Switching From In-Person To Online: The Quick Pivot
Early in the pandemic, Smashing’s conference and workshop schedule changed overnight. Rachel Andrew walked us through the scrambling. They had sold-out in-person workshops in San Francisco and suddenly found the entire schedule cancelled. These events aren’t just a nice side product — for many speakers and workshop leaders, they’re a major source of income. So the team decided to jump in head-first, put two of their own workshops online within days, and use themselves as guinea pigs to figure out the format. For delivery, they picked Zoom — not because it had the most features, but because it was the most accessible platform, and that was the priority. Andrew noted they’d revisit the choice if other platforms improved.
Building At Speed: CardMedic And The Home Office
When CardMedic was needed — a React Native app to help healthcare workers communicate with patients during COVID — speed was everything. Phil Smith told us how he practically skipped the decision-making stage: the requirements were so close to work he’d done before that he just started building. Had it not been for family life, he reckons he could have delivered it in five days of solid focus. The downside of shipping fast is technical debt, and Smith was upfront about it. He’d need to refactor some loose typing in the app, and the backend — now being used in production with volunteers translating the content — was short on tests.
Home Workstation Reality Chec
As we all moved our offices into our living rooms, the importance of a good setup became apparent. Ben Frain wasn’t shy about giving practical advice: spend the money on your chair. It’s the most important purchase you can make. Frain himself had fallen into the trap of buying a £45 office chair from Amazon, only to have it dig into his thighs during long sessions. If you’ve been given a high-end office chair by an employer, you probably took it for granted, not realizing its real cost. But when you do realize what people have spent engineering your comfort in the office, it might change your mind about what to spend at home.
Drupal 9: Sun Setting On Old Versions
Drupal has been around longer than many of us have been developing for it. In a special 20th anniversary episode, Angie Byron talked through the three upgrade scenarios to Drupal 9. If you diligently kept up with Drupal 8 releases, you’ll have almost no work to do. If you upgraded but haven’t kept after the changes, upgrading is manageable, with tons of tooling available, including a dashboard showing the compatibility status of contributed modules and automated checks that flag deprecated code. But if you’re moving from Drupal 7 or older to 9, the path becomes harder. App architecture change, like the shift to fully object-oriented PHP, means you’ll need to find alternatives for legacy custom code. Acquia has been working on a migration accelerator tool to help move Drupal 7 sites into the new world. Drupal 7’s community end-of-life was scheduled for November, and third parties like Acquia were offering extended support to 2024 at least.
Frameworks On The Client
Is putting so much control in the client’s hands a mistake? That’s the question Mina Markham wrestled with from her world of mostly static content websites. I asked her directly whether we’re over-relying on React when a simpler approach would do. Her analogy was apt: sometimes developers use a hatchet when a butter knife would suffice. She described a visceral reaction against the all-or-nothing approach, where a single JavaScript error would take down an entire page, offering nothing in between. She talked about sites that showcase web design history, which could have been partially served as plain HTML long before the beautifully enhanced experience was delivered. That’s where progressive enhancement came in, and that’s where Markham felt the modern development mindset often drops the ball.
Compositional CSS
Andy Bell believes in the message at the heart of CSS: the name itself is a hint — Cascading Style Sheets. CUBE CSS is his extension of that philosophy. It doesn’t drill down into tiny, meticulously named components. Instead, it steps back to think about layouts on a compositional level. After all, at some point your page is a whole view — you can’t avoid that into a contact page or a product page. So you define that as a skeletal layout and then slot components into it. Modern Grid and Flexbox solve many layout problems that previously forced awkward, micro-managed component structures. The result: components can behave as intended, with or without container quirks.
Gatsby: Statically Built, Dynamic by Default
Gatsby’s twist on the Jamstack model is that the front-end is built with React, so the final product isn’t just static HTML. Marcy Sutton explained what that layer provides. At build time, Gatsby uses Node.js to compile your React components into plain HTML, so you do get static content delivered first. Then there’s client-side routing, powered by React, which runs once a user visits. With JavaScript enabled, Gatsby pre-fetches resources from linked pages, making subsequent navigations feel nearly instant.
I was curious about the line where Gatsby crosses from static generator into single-page app. Marcy confirmed it does both. But with that functionality comes responsibility. You can add progressive enhancement approaches, and you have to guard the core flows — like the checkout process — so nothing breaks for users with JavaScript disabled. She mentioned Gatsby is internally exploring how to balance the performance/power tradeoff, keeping the powerhouse features but making sure bundle sizes stay under control against the data to back that up.
The Lean Web
Chris Ferdinandi doesn’t hold back. He believes modern best practices are breaking the web. He’s a key voice in the Lean Web movement, calling for simplicity and performance for users over the conventions of web development. Ferdinandi’s critique targets the bloat and the over-engineering that springs from focusing on what helps the developer experience first. Crucially, those developer-facing improvements often only benefit a subset of developers. The real priority, he insisted, must be to build in fewer lines of code and make the user experience faster and easier, not faster for you and me on the team.
Serverless Architecture at CodePen
In the rush to all things serverless, few have tested it at scale like the team at CodePen. I was curious what real tasks they actually put it to work on. Chris Coyier explained that processing Sass or TypeScript is a prime use case — the libraries are big, and shipping them to the client isn’t ideal. Instead, a single lambda does one job: it accepts Sass, spits out CSS and a source map, and runs at near-zero cost. That’s the architecture, tiny stateless functions with one tiny task. Their break-even is astronomically low; you can hammer it without worrying about scale.
Coyier’s favorite example is the traffic light: when a Pen gets a screenshot, that URL hits a CloudFront Worker, which first checks its key-value data store to see if it already has the image. If yes, it serves it directly, with all the CDN benefits — edge caching, size optimization. If the Pen is static, he said, it replaces iframe-based rendering with a lighter image version. Tiny functions, small jobs, big payoff.
Next.js And Bundle Sizing
As our infrastructure speeds up, we still fight the heaviest element: JavaScript. Guillermo Rauch, co-creator of Next.js, joined us to talk about his framework’s approach to bundle size. “Your observation is 100% right,” he said when I asked if large JS payloads hurt performance. Next.js runs automatic code splitting, making sure each page gets the exact JavaScript needed to render it — no more, no less. Then it pre-fetches the pages linked from the current one, so subsequent navigation feels like a single-application page load. This hits the sweet spot: you get the speed of a static HTML first paint and the snappiness of a single-page application for the next view.
Practical SVG And Animation Reach
Cassie Evans finds SVG’s superpower is approachability. She has seen people who fear JavaScript warm up to SVG any time, because it looks just like HTML but with graphics instead of documents. A solid learning path, she counseled, is to animate it with CSS first — for newcomers that’s a smaller step — then move toward JavaScript that can drive more dynamic properties. In dabbling with dataviz, she noted you don’t have to reach for heavyweight D3 every time. If you have a little bit of data to display, write JavaScript that changes what a graph shows directly, instead. You can start small and climb the complexity ladder only when you need to.
Code Splitting And Routing With Next.js
The Next.js conversation also dug into its approach to code splitting. Guillermo Rauch illustrated with a typical pages directory: index, about, dashboard, login — each file becomes an entry point to your app. When someone lands on a page, Next.js sends down just the JavaScript needed for that page and a common shared bundle. Then, for goodness of the user journey, it pre-fetches pages linked to the entry point. That results in that native single-page feel — but better optimized at the vital initial paint.
Vue 3 And What’s New
With Vue 3 release, and a major version bump, the natural question was whether this was fine polishing or a deeper rewrite. I asked Natalia Tepluhina what motivated the change. The big drive was rewriting the reactivity system, which in Vue 2 relied on Object.defineProperty — leading to documented but still frustrating caveats. Performance was hot on the list too. And for a large audience, the pain of using TypeScript with Vue 2 was enormous, especially with the ecosystem tools like Vuex. The new version, she said, is built to be fully TypeScript-friendly. Beyond that, they aimed to bring in better logic reuse patterns, comparable to what developers appreciate in React’s Hooks. Tepluhina emphasized how much ideas cross-pollinate across the ecosystem, and she sees that as a strength that benefits everyone, not a vice to be defended against.
TypeScript As A Guide
Stefan Baumgartner joined us to talk about TypeScript — he’s part of a team transitioning daily from Java and C++ to JavaScript. For those with a background in a stricter language, those quirks of JavaScript pop up regularly. Yet TypeScript acts as a bridge: it still represents concepts you already know with its type system. But the payoff is broader — with many people working in the same codebase, the type system offers an extra layer of documentation, where the team can focus on communicating ideas about a function’s purpose instead of solely their practical expectations around usage. The verdict: try it if you’re writing code alone (or with others), and you’ll revisit it anyway. With TypeScript, even the code you wrote six months ago when you were thinking one way becomes gently comprehensible again when you return.
Anymore Unopinionated?
David Darnes talked about Eleventy and pushed back on the term “unopinionated” — pointing out that building something newer usually demands beliefs somewhere in the stack. “As close as unopinionated as you could get,” he admitted. Eleventy remains compatible with an astonishing range of templating languages. You can choose Nunjucks (the default), or switch to popular options like Handlebars or Liquid, or even use native JavaScript to handle iterations. “Heck, even your CSS, if you want,” Darnes said. That flexibility is what appealed to the most diverse range of builders, despite the framework’s own assumptions about how you should build the logic and pages.
Netlify’s Own Playbook For Testing Workflows
Leslie Cohn-Wein from Netlify told me how the company dogfoods its tools — it builds the same platform it sells. Open a pull request on GitHub for their main app, and you’ll trigger a test run on Netlify automatically. From there, you get a set of “Deploy Previews” of the app. This isn’t just the main site: a trio of Projects — the main app site, a Storybook instance for the UI component library, and a third page showing Webpack bundle reports — all update together from that same PR in preview links. It gives the team a way to review new features visually, test the UI in its own Storybook, and run the Webpack analyze tooling, spotting bundle-size drifts in the same breath.
Next Gen Products And Fair Fabri
Chris Murphy came on to discuss product design and how a small company’s story can breathe through single-point ethics. It matters to me that brands people admire echo that quality — look at Hiut Denim, which does one thing: jeans — and how the founders, David and Clare Hieatt, built the brand around that single-topic philosophy, unlike their previous larger wholesale business. The Hieatts’ approach has them packaging a deeper meaning — beyond a garment, a vehicle for good stories around people and wages and local craft. This left a strong point on design from a values-level: watch what even established business minds juggle — particularly after the pandemic exposed so many cracks.
GraphQL In The Middle
Wrapping up the year, the last full-length episode looked at GraphQL in the whole-stack context. Eve Porcello described its positioning atop the development stack: living in the middle between front-end and backend code. On the front-end side, you can define fine-grained queries that retrieve exactly the fields needed to populate a page. For the backend, GraphQL consolidates REST APIs, databases, and more behind a holistic orchestration layer, sanitizing the swizzling of sources and giving you a clean ledger to parse. Useful to everyone sitting up or down the delivery pipeline.
Further Reading On Smashing
