SmashingConfs, Inspiring Talks And Birthday Cake — Smashing Magazine

Fifteen Years In, Still Smashing

Smashing Magazine published its first article in September 2006. The web has moved on considerably since then, but the publication's focus hasn't: quality content produced by a deliberately small team that values passion, honesty, and a professional-but-informal tone.

2020 forced a change of plans, but the shift to online events went smoothly. Soon after lockdowns began, Smashing launched its virtual conference program and found a warm reception. The distributed team has enjoyed the chance to connect with audiences across different time zones.

After more than a decade of publishing, the mission remains constant: supporting productivity, sharpening design and development skills, and improving work-life balance. The full range of resources — articles, guides, the podcast, digital books, job listings, conferences, the newsletter, and membership — exists to help readers learn something new daily. The collaborative spirit of "getting better together" still guides everything.

Editor-in-chief Rachel Andrew shared personal stories from the team last year. For newer readers curious about how the publication operates, the contributor guidelines offer a look behind the scenes. Smashing remains open to new contacts and contributions.

Interface Design Checklists, Now As PDF

Vitaly's Smart Interface Design Checklists recently received a digital edition. The cards are designed to help designers and developers catch misunderstandings early, avoiding ambiguity and expensive corrections later in a project. A table of contents is available for quick navigation.

A printed version isn't available yet — only the PDF is currently for sale, with print shipping to be announced once worldwide delivery becomes viable.

Workshops And Conferences, All Online

The upcoming online workshop lineup includes live sessions, Q&As, discussion zones, and challenges. Live captioning in English is provided. When's the next chance to learn from industry folks?

All 2020 events moved online, leaving two remaining conferences for the year.

SmashingConf Austin/NY Online (Oct 13–14)

The programming for the New York and Austin events has been combined, since the two were originally close together and similar in scope. The event runs on Central time. The schedule is live, and tickets are available.

SmashingConf SF Online (Nov 10–11)

The San Francisco event rounds out 2020 on November 10th–11th, running on Pacific time. Details are on the event page, with the schedule and registration now open.

Recent Reads From The Magazine

Smashing publishes at least one new article daily, and the RSS feed delivers them as soon as they're live. Five recent pieces that have generated interest:

• "Designing With Reduced Motion For Motion Sensitivities,"
  by Val Head
• "How To Build Your Own Comment System Using Firebase,"
  by Aman Thakur
• "Everything Developers Need To Know About Figma,"
  by Jurn van Wissen
• "Forms And Validation In Ionic React,"
  by Jerry Navi
• "Demystifying Django's Magic,"
  by Precious Ndubueze

Newsletter Standouts

With the Smashing Newsletter now arriving weekly and focusing on a single topic per edition — CSS, front-end accessibility, and JavaScript, among others — subscribers have been sending plenty of great discoveries our way. Here are some of the most useful and interesting finds from recent issues.

Free Vector Illustrations and Animations

Pixel True Studios offers a free set of vector illustrations, icons, and animations covering everything from security and search to e-commerce and SEO. The illustrations come as SVGs, while the animations are built with Lottie, and the whole collection is released under an MIT License for use in both personal and commercial projects. It includes a number of playful error-state animations — think a cow abducted by aliens or the Loch Ness Monster — which can add a friendly touch to any interface.

Japanese and Cyrillic Web Design Collections

Most web design showcases tend to focus on Latin-based typography and layouts, but two collections offer a refreshing look beyond that. Responsive Web Design JP catalogs Japanese sites with an emphasis on lightness and essential elements, browsable by technique even if you don't read the language. Cyrillic Design does the same for sites using Cyrillic typefaces, highlighting how bold typography can make a statement. Both are good reminders that inspiration often lies outside familiar territory.

Isoflow for Cloud Diagrams

Isoflow is a browser-based tool from Mark Mankarious that makes isometric cloud architecture diagrams quick to create. You drag and drop elements onto a canvas, connect them, and add labels — then export the result for print or web. Because the icons are vector-based, the diagrams stay sharp at any size, making the tool a handy timesaver for visualizing complex relationships.

Screen Reader Accessibility Guidance

Holly Tuke, who uses a screen reader herself, outlines five everyday website features that create barriers for blind and visually impaired users. Missing alt text, auto-playing videos, unlabeled buttons, poor heading structure, and inaccessible forms might seem minor, but they can determine whether someone can use a site independently. Tuke's post explains each issue and how to fix it.

For teams looking to embed accessibility into their workflow, Peter van Grieken's Accessibility for Teams guide assigns specific responsibilities to each role. The guide is split into six parts targeting product managers, content designers, UX designers, visual designers, and front-end developers, plus a section on testing. It is still in progress — the product manager and UX designer sections are already live.

Design System References

Josh Cusick's Design Systems For Figma is a collection of 45 design systems created in Figma, featuring work from Atlassian, Audi, Uber, Apple, Goldman Sachs, Slack, and the City of Chicago. Since all files are in Figma, you can duplicate or download them to inspect how each system is structured — a useful reference for seeing how other teams organize reusable UI components.

A Brief History of Interfaces

Product designer Ehsan Noursalehi has turned a 2018 meetup talk into a micro book titled Why Do We Interface. Written after months of quarantine shifted his perspective on technology, the book traces interfaces from the failed Apple Newton in 1993 to today's voice-first systems, considering how they shape what it means to be human — and what that means for designers.

Tools for Blobs, JavaScript, and Games

Blobmaker is a minimal generator from Lokesh Rajendran that creates blob shapes for web or Flutter projects. You set the level of randomness and complexity, choose a color or gradient for the fill and outline, and get the SVG or Flutter code for immediate use in UI animations, backgrounds, or frames.

Jonathan Dinu offers a roadmap for speeding up JavaScript applications in the browser. The centerpiece is a flowchart for identifying performance bottlenecks, followed by an exploration of streaming data, web workers, GPU acceleration, and Web Assembly — including when each approach helps and when it can actually hurt performance.

Ct.js is a free, open-source game framework and editor for creating 2D games in any genre. Built on WebGL, it comes with a visual editor, tutorials, and editable examples, with documentation covering variables, conditionals, loops, and functions for beginners. More advanced users can plug in their own JavaScript libraries to extend the tool.

Flume is a React-powered node editor and runtime engine for modeling business logic as a JSON graph. It is aimed at apps with complex, varied business logic or heavy reliance on feature flags. Its engine runs the graphs in any JavaScript environment, and the project is released under an MIT open-source license.

From the Bookshelf

Some of the web community's most experienced contributors have published their work as printed books through Smashing Magazine. If you haven't yet, you may want to look at what Paul and Alla have shared from their own practice.

Further Reading

• The Modern Guide For Making CSS Shapes
• How To Design Effective Conversational AI Experiences: A Comprehensive Guide
• What Are CSS Container Style Queries Good For?
• Sticky Headers And Full-Height Elements: A Tricky Combination