Schedule
You probably know the drill: 2 days, 1 single track, 13 speakers. The conference will start around 9:30 AM and we’ll finish around 6 PM on the second conference day. We’ll be hosting our (in)famous side events on September 8, the day before the conference, so it might be worth to arrive in the morning before it all starts. You know, to settle in and stuff.
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. Once we have most speakers confirmed we will be releasing the schedule.
Workshop Sun, 8th | Conference Mon, 9th | Conference Tue, 10th | Workshop Wed, 11th
Sun, 8th – Workshops
Schauinsland Cable Car 🚠
Come to discover the life at 1284 meters above sea level with the Schauinsland Cable Car. With the longest loop cable car in Germany, you will reach the peak of Freiburg and its stunning panorama in 20 minutes.
We will be meeting in front of the Historisches Kaufhaus at 12:00. We will be taking public transport to the cable car. Tickets for the cable car are 13 euro and at your own expense.
Jam Session
The night before the conference kicks off, we're hosting a warm-up event with our dear friends from Shopify, with drinks and talks from your fellow attendees. We hope you'll join us to connect ahead of the main event!
Please register so we know you're coming!
Mon, 9th – Conference
Morning Run 🏃♀️
Join speakers and attendees for a 5k run! On both conference days we'll meet in front of the conference venue at 7:00 and run 5k taking in the scenery of Freiburg! We'll be running for around 30-40 minutes.
Everyone is welcome, it'll be a gentle jog to stretch our legs and chat with friends, not a race.
Doors Open
Welcome
Designing Powerful User Experiences With Psychology
What do an overnight 40% drop in road accidents, a night in on the couch watching TV and a good night’s sleep have to do with digital product design?
Humans only have limited mental capacity and no-one is ever operating at 100%. We are all influenced by the world around us and by how our minds work. As designers we need to be able to understand this and design for it.
To help you understand how psychology can transform your designs, we’ll look at:
- The micro: Psychology to optimize Interaction Design. How psychology can help design the perfect search UI and how to apply to psychology to design bullet-proof UIs.
- The macro: Psychology to transform the User Experience. How to use psychology to create innovative user experiences and transform digital product design
After the talk, you’ll be able to:
- Design product, app and website UIs that match how people think and behave.
- Apply a framework to design innovative digital products.
- Make better, informed design decisions and advocate to the wider team using psychology theory.
Morning Break
Have you already enjoyed a barista coffee by Honeypot?
Effortless Performance Debugging
The website is already live. You are really proud of how it turned out, but then you notice that something is off… After some time you realize that the problem might lie in performance: things take too long to load, there are moments when you see awkward content jumps and at times scrolling feels painful. Sounds familiar? This talk is for you.
During the session we will talk about the causes of painful performance and look into simple and actionable steps how to make a website more performant with a little effort. Most of the examples will be based on a real-life debugging experience. We will dive into the undiscovered areas of Developer Tools and into the basic performance auditing. I will help you understand how browser rendering works and why it can be one of the causes of flawed interaction performance. To leave you with some ideas about where to start your debugging, I will also provide you with examples of UI patterns that are bound to slow down your experience, if implemented incorrectly.
The Anatomy Of A Click
Have you ever wondered how many things actually happen when you click a button on a webpage? In just a split of a second, an amazing amount of things are happening: an electric circuit is closed, a USB packet is sent, an interrupt handler fires in the OS, which then dispatches the event to the browser's event loop, which eventually executes some JavaScript code. And this is just a small part of the whole story.
Have you ever looked into the source code of Chromium? Linux? What about the internals of a TCP/IP packet? Sit back, relax, and enjoy the show of two curious web developers who are enchanted by the complex world that awaits behind the scenes of the front end!
The Anatomy Of A Click
Have you ever wondered how many things actually happen when you click a button on a webpage? In just a split of a second, an amazing amount of things are happening: an electric circuit is closed, a USB packet is sent, an interrupt handler fires in the OS, which then dispatches the event to the browser's event loop, which eventually executes some JavaScript code. And this is just a small part of the whole story.
Have you ever looked into the source code of Chromium? Linux? What about the internals of a TCP/IP packet? Sit back, relax, and enjoy the show of two curious web developers who are enchanted by the complex world that awaits behind the scenes of the front end!
Lunch Break
Lunch Session — The Web We Want, Microsoft (only 22 seats, lunch provided!).
Submit your wants for the web and you could get to present it to an expert panel of judges. Best of all, the top problems will win awesome prizes! As the date comes closer, we will be publishing the finest lunch spots.
Designing With Motion
In this session Val will bring an interface to life with web animation. She considers both UX and branding, to take it to that next level of polished design. Utilizing CSS animation, SVG and JavaScript to pull off our animated vision, she’ll take it from design idea to execution whilst considering the accessibility implications too.
You’ll learn how to move from design to code with animations, and how to get the all important motion details like timing and easing just right.
Afternoon Break
Visit the Shopify stand and learn how to build sites with Shopify and become a member of their partner program.
Think Like An Email Geek
Coding HTML emails is a beast of its own, often perceived as relying solely on outdated practices. And for a good reason, email client quirks can make even the most clever front-end developer crazy. Emails are still part of your user's journey, from commercial newsletters to transactional emails.
The first step to thinking like an email geek is to understand how email clients change our code and why this happens. From technical and security constraints to user experience enhancements, every quirk is there for a reason.
Those constraints then allow email geeks to invent new ways to use HTML and CSS. From building responsive layouts without media queries to creating interactive emails without any JavaScript—"Life finds a way" to quote my favorite mathematician.
Afternoon Break
Every Product Has A Voice
When you read the words scattered over an app or website, you experience them as if spoken. This voice is every bit as real as color or motion on a digital screen — it’s an illusion, and it’s there for you to design. Words are often the most important design element in a product, but designers rarely handle them with the same care or conviction that we have for visual patterns. We can do better.
I will share simple guiding principles to help you design better with words. I find lessons and inspiration in neuroscience, fairy tales, and examples from across the web.
Closing Remarks
Planetarium 🌔
After the first day, join us at the Planetarium and they will be doing two showings, especially for us.
We have two shows that start at 19:00 and 19:45. Please register so we know which you'd like attend!
After Party
Time to party it up! Take your team members, or make some new friends, and we’ll have a wonderful night of networking and fun.
Our amazing sponsor Speedcurve will take excellent care of us with a couple of drinks and snacks on them!
This party is only for Smashing attendees, please don’t forget to bring your badge. Hope to see you at Grünhof Freiburg!
Tue, 10th – Conference
Morning Run 🏃♂️
Join speakers and attendees for another 5k run! On both conference days we'll meet in front of the Historisches Kaufhaus at 7:00 and run 5k taking in the scenery of Freiburg! We'll be running for around 30-40 minutes.
Everyone is welcome, it'll be a gentle jog to stretch our legs and chat with friends, not a race.
Doors Open
Welcome back!
Life Is A Mystery
We have found a magician who is going to take you on a journey through wonderland. ✨
Morning Break
At 11:00 Deque Systems are raffling two Vector robots. Go by their booth to check if you’re one of the winners!
International Is The New Mobile First
Since last year, Shopify launched in 18 new languages. In this talk, you’ll gain insight about how international is forcing us to fundamentally shift our way of thinking. In the same way mobile disrupted a once desktop-only internet, international is disrupting the way we think about commerce.
Learn about the UX principles and tooling we’re using to take on meaty challenges to drive forward a large scale product that was previously only supported in English.
Coffee Break
Visit the stand of Haufe group, go on a VR journey and maybe find your new job!
Service Workers for the Rest of Us
There are a lot of articles and tutorials on the web about Service Worker, but unfortunately most of them focus solely on JavaScript applications, and how to use build tools to turn those applications into PWAs. But what about traditional websites, content sites, or other sites that don't have monstrous build pipelines? Should they use service worker too?
In this talk, I'll give a brief introduction to service worker, talk about my workflow, and show how I use service worker to improve reliability and load performance for web "sites".
Lunch Break.
Lunch Session — Easy Accessibility Testing For Dev Teams, Deque (only 22 seats, lunch provided!).
As the date comes closer, we will be publishing the finest lunch spots.
A Little Advice From An Illustrator And Animator
How do you bring an idea to life and build a consistent world? Illustration and animation use a particular style and consistency to make it work well.
Guillaume will show the process behind making an illustration and animating it. He will go from idea, via sketch, to the final digital animation. Along the way, he will tell you how he stays motivated and keeps his audience engaged as well.
Afternoon Break
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.
Afternoon Break
Building Privacy-Conscious Projects
Protecting your users’ data is the most important thing you will ever do as a developer, but it isn’t always easy to know where to start. In this session, Heather will give you a toolkit for integrating best privacy practices across your project.
You’ll learn how to define a healthy approach to privacy on the governance, project, and code levels; integrate privacy as a fundamental project value; evaluate your project for gaps in resourcing and expertise; audit your existing work for improvements; and access the growing body of code, design, and resource libraries available to help you along the way.
History Photo Walk
🧙♀️ If you don’t want your SmashingConf to end yet, join us for a history photo walk! We'll be exploring the neighborhood and take some cool photos. Please reserve your free ticket, so we know we can expect you!
Wed, 11th – Workshops
Workshops
On Wednesday, we’re running three hands-on workshops:
- Sponsored Workshop: How To Translate Wireframes Into Accessible HTML/CSS with The Deque Team,
- Accessible UI Patterns with Sara Soueidan,
- Psychology for UX And Product Design with Joe Leech,
- Smart Responsive UX Design Patterns with Vitaly Friedman.