Depending on how a user browses the Internet, modal windows can be downright confusing. Modals quickly shift visual focus from one part of a website or application to another area of content. This scenario is more common than it should be. And it’s fairly easy to solve, as long as you make your content accessible to all through sound usability practices. In this article, Scott O’Hara has set up a demo of an inaccessible modal window that appears on page load and that isn’t entirely semantic. First, interact with it using your mouse to see that it actually works. Then, try interacting with it using only your keyboard.
Read more…
Shocking user interfaces costs companies in productivity, training and even the customer experience. People are fed up with inadequate internal systems. Many of those interviewed had given up on the official software. Instead, they use tools like Dropbox, Google Docs and Evernote. Frustration will only increase as millennials enter the workforce. These people are digital natives, and they expect a certain standard of software. They expect software to adapt to them, not the other way around. In this article, Paul Boag will show you how to fix this.
Read more…
In a previous article, Svetlin Denkov briefly mentioned another category of clickthrough prototypes: widget-based mockups that are designed on the target device and that expand on sketches by introducing user interface (UI) details and increased visual fidelity. These prototypes can be used to pitch ideas to clients, document interactions and even test usability. In this article, he will teach you how to use the iPad app Blueprint to put together such prototypes in the form of concept demos, which help to manage a client’s expectations when you are aligning your visions of a product.
Read more…
Eight years is a long time on the web, yet for us it really doesn’t feel like a long journey at all. We’d love to share a few things that we’ve learned over the last years about the performance challenges of this very website and about the work we’ve done recently. If you want to craft a fast responsive website, you might find a few interesting nuggets worth considering. In this article you will find a little story about the things that happened on this little website over the last year. Thanks for keeping us reading throughout all these years. It means a lot. You are quite smashing indeed. You should know that.
Read more…
To fully realize that creativity, successful developers need to continually improve their skills. The web industry has grown from this desire to learn. You only need to look at the unwavering demand for conferences, workshops and training days for evidence of this, but the cost of continually sending your team to workshops and training days can quickly become unsustainable. Within your team lies a wealth of skills, knowledge and experience that can be shared and developed further. With a little effort and using resources freely available on the web, you can increase the technical competence of the team organically, with much lighter demands on time and cost.
Read more…
JavaScript-based animation is often as fast as CSS-based animation — sometimes even faster. CSS animation only appears to have a leg up because it’s typically compared to jQuery’s $.animate(), which is, in fact, very slow. However, JavaScript animation libraries that bypass jQuery deliver incredible performance by avoiding DOM manipulation as much as possible. In this article, Julian Shapiro will smash some myths, dive into some real-world animation examples and improve your design skills in the process. If you love designing practical UI animations for your projects, this article is for you!
Read more…
With a distinct lack of debugging tools, developers turned to a variety of hacks. In general, these hacks were an attempt to recreate a given issue in a desktop browser and then debug with Chrome Developer Tools or a similar desktop toolkit. To put it bluntly, these hacks don’t work. If you’re recreating issues on the desktop, then you can’t be certain that any of your fixes will work. In this article, Jon Raasch will explore a variety of emulators and simulators that you can use for quick and easy testing. Then, he’ll look at remote debugging tools, which enable you to connect a desktop computer to a mobile device and leverage a rich debugging interface.
Read more…
In this article, Matthew Andrews, a lead developer behind FT Labs, shares a few insights he had learned along the way while building the FT application. You’re going to make a simple offline-first to-do application with HTML5 technology. Matthew will also be running a “Making It Work Offline workshop” at our upcoming Smashing Conference in Freiburg in mid-September 2014.
Read more…
Aspiring to beauty in our designs is admirable. But it doesn’t guarantee usability, nor is it a product or marketing strategy. “Beautiful” says very little about the product. How many people, fed up with PowerPoint, cry out in frustration, “If only it were more beautiful”? No one has figured out how to describe their product effectively. For example, Write, a note-taking app, describes itself as “a beautiful home for all your notes,” which doesn’t say much about why one might want it. Macworld describes it as “Easy Markdown Writing for Dropbox Users.” That’s both concise and specific: If you like Markdown and use Dropbox, you’ll read more. It wasn’t always this way. Indeed, when Dave Feldman became a designer, he had the opposite problem.
Read more…
As designers we usually turn to different sources of inspiration. As a matter of fact, we’ve discovered the best one—desktop wallpapers that are a little more distinctive than the usual crowd. This post features free desktop wallpapers created by artists across the globe for September 2014. This creativity mission has been going on for six years now, and we are very thankful to all designers who have contributed and are still diligently contributing each month.
Read more…
