There are many options available for prototyping mobile user experiences, but if you need to prototype native apps for mobile devices you should take a look at Proto.io when evaluating potential choices. This solution has many features for designing and prototyping mobile apps, including built-in component libraries for specific devices, great support for gestures and transitions, and an app that allows for easy viewing on actual hardware.
But the first thing to know is that unlike most prototyping tools, Proto.io is a web application, so you’ll need an internet connection to do your work. This is a drawback compared to other options likes Axure RP, Blueprint, Justinmind, or iRise. It can have an impact if you plan to work somewhere where Wi-Fi connections don’t always live up to their promise, like on a flight, in an airport, or in a hotel.
Read more…
I’m a firm believer that the best way to optimize for fast-loading mobile sites is to optimize for everyone. We don’t know when someone is on a non-mobile device but tethered to their phone, or just on awful Wi-Fi.
In a previous article for Smashing Magazine I explained how you can speed up your websites by serving dynamic pages from a reverse proxy like Varnish. If you are new to Varnish then that article is the place to start as I’ll be diving straight into configuration details here. In this article I’ll explain how you can benefit from using Varnish even when there are parts of your pages that can’t be cached for long periods, using Edge Side Includes.
Read more…
Editor’s Note: Designers could learn how to code, and developers could learn how to design. Sometimes it might not be an option. In this article, the author makes a suggestion to designers without coding skills on how to start crafting code. You might want to take the suggested tool with a grain of salt (or not) but the idea might be worth looking into.
Designers have widely adopted HTML and CSS for a while now. They usually feel comfortable enough to implement their own designs, at least in a static form. However, they’re often intimidated by JavaScript — and rightly so! HTML and CSS are declarative and, I’d argue, closer to design than programming.
JavaScript, on the other hand, is “real” programming. This means you not only have to learn a whole new and complex syntax but also have to “learn how to think.” The barriers to entry are high and prevent many designers from taking the plunge. uilang tries to fix that.
Read more…
Lazy loading images started to become popular on the web back in 2007, when Mika Tuupola drew inspiration from the YUI ImageLoader utility and released a jQuery plugin. Since then, it’s become a popular technique to optimize page loading and the user experience. In this article I will discuss why we should and shouldn’t use Lazy Load, and how to implement it.
Read more…
After the untimely (and still kind of sad) demise of Fireworks, I found myself looking for other ways to design apps and websites. I also had the desire to produce something more interactive for when I talk about my work with stakeholders. It turned out that Sketch, when paired with some other neat tools, would be a big part of this workflow.
In this article, I’ll talk you through why you should prototype and how you can do it with Sketch and prototyping tools such as Flinto and InVision. You’ll also get a nicely documented freebie Sketch file to help you.
Read more…
If you mention printing with CSS to many people who work on the web, print style sheets are the use that comes to mind. We are all well used to creating a style sheet that is called upon when a web document is printed. These style sheets ensure that the print version is legible and that we don’t cause a user to print out huge images.
Read more…
Today, being a designer is about much more than drawing beautiful interfaces in Photoshop or Fireworks. To properly design a website or application, a UI designer must understand the technology with which their products will be built; therefore, they must have a minimum set of front-end development skills. The World Wide Web is not static. Quite the opposite: It’s responsive, fluid, evolving and ever changing.
Web designers need to be familiar with HTML and CSS code and front-end technologies when they conceive a website or application’s interface. It might be of no real interest to some of you, but it could add some precious assets to your range of skills.
Read more…
The Web Speech API enables websites and web apps not only to speak to you, but to listen, too. It’s still early days, but this functionality is set to open a whole array of use cases, which makes it pretty awesome.
Read more…
Have you ever seen someone make creative notes at a conference and wished that your own notebook was more presentable? It’s much easier to do than you think. You don’t have to be an aspiring lettering artist, and you don’t need to develop top-notch drawing skills.
Making your notes more interesting doesn’t have to be a huge undertaking. It’s not like learning to play the piano or taking up diving. If you think sketchnoting looks fun, I have some tips to get you started.
Read more…
Why is it so important to optimize your SVGs? Also, why even put in the effort to make them accessible? In this article, Sara Soueidan explais why, and also how to style and animate with CSS.
Read more…