You probably know the drill: 2 days, 1 single track, 10 speakers.
Both days start at 9 AM PDT (check your time), and we’ll finish around 4 PM on both days. Join us for talks, interactive sessions, followed up with a time for Q&As and discussion zones. Ah, and the best bit: on both days you can play an active role — interacting with speakers and other attendees.
Looking forward to meet you!
Want to stay updated on the latest speakers and talk topics, why not follow us on Twitter?
Our speakers rarely show slides: they show how they work — their setup, techniques and shortcuts for getting work done in live interactive sessions. So expect everything from refactoring and debugging to sketching and redesign, live.
Get some pizza… eh coffee and join Sara Soueidan and Vitaly Friedman at their Pizza Show. They’ll be looking forward to today.
9:15 AM
Smashing To Meet You! ☕️
We love getting to know you a little bit better. Join the session and learn a bit more about your fellow attendees, the organisers and maybe even yourself! ;-)
9:45 AM
Welcome
Kicking off the first day of SmashingConf San Francisco! Just some welcome words, guide to the platform and friendly chat. We can’t wait to meet you!
VR offers the ability to close the distance and facilitate connection between people. As many industries shift to remote work this is more important than ever. VR can supercharge our productivity at home and at work, learn about how we’ve been approaching these opportunities at Oculus.
CSR, SSR, SSG, ISG, & WTF.OMG?BBQ! with Next.js with Ahmad Awais
Should this page be static, server-rendered, or should I do it all on the client-side? Maybe I should regenerate the page every sec on the server? Dang! Decisions like these for Next.js beginners are pretty hard. Let Ahmad Awais help you decide.
Why is this growing discipline still so hard to understand?
A decade in, the practice of content strategy has grown tremendously, but we're still struggling to define the brand of the discipline within our own companies and design departments. Even with investment and demonstrable impact, our peers and partners can struggle to understand and articulate what it is exactly we do: It's basically experience strategy, right? It's mostly just copy, yeah? It's definitely Design. It's kind of Marketing. We'll talk about where this misshapen brand identity comes from, how to (re)establish it, and how to make it stick.
The New York Times is the most innovative storyteller in the world, famous for turning complex subjects into digestible narratives with its unique brand of storytelling. It's in-house brand studio is responsible for applying these techniques to branded content in a way that's creative, visceral and keeps the audience engaged.
As former Creative Director of the studio, I'll go through some of the greatest success stories in recent years and some of the design and storytelling methods we utilise to bring these stories to life.
Rachel Simone Weil is an experimental artist and hardware hacker who currently works on developer tools for the new Chromium-based Microsoft Edge browser. She has spoken about the intersections of Javascript, 8-bit homebrew, and art at numerous conferences including OSCON, NodeConf EU, Node Interactive, and Signal.
Rachel will be giving you 15 DevTools tips every front-end designer should know, and after this talk you will.
1:10 PM
Lunch Break
🥗 Let's have lunch, while enjoying DJ Tobi's tunes. What are you going to have? Have you found the Smashing Members stand already?
In his “Inclusion is not your job” talk, Farai will discuss practical ways we can be inclusive. Turns out, even if we are not in HR or a manager, we can do a lot!
Design is a medium for communication, and to do it well, we must cultivate our own communication skills. Within design teams, we do our best work when we create a culture of feedback shaped by our creative space and our design review process. Beyond the design tribe, our work thrives when it’s communicated in language that aligns to the goals of the business and invites participation early and often.
In this presentation, Aarron will share the experiences of real design teams at Apple, Spotify, and other organizations to show how to improve the communication of design both inside your team and with key outside stakeholders. You’ll see how to run effective design reviews and retrospectives which will help you create a culture of feedback that produces better work, helps designers sharpen their skills, and communicates the value of design by making it more transparent and inviting.
3:50 PM
After Party
Don't leave us yet, we'll be hosting a little party! Join us for a little quiz, live DJ performance, silly dance moves, and design & coding challenges.
Wednesday, 11th – Conference
9:00 AM
Doors Open
9:00 AM
The Pizza Show 🍕
Get some pizza… eh coffee and join Sara Soueidan and Vitaly Friedman at their Pizza Show. They’ll be looking forward to today.
9:15 AM
Smashing To Meet You! ☕️
We love getting to know you a little bit better. Join the session and learn a bit more about your fellow attendees, the organisers and maybe even yourself! ;-)
CSS is evolving all the time. With each browser release, more and more features are supported. Join Rachel Andrew at What’s Coming Next to CSS, where she will be talking about what new exciting things are coming to your browser, and how you can help.
Applied Accessibility: Practical Tips For Building More Accessible Front-Ends
As front-end developers, we are tasked with building the front end of a Web site or application — in other words, we are building the user's end of an interface. This is why it is crucial that we ensure that the front-end foundations that we build are as inclusive of and accessible to as many users as possible. To do that, we must build with accessibility in mind from the get-go. This, in turn, means that the way we approach writing HTML, CSS, SVG and JavaScript *might* need to change as we take into consideration many factors that affect how (in)accessible our UIs are.
This talk is a practical one, chock-full of tips for creating more accessible front-end foundations. If writing HTML, CSS, SVG and JavaScript is part of your job, then this talk is for you.
In this session — a series of macro case studies from real client projects — Sara shares some frustrations, many lessons learned, and a lot of practical tips and tricks for building accessible front-end foundations that you can take and apply in your own projects right away.
A Component’s Journey Through Design, Code, and Documentation
Design systems emerge from all sorts of frameworks, yet web components promise a future of reusability across them all. No matter how you’ve been making systems before, integrating this approach into your design system workflow requires you to up your game. Testing? Check. Accessibility? Check. Architect flexible sizing, theming, and responsiveness? Check.
During this session, Nathan and Kevin will demo how to a designer and developer pair to deliver a new web component to a growing catalog. Using existing visual style, buttons, headers, and icons, we'll design and code a card component on stage. We’ll work in tandem to scaffold up design assets and code in real time while synchronizing naming and API. We'll adjust design tokens, slot content, run tests, "unexpectedly" break things, demo accessibility, cope with ShadowDOM, author doc, and release the component. Buckle your seatbelts and get ready for a ride on the system express!
A Component’s Journey Through Design, Code, and Documentation
Design systems emerge from all sorts of frameworks, yet web components promise a future of reusability across them all. No matter how you’ve been making systems before, integrating this approach into your design system workflow requires you to up your game. Testing? Check. Accessibility? Check. Architect flexible sizing, theming, and responsiveness? Check.
During this session, Nathan and Kevin will demo how to a designer and developer pair to deliver a new web component to a growing catalog. Using existing visual style, buttons, headers, and icons, we'll design and code a card component on stage. We’ll work in tandem to scaffold up design assets and code in real time while synchronizing naming and API. We'll adjust design tokens, slot content, run tests, "unexpectedly" break things, demo accessibility, cope with ShadowDOM, author doc, and release the component. Buckle your seatbelts and get ready for a ride on the system express!
Every so often the 10× developer trope makes the rounds. The debates get heated: what is a 10× developer? Are these traits we should treasure or avoid? do 10× developers even exist?
In this talk, we’ll break down the very real risks of idolizing individual contributors, dig into the nugget of truth that keeps this stereotype alive, and dive into what a real “10× developer” might look like. (Hint: it’s not about code; it’s about people.)
You’ll walk away with a better understanding of individual and team psychology, efficiency and productivity at scale, creating safety and trust for teams, and elevating the entire organization rather than burning out top performers.
1:10 PM
Lunch Break
🥗 Let's have lunch, while enjoying DJ Tobi's tunes. What are you going to have? Have you met our sponsors already?
“If debugging is the process of removing bugs, then programming must be the process of putting them in.” —Edsger Dijkstra
We've all be there—a new feature has been designed, built, and is ready to be released. Or maybe you've updated an existing feature, manually tested it, and feel confident in your changes. That is...until it went live and resulted in a bug. Now, you're left wondering how you could've missed the fact that your feature includes a component that's shared across other features within your application; and of course, updating it affects more features than just the one you intended to change.
Even the most rigorously, manually tested frontend applications can result in costly production bugs and increased workload for everyone involved. Yet, automated frontend testing can often feel like unfamiliar territory, but it doesn't have to. Join Youri as she provides an introduction to the different types of automated frontend testing and how you can get started with including them in your workflow to accelerate the development process, reduce business expenses, and identify potential bugs before they get into production.
The web used to feel like an exciting, mash-up art experiment. Why did it all get so serious? In an industry focused on metrics, the human touches are often overlooked. Let's have a play and look at how we can use SVG and Greensock to introduce some whimsy to our websites.
What’s the fastest way to create a heart icon? How about a puzzle piece, or a settings cog? By revisiting the fundamentals of icon design, we’ll explore how these deceptively simple shapes can be created at higher precision and with fewer steps, speeding up your entire workflow.
In this talk, Marc will share countless practical tips and techniques that work in many design tools.
4:00 PM
Closing
All good things come to an end. Thankfully, you can relive it all with our videos, slides, and collaborative docs. We hope you'll get back to work with new skills and fresh inspiration. Thank you for joining us! 💟