Forms are at the center of every meaningful interaction, so they’re worth getting a firm handle on. That’s why we published Form Design Patterns, a new printed book about accessible and well-designed web forms. With the new Form Design Patterns book, you will go through common real-world problems step by step, and learn how to design simple, robust, lightweight, responsive, accessible, progressively enhanced, interoperable and intuitive forms that let users get stuff done no matter what. And by the end of the book you’ll have a close-to exhaustive list of components delivered as a design system that you can use immediately in your own projects. Jump to table of contents or get the book right away.
Read more…
We’re happy to announce Adam Silver’s new book Form Design Patterns. In this excerpt from the book, Adam takes a look at the foundational qualities of a well-designed form and how to think about them.
Read more…
Good functional animation makes a landing page not just more appealing, but also more usable. When done correctly, animation can turn a landing page from a sequence of sections into a carefully choreographed, memorable experience. Today, Nick Babich brings you Slides, a framework that will help you use animation to communicate clearly. In this article, Nick will provide the best examples of animation created using the Slides framework.
Read more…
Gutenberg is the future of WordPress, and it is just around the corner. WordPress usually releases its major features as a plugin to test the waters before baking them into the core. Gutenberg is no exception. In this article, Muhammad Muhsin will show you how to go about building your first Gutenberg block. You will be building a Testimonials Slider Block while dwelling on the basics of Gutenberg. Brace up for it by learning how to build your own custom Gutenberg block.
Read more…
In this article, Vitaly Friedman brings you the videos from our Toronto Smashing Conf, which are now available! Toronto was our all live-coded conference. Take a look at what our speakers got up to without their usual slide decks. The speakers had been asked to present without slides. And it was brilliant!
Read more…
Dealing with this in JavaScript can be tricky. But what if instead of fight against it we could leverage on it to achieve nice stuff like function composition with virtual methods? This is what Willian Martins is going to explore in this article about one of the potential upcoming JavaScript features: The Bind Operator. The goal here is to add some hype around it and create awareness of the hard work that TC39 is doing to find consensus, fix all the syntax and semantics issues and have it shipped with the next releases of ECMAScript.
Read more…
In this final article of the series, we wrap up by taking a look at some of the common uses for Flexbox. What should we use Flexbox for, and what it is not so good at? Today, Rachel Andrew is going to spend some time thinking about what the use cases for Flexbox really are, given that you now have CSS Grid Layout, giving some suggestions for what you might use when and a way to decide.
Read more…
Angular is the most powerful JavaScript framework for building highly interactive and dynamic web applications. And material design Is an adaptable system of guidelines, components, and tools that support the best practices of user interface design. In this article, Rachid Sakara is going to build a news application using Angular 6 and Google’s material design in combination, which will help you to make your future applications with Angular look great in web browsers and mobile devices.
Read more…
Looking for a way to create your own website without having to hire a developer? Search no more: The WP Page Builder is a free plugin that does most of the heavy lifting for you. In this article, Jakub Mikita will go through the process of building a real website using the WP Page Builder plugin. He’ll build a website of a few simple pages related to the fictional Rockhedge Park. You’ll learn about the plugin from installation to website launch.
Read more…
The Framer team recently changed course with the announcement of a new prototyping tool, Framer X. Lachezar Petkov got to play with it during the beta phase, and in this article he adresses UI and UX designers who would like to learn more about Framer X’s prototyping abilities. Since it is a brand new product, you don’t need to be familiar with the older Framer application to read along. However, a little bit of familiarity with HTML, CSS, React, JavaScript and Node.js are beneficial.
Read more…
