The UI development became difficult in the last couple of years. That is because we pushed the state management to the browser. And managing state is what makes our job a challenge. If we do it properly, we will see how our application scales easily with no bugs. In this article, Krasimir Tsonev will see how to use the state machine concept for solving state management problems.
Read more…
A grid is like invisible glue that holds a design together. Even when elements are physically separated from each other, something invisible connects them together. Grids help designers to build better products by tying different design elements together to achieve effective hierarchy, alignment and consistency, with little effort. If executed properly, your designs will appear thoughtful and organized. In this article Nick Babich aims to give you a good understanding of grid systems, what they are, and how they can be applied to your design process. Understanding how to use grids will come from practical experience.
Read more…
Creating inclusive experiences is a question of using the right menu patterns in the right places, with the right markup and behavior. In design, we often make the mistake of giving different things the same name. They appear similar, but appearances can be deceptive. In terms of inclusion, it may lead you to repurpose a semantically and behaviorally inappropriate component. Users will expect one thing and get another. In this article, Heydon Pickering will give you an insight into inclusive menus and menu buttons.
Read more…
Our ears are the second-most important sensors we have, and in some situations, voice conversation is a very effective communication channel. But relying just on verbal communication is not enough. For example, would you buy a shoe without seeing it first? Of course not. As long as visual image-processing remains people’s main information source, and we are able to process complex information faster visually, the GUI is here to stay. On the other hand, more traditional GUI patterns cannot survive in their current form either. So, instead of radical predictions, David Pasztor suggests another idea: User interfaces will adapt to our sensors even more.
Read more…
In the last few years, traditional computers have ceded dominance to smaller screens, including tablets, mobile phones, smartwatches and more. As the craft has evolved, so has its toolset; and from one app to rule them all, we have gotten to a point where it seems like a new contender among UI design tools crops up every month. And many of the new UI design tools look pretty good and promising. At the moment, Sketch has grown in popularity and for a good reason: The developers of Sketch have figured out exactly what interface designers have been looking for and have steadily added functionality to address those needs. The pace of development of Sketch has been phenomenal, to say the least.
Read more…
The web has the power to bring virtual reality to the world, to every consumer, to every developer. Recently, there has been a proliferation of virtual reality (VR) web browsers and VR capabilities added to traditional browsers. In this article, Ada Rose Cannon will look at the state of browsers in VR and the state of VR on the web via the WebVR APIs. It is still early days for VR on the web, but now is the time to get building, to see what works and what doesn’t.
Read more…
With the current state of web apps, we can rely on various UI elements to interact with users. With the Web Speech API, we can develop rich web applications with natural user interactions and minimal visual interface, using voice commands. In this tutorial, Tomomi Imura will use the API to create an artificial intelligence (AI) voice chat interface in the browser. The app will listen to the user’s voice and reply with a synthetic voice. Because the Web Speech API is still experimental, the app works only in supported browsers. The features used for this article, both speech recognition and speech synthesis, are currently only in the Chromium-based browsers, including Chrome 25+ and Opera 27+, while Firefox, Edge and Safari support only speech synthesis at the moment.
Read more…
Today, virtually all companies have to grow non-stop. What we call “growth” in the tech world is called “persuasion” in academia. With this article, Akar Sumset will show you why gamification is a great tool for growth and how persuasion science proves that. You will see how the six components of mass interpersonal persuasion relate to gamification, with well-known examples and facts for it to be easier to understand and relate to. Let’s get going!
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…
Humor is an important aspect of life. It has many positive benefits, like reducing stress, increasing psychological well being and increasing tolerance for pain. Humor is integral and inherent to human relationships. You can use humor in your design to create a positive user experience. We want to develop positive relationships with our users — humor can help make that happen. In this article, Victor Yocco will show you that you can incorporate humor in your design, maintain your brand identity and not look like you are trying too hard in the process.
Read more…