You resize the browser and a smile creeps over your face. You’re happy: You think you are now mobile-friendly, that you have achieved your goals for the website. Let me be a bit forward before getting into the discussion: You are losing users and probably money if responsive web design is your entire goal and your only solution for mobile. The good news is that you can do it right.
In this article, we’ll cover the relationship between the mobile web and responsive design, starting with how to apply responsive design intelligently, why performance is so important in mobile, why responsive design should not be your website’s goal, and ending with the performance issues of the technique to help us understand the problem.
If you have to design an interface it's almost obvious to think to begin the process by drawing. But is this the best way? I once casually started by writing an imagined human-computer conversation, and only afterwards I continued by drawing. This changed my way of thinking and I never went back to drawing first. This article will explain the reasons behind my decision.
I have always been a huge admirer of the guys at Basecamp. Some time ago, I was reading a tweet by Jason Zimdars, one of its designers: “UI design starts with words.” He wasn’t joking. The comment got a lot of retweets, a lot of favorites. Everyone understood what he meant — except me.
Experiments and side projects are wonderful ways to challenge yourself and explore areas that you wouldn't usually consider exploring. That's what Smashing Mystery Riddles are for us: little experiments that challenge us to come up with something new, original and a bit crazy—every single time. The ideas are usually a synthesis of the things we discover, stumble upon or try out ourselves—and oh my, they take quite some time to get right.
The most recent riddle took quite a lot of time spent fiddling and getting right (and Guillaume, the designer, wasn't that happy about all the changes that our tests required). The basic idea was simple: as usual, you have a series of animated GIFs containing clues. One animated GIF leads to another, and every animated GIF contains a key (or keys) that have to be discovered. Once you uncover all the keys, you construct a solution and send out a tweet containing that solution. Doesn't sound too difficult, does it?
Fireworks is an excellent UI design tool; however, Adobe decided to feature-freeze it back in 2013 and (at the same time) did not offer any replacement tool to its users. Nevertheless, since Fireworks runs fine today on the latest Mac OS X and Windows OS, and since it still offers a solid UI-design feature set, many designers continue to use it and rely on it daily.
For those of you who are searching for a similar tool, Sketch 3.0 seems to be a pretty good alternative to Fireworks, but it's still not quite there yet; it's Mac-only, and while its vector tools are very good and it now has artboards, pages, symbols and styles, it lacks a few of the basic features available in Fireworks. (I'll talk more about possible alternatives to Fireworks in Part 2 of this series.)
Front-end development is no longer about individual frameworks. Tools are available — we merely have to choose. To make the right choices for your project, you need to start with a general approach, or methodology. But most methodologies have been created by big companies? Are they still useful for small companies, or do we need to reinvent them at a small scale?
You probably already know of BEM, one of those methodologies developed by a big company — namely, Yandex. BEM posits that three basic entities (blocks, elements and modifiers) are enough to define how to author HTML and CSS, structure code and components, describe interfaces and scale a project up to an industry-leading service.
This is the second and final article on how to sell and profit from digital products. In part 1, we covered many of the benefits of digital products over physical goods as well as the marketing philosophies to help you build an audience for your products. Today, we will be discussing more of the tactics required for a successful digital product business. There's also a dark side to this world, which we'll get into towards the end. Let's jump in.
Remember how one of the best things about digital products is that you don’t have to ship anything? Your profit margins are much higher, and fulfilling orders is so much easier! You still have to deliver the product to the customer, but e-commerce software will do that for you, so you don’t have to be involved at all.
Ah, these mysteryriddlesnever stop, do they? To celebrate the launch of the SmashingConf Whistler, our very first conference in Canada, we’ve prepared a yet another riddle, and of course this time it's not going to be any easier!
Tip: Watch out for a hint in one of the frames in each of the GIFs. Large view.
So, how does it work this time? Well, below you'll find the first of a few hidden animated GIFs that contain a secret Twitter hashtag. Your job is to deconstruct that hashtag as fast as possible. To do that, you have to pay attention to the file name and count objects within the GIF (for example, "3 chairs") and search for them on Twitter (i.e. #3chairs).