Smashing Newsletter: Issue #206

Editorial

Nobody wants to be slower than a competitor, and nobody wants to lag behind. We’ve been thinking a lot about what would make a conference a truly valuable experience, and how attendees can learn most. That’s why at our upcoming SmashingConf Toronto 2018 , well-respected speakers will show how they work — performance audits, accessibility audits, refactoring, debugging, sketching, improving conversions in eCommerce as well as designing and building a design system. A conference full of practical, hands-on live sessions. With Lea Verou, Dan Mall, Tim Kadlec, Marcy Sutton and many other speakers.

Ah, and just in case you need to convince your manager to bring you to the event, here’s our Convince Your Boss PDF. We’d love to meet you there! :-)

Let’s think out of the box every once in a while,
— Vitaly (@smashingmag)

The State Of Front-End Tooling 2018
Case Studies About Switching To A PWA
A Toolkit To Enable Data-Driven User Experiences
Eqio: A Simple, Tiny Alternative To Container Queries
A Design Ecosystem To Tribute Endangered Species
Hand-Curated Freebies For Designers And Developers
Trip Planning Made Easy
Free Webinars And Conference Talks On Everything Design Systems

1. The State Of Front-End Tooling 2018

Front-end development is an ever-changing landscape. New tools replace old ones, some are adopted quickly, others take a bit longer until they are fully accepted. But what’s the current state of front-end tooling? More than 5,000 front-end developers participated in the Front-End Tooling Survey 2018 to paint a clear picture of the current state of things and show how usage has changed over time.

The findings range from the most popular preprocessor (Sass with 65%), the most popular CSS framework (Bootstrap with 34.7%), and how much acceptance CSS linting has gained, to how much experience developers have with different CSS methodologies and which ones they actually use in their projects. Check out the complete survey results for more insights.

SmashingConf New York (October 23-24)

We’re very happy to announce the 5th SmashingConf New York , taking place on October ²³⁄₂₄ in NYC. For this one, our speakers will cover all kinds of failures and the decisions they had to make to turn it all around. We’ll look into all those shiny new things in front-end and design, from Progressive Web Apps to (web fonts) performance, CSS Secrets to Design Systems, and how to convince your colleagues and clients the right way. With Sara Soueidan, Dan Mall, Monica Dinculescu, Jason Grigsby and many other speakers.

And we’ve got some wonderful workshops as well. Tickets will go on sale in one week on Tuesday May 29th, and we’ve got only 50 early birds available. Make sure to → check the speakers! :-)

2. Case Studies About Switching To A PWA

Progressive Web Apps are known to be fast, reliable, and engaging. And, well, a 4x increase in conversion rate, doubling up the average user session length, or shaving off loading times by more than a half aren’t hollow promises but real-world success stories from switching to a PWA.

To collect stats and case studies about how Progressive Web Apps have helped improve user engagement and conversion rates, CloudFour brought PWA Stats to life. The community-driven list gives detailed insights into how companies like Forbes, Pinterest, Twitter, but also booking platforms and e-commerce sites have benefitted from making the switch. It’s also a good time to recap Aaron Gustafson’s comparison on when to go for PWA or Native.

3. Eqio: A Simple Alternative To Container Queries

In times of web-based design systems and component libraries, the classic responsive design principles that are tailored all around the viewport width aren’t enough anymore. Imagine you want to use a component in a different context than it was created for, for example, or you have a component that regularly changes its sizes. Now if only Container Queries were here already!

To close the gap until native Container Queries will become reality, Matt Stow created a useful little polyfill: eqio. It uses IntersectionObservers to allow components to adapt their styling based on their width instead of the viewport’s by applying appropriately named classes to the component when its width satisfies your pre-defined requirements. A simple and tiny alternative.

4. A Toolkit To Enable Data-Driven User Experiences

Predictive data analytics. They could help predict the next page a user is likely to visit and let you prefetch it to improve perceived performance. Or you could use them to adjust the user experience depending on the next article, product, or video a user is likely to view. Interesting ideas, but let’s be honest: They are quite complex and difficult to implement. Guess.js now wants to change that.

Brought to life by Minko Gechev, Addy Osmani, Katie Hempenius, and Kyle Mathews, Guess.js provides libraries and tools that simplify predictive data-analytics driven approaches. The goal: Lowering the friction of applying this thinking to modern sites and apps, and using the data from analytics and machine learning models to cater for better user experiences. Worth taking a closer look at.

5. A Tribute To Life In The Rainforest

The Amazon rainforest is the home of unique and intriguing species. However, wildlife is threatened. To raise awareness for the endangered animals, a team of designers created a multidisciplinary design project that joins type design, illustration, and web design. Its name: Amazônia.

Amazônia explores the idea of developing a complete design ecosystem. Amazonia Script, the main building block, is a hand-drawn brush pen typeface with 763 slightly rugged and condensed glyphs, fast and curved strokes. Its sister, Amazônia Life, contains 54 icons representing endangered inhabitants of the rainforest, and finally, a beautiful set of 26 animal illustrations tops things off. Eye candy and an immersive web experience beautifully blended together. By the way, if you want to purchase the font and icons set, the designers will donate $1 to the World Wildlife Fund to protect the Toco Toucan and its friends.

6. Hand-Curated Freebies For Designers And Developers

Everybody loves a good freebie, right? If you’re up for some freebie hunting, be sure to check out ByPeople. Adding new freebies that are bound to give your design and development projects the finishing touch on a daily basis, the community is one of the biggest repositories of free assets.

Over 10,000 hand-curated downloadable goodies, collected into growing categorized lists, are available: free tools, fonts, GUI kits, themes, templates, plugins, code snippets, and everything else you could wish for. A treasure chest.

7. Trip Planning Made Easy

Summer’s just around the corner and you haven’t found the perfect travel destination yet? Or maybe you’re going to a conference abroad and would love to explore the country a bit? If you want to go on a trip but aren’t a fan of all the planning and researching that needs to be done beforehand, Route Perfect might be just what you’ve been looking for.

The service helps you plan a trip based on your preferences and budget — with just a few clicks. You decide where you want to start and end your journey, the date and duration, and who you’ll be travelling with, and Route Perfect will suggest you a route that you can easily customize to your liking with a few sliders. Finally, once you’re satisfied, you can even book directly on the site. Great inspiration is guaranteed, but despite all the planning don’t forget the most important thing when travelling: Get lost. After all, that’s how you discover the best spots and make the best memories, right?

8. Free Design Systems Talks

Everybody’s talking about Design Systems. We even have a neat and very popular Design Systems book dedicated to them. If you haven’t gotten around to dive into the topic yet or if you feel you need some real-life tips from fellow designers who have successfully implemented a design system into their process, the folks from DSCONF have got you covered.

The two-day conference all about Design Systems took place just a few weeks ago, now the organizers share the videos of the talks online. Among the speakers are Jina Anne (Amazon), Karri Saarinen (Airbnnb), Josh Brewer (Abstract), and many more. If you don’t have the time to watch the talks completely, no worries, you’ll find the main takeaways neatly summarized on the site, too.

May 22, 2018 Smashing Newsletter: Issue #206

Previous Issues