Talks
You will be going home not just filled with new energy and inspiration, but also with a lot of practical ideas and tips which you can use to make a difference.
All 12 talks will be 45 minutes long and will go into depth about various web related topics such as performance, accessibility, animation and its implications for web design and development. Below you can find the talks, keep posted for updates!
Unlocking the Power of CSS Grid Layout
By Rachel Andrew
Once you have grasped the basics of CSS Grid, you quickly discover how it enables many existing design patterns in a streamlined, elegant way. However, we shouldn’t see Grid in isolation. Understanding how other parts of CSS work together with Grid is key, in order to get the most out of our new abilities.
In this talk Rachel will be concentrating on a couple of these areas, CSS Box Alignment and CSS Sizing. Rachel will show you practical ways in which a little bit of knowledge in these areas can unlock the full potential of the Grid Specification. You’ll learn how to create useful components and to start thinking of ways in which you can solve design and interface problems in more creative ways.
Promoting Performance from the Ground Up
By Phil Hawksworth
No matter how good you are at crafting the most ingenious, high-performance code, you need to deliver it to your users reliably. You probably also need to evolve it over time. To test it. To get it signed off. All this can be painful. But it needn’t be.
This talk will look at ways to design a developer experience which then enables a good user experience. We’ll talk about the benefits of keeping your stack simple, of using the expertise of others, at ways to avoid launch day being more stressful than it should be. And we’ll examine some performance and security benefits of using the JAMstack and microservices in your projects.
Data Visualisation in News: The Creative Process
By Jane Pong
Pictures are easier than words, but how do serious news organisations translate difficult facts and stories into understandable graphics without over-simplifying?
In this talk, Jane explores ways in which newsrooms approach journalism in the digital age, by engaging the audience through data visualisation and interactive news technology. She describes some of the processes and tools behind producing data visualisations in a news context.
Interaction of Color Systems
By Diana Mounter
Color is the most relative medium in art. This fact makes working with color in design systems particularly challenging. Few people seem to want to claim to be an expert in color—perhaps because there’s an immensely deep amount to learn, or perhaps it’s because color is one of those things we hate to get wrong. Whatever the reason, color remains a contentious but often critical part of design.
She’ll be sharing her journey into color, from the technical challenges to how people respond to it. She’ll take a look at the efforts required in updating large scale web applications like Github, challenges in programmatically generating colors, creating color naming conventions, color accessibility, and testing the interaction of color with other parts of a design system.
The Event Loop
By Jake Archibald
Have you ever had a bug where things were happening in the wrong order, or particular style changes were being ignored? Ever fixed that bug by wrapping a section of code in a setTimeout? Ever found that fix to be unreliable, and played around with the timeout number until it kinda almost always worked?
This talk looks at the browser's event loop, the thing that orchestrates the main thread of the browser, which includes JavaScript, events, and rendering. We'll look at the difference between tasks, microtasks, requestAnimationFrame, requestIdleCallback,
and where events land.
Hopefully you'll never have to use setTimeout hacks again!
Design Ethics
By Oliver Reichenstein
To a designer, “design” is how it works. To everybody else design is how it looks: nice or ugly. To a philosopher, “ethics” is how we act. To everybody else ethics is how it feels: good or bad.
With the recent call for more ethics in design it’s time to explore what philosophical ethics means within the practice of Human Computer Interaction design. Oliver's talk examines the reality of design ethics within an agency and a corporate in-house environment.
Choose Your Animation Adventure
By Val Head
Animation has come a long way on the modern web and now we have a long list of choices for how to make something move on screen: CSS, JavaScript, SVG, the Web Animation API. With so many options, how can you be sure which is the best choice for your project? With an eye to both the strategy and tactics of animation needs, you’ll learn what which web animation options are the best fit for common UI design tasks.
Val will survey the full spectrum of animation options from CSS to React Motion and show which are best suited for things like state transitions, showing data, animating illustrations, or making animations responsive. You’ll also see how your choice of animation tools can impact performance, so you’ll leave knowing exactly which tools to choose for your animation needs.
How to Hack a Web App?
By Asim Hussain
Thought hacking was hard? It’s not, it’s easy and I’m going to show you how! In this episode of CSI Hong Kong, we’ll investigate a series of hacking stories and break them down step-by-step to see exactly how they did it.
By the end, you’ll walk away a little bit more scared and a lot more prepared with some great practices you can apply immediately to your own applications.
Navigating Choppy Waters
By David Wieland
What was the biggest thing you’ve ever taken on? I doubt it was a walk in the park. One day you’ll likely face a project which appears bigger than you can chew. With the right team and assets, nothing is insurmountable but it sure as shit can be scary at times.
The larger the assignment, the more people are involved and the more likely it is to collapse under its own weight. So how do you steer your project away from catastrophic disaster? 🤔
Strategy Guide for CSS Custom Properties
By Mike Riethmuller
Static variables are not always global, but global variables are almost always static, therefore dynamic variables should almost always be local. Did you follow that? If not, you might need to see my talk.
I will cover HOW to use CSS variables correctly for things like: theming, responsive design, prototyping, animation and much more. A practical guide that tells you more than how the syntax works.
Fontastic Web Performance
By Monica Dinculescu
Web fonts are awesome. They make your sans-serifs slabby, your headers special and your website look gorgeous. But fonts are a resource, and downloading resources always comes as a cost — if you don’t load web fonts efficiently, what you get instead are phantom underlines, blank pages, and user rage.
Let’s talk about ways to avoid this, and what new platform features are here to help us deliver pretty (but also!) fast experiences to everyone.
Weird Wacky Wonderings
By Tim Holman
Ever started a project you didn't finish? Ever stared at your screen, knowing you wanted to make something, but unsure what? Ever felt like you're alone in making something?
Join Tim, though some weird and wacky wonderings through the web, and find how building, learning and having fun are all connected together… and gain a little more appreciation and love for code along the way!
