We’ve been closely working with Maya on this article, and we’re happy to see the final result now being published on 18F. We highly encourage more teams to share the lessons they learned when building design systems or pattern libraries, and we’re always happy to support them in writing, editing and shaping that article. This post is a re-post of Maya’s final article. In this article, Maya will shed some light on how to built tools to leverage industry-standard best practices and produce a design system with reusable components.
Read more…
When designed properly, Feature comparison can aid in decision-making way beyond placing product specifications side by side. They can also add meaning to an otherwise too technical product specification sheet, explaining why a certain feature is relevant to the customer or how a certain product is better than the others. In this article Vitaly Friedman will look into all of the fine details that make a perfect, accessible and helpful feature comparison table.
Read more…
Let’s look into the fine details of designing better slider controls for selecting a value or a range of values, with do’s and don’ts and things to keep in mind when designing one.
Read more…
Vitaly Friedman has spent a lot of time working with various companies trying out various approaches and studying them in usability tests. This series of articles is a summary of observations and experiments made throughout that time. He’ll be exploring everything from carousels to car configurators. Let’s look into the design of date and time pickers today. With a date picker you can combine day, month and year into one input field, add a fancy calendar icon, and prompt a calendar overlay that exposes the main purpose of the calendar prominently. In fact, there are plenty of contexts in which date pickers matter! Let’s find out.
Read more…
Design patterns can be extremely helpful, mostly because they save time and get us better results, faster. We don’t need to apply them exactly as they are to every problem we encounter, but we can build on top of them, using our experience to inform our decisions because we know they’ve worked in other projects fairly well. Today, Vitaly Friedman brings you a summary of observations and experiments made throughout the time. Tighten up your seat belts: in this new series of articles on SmashingMag, we’ll look into examples of everything from carousels to filters, calculators, charts, timelines, maps, multi-column tables, almighty pricing plans all the way to seating selection in airline and cinema websites.
Read more…
Today, many apps make assumptions about user preferences based on personal data. They use this information to make decisions on your behalf, without any direct input from us. This type of design pattern, where user choice is removed, has recently been coined “anticipatory design”, which leverages data on user behavior to automate the decision-making process in user interfaces. Despite the good intentions imbued in anticipatory design, though, automating decisions can implicitly raise trust issues . In this article, Graeme Fulton will look at how you can give people confidence in the decisions made for them by using “light patterns,” which ensure that user interfaces are honest and transparent, while even nudging users to make better decisions for themselves.
Read more…
Accessibility has always been a slightly unsettling realm for web developers. Surrounded with myths, misunderstandings, and contradicting best practices, it used to be a domain for a small group of experts who would “add” accessibility on top of the finished product. With our new book, we get to the bottom of it all! Written by Heydon Pickering, a well-respected accessibility expert, the book includes dozens of practical examples of accessible interface components and inclusive design workflow, applicable to your work right away. With this book, you’ll know exactly how to keep interfaces accessible from the very start, and how to design and build inclusive websites without hassle and unnecessary code.
Read more…
Considering that most carousel implementations lack many usability details, one can understand why strong wording is often used in discussions about carousels. But there are alternatives to a home page carousel that both perform well and are vastly easier to implement. In this article, Christian Holst will go over the 10 implementation details he’s found that are required to make home page carousels perform acceptably with end users. He’ll outline how and why mobile and desktop implementations should differ and, lastly, suggest a simpler, problem-free alternative to home page carousels.
Read more…
Passwords are written off as inconvenient and unavoidable, but due to a combination of sensors, encryption and seasoned technology users, authentication is taking on new (and exciting) forms. In this article, Drew Thomas will show you that it’s OK to rethink common password habits, and it’s acceptable to use common sense and due diligence to create usable, secure and error-free authentication – passwords or otherwise. Most other interaction patterns have been updated over time, but no one wants to mess with password authentication. It’s time to change that!
Read more…
When we design responsive websites, we tend to see responsive design merely as a collection of slightly differently sized rectangles, with a slightly different layout, sometimes with slightly different content poured into them. In this article, Vitaly Friedman features some of the slightly more obscure design patterns, such as responsive car-builder interfaces, mega dropdown navigation, content grids, maps and charts, as well as responsive art direction.
Read more…