It used to be enough for user interface elements to “look professional” or simply to “add polish” to a website. But in the past few years we’ve come to expect more personal interactions and stronger relationships with the apps we use. Our relationship with the web has evolved dramatically over the past few years. It is a much more intimate relationship than it was before we had smartphones and tablets. Physically, the web is in our pockets. It’s on the couch. Custom images are a powerful design tool. They can tell a story and convey a distinct personality. Custom illustrations can be especially impactful. They can make our audience feel personally connected to an app or website, while being an integral part of the design.
Read more…
Imagine that you get up to get a glass of water, but the exact reason why you did that at that particular time isn’t easy to explain. It was “too hot” and you were “somewhat thirsty,” but also maybe “a little bored.” Each of these qualities isn’t either/or, but instead fall on a spectrum of values. In contrast, software is usually built on Boolean values. You set isHot to true and if isHot && isThirsty && isBored, then you call getWater(). If you use code like this to control your game characters, then they will appear jerky and less natural. In this article, Lou Franco will show you how to add intelligent behavior to the non-player characters of a game using an alternative to conventional Boolean logic.
Read more…
Adam Silver redesigned Boots.com so that each panel became its own page, removing the need for accordions and AJAX. This inconspicuous and humble UX pattern is flexible, performant and inclusive by design. Having a lot on one page might give the illusion of simplicity, but like algebraic equations, they are difficult to deal with unless they are broken down. Adam Silver has not come across another design pattern that has as many benefits as this one. This is one of those times when simple is just that: simple.
Read more…
What’s going on in the industry? What new techniques have emerged recently? What insights, tools, tips and tricks is the web design community talking about? Anselm Hannemann is collecting everything that popped up over the last week in his web development reading list so that you don’t miss out on anything. The result is a carefully curated list of articles and resources that are worth taking a closer look at.
Read more…
For every application Yury Dymov works on, he needs to decide how to manage the data. The problem can be broken down into the following three subproblems: Fetch data from the back end, store it somewhere locally in the front-end application, retrieve the data from the local store and format it as required by the particular view or screen. In this article, Yury sums up his experience with consuming data from JSON, the JSON API and GraphQL back ends, and it gives practical recommendations on how to manage front-end application data.
Read more…
if an app is not useful, it will have no practical value for the user. Even if the app is useful but requires a lot of effort, people won’t bother learning how to use it. Good design has a clear focus on key user goals, and it removes all obstacles from the user’s way by bringing clarity to the interface. In this article, Nick Babich brings you closer to seven UX design tips that are key for creating really great mobile user experiences.
Read more…
The simpler, smaller and lighter an application is, the cheaper and easier it will be to write from scratch. When Nick Gauthier set out to build MeetSpace, he and his team had a familiar decision to make: What’s our tech stack going to be? They gathered their requirements, reviewed their skillset and ultimately decided to use vanilla JavaScript and to avoid a front-end framework. Using this approach, they were able to create an incredibly fast and light web application that is also less work to maintain over time.
Read more…
Have you ever wanted to make a website that non-technical folks can edit right in the browser? Or have you ever wanted to make a website that presents an editable collection of items (e.g. your portfolio)? Or simply upload images to a website you made, right from the browser? In this article Lea Verou will show you that you can do these things (and more!), just with HTML and CSS? No programming code to write, no servers to manage. You can make any element editable and saveable just by adding one HTML attribute to it. In fact, you can store your data locally in the browser, on Github, on Dropbox, or any other service just by changing an HTML attribute.
Read more…
Conferences are a brilliant opportunity to get up close with the pros and exchange tips and ideas. But they aren’t the only one. Our friends at the full-stack UX design platform UXPin brought the first free virtual summit to life a few months ago. Now the second edition is on its way, and we are very happy to help make it happen: the Agile UX Virtual Summit, focusing on all things Agile UX. Because, well, we all know that building a UX team with agile organization can be quite a challenge.
Read more…
When working with creative designers on web page designs, it’s fairly common to receive multiple Sketch or Photoshop artboards/layouts, one for each breakpoint. In this article, Jake Wilson is going to examine how to create scalable, fluid typography across multiple breakpoints and predefined font sizes using well-supported browser features and some basic algebra. The best part is that you can automate it all by using Sass.
Read more…