Pushing the web forward

As designers and developers, we all love to try and use new shiny things. We get excited when a new Android version is announced, we have our own wishlists for the next iOS release, we try to keep up with the pace of the new web platform features.

Oh, shiny!

While being informed about these new capabilities is a thing, we know that everybody just wants to use them as soon as possible! Large majority of designers and developers we know of, are always on the latest versions of Android, iOS, or the browsers of their choice. For example, among worldwide Chrome users, 73% of them are on Chrome 45+, whereas this figure is above 98% for Zeplin. Taking this even further, we like to test the upcoming versions of these platforms by working on their beta versions, as soon as they come out. This is not just because we like it, it is (and should be) also our responsibility to be knowledgeable on new things.

As designers and developers, being up-to-date means a lot to us: new API’s to play with, performance improvements, security enhancements etc. They bring previously not-so-possible ideas into reality, light a bulb in our minds. They also introduce new ways to revamp existing work, helping us keep the codebase tidy and clean. Don’t you feel better when you delete a dusty old piece of code, or get rid of old-fashioned design elements? 😁

Every little bit helps

With Zeplin, we want to help developers (including ourselves) figure out all intricate details of designs. Zeplin’s code export capabilities saves people from dealing with boilerplate code, and allows you to focus more on the fun part of development. Well, this is the obvious part, but we also want to help you keep up with the latest developments in the platforms. One clear example of this would be the CSS Variable export option: it exists since Zeplin was in beta, when it was only supported by Firefox. Now that every browser implemented CSS Custom Properties, you can finally plan to migrate your existing code to use them, yay! 💃

Following the path of this mission, we’re also planning to add an option to generate some CSS snippets using CSS @apply rule. In essence, it’s like SASS mixins; but similar to CSS Custom Properties, they are dynamic and they cascade. You can even give it a try in Chrome Canary.

However, our desire to use new things fade away when users of our products don’t update their software. We, as Zeplin crew, are somewhat lucky on this matter: we’re building software for designers and developers, we receive the most detailed and helpful bug reports, improvements/feature suggestions, and we can safely assume that most of you use up-to-date software in your daily lives. Thank you for that!

Internet Explorer? Never heard of it

Considering this fact, we never really thought of supporting Internet Explorer while building our Web App, since day one. Because we know that you want it to die as soon as possible too, and use a modern browser like Firefox, Chrome, Safari, or Edge. While we receive a couple of requests to support Internet Explorer from time to time, we don’t want to return back to dark ages of web development — no no! We totally understand that in corporate environments keeping your software up-to-date requires some bureaucracy, and we don’t want to hand wave people so quickly, but it should also be our duty to explain why having an evergreen browser is both good for us and good for the company as a whole.

On the OS X land, having the most recent Safari version is not that easy, since browser updates are tied to the operating system updates. However, with the recent Safari Tech Previews, the future looks brighter! We totally understand people who cannot update their OS to obtain the latest Safari, and in that case, they’re always welcome use our native Mac App.

New update policy

All of these bring us to our new update policy: we’ll try to drop support for old versions of browsers when their overall usage is below 3%. This will enable us with a great extent to clean our code, add new features faster than before, and make performance optimizations. To be precise, starting next week, Zeplin’s Web App will only support Chrome 45+ and Safari 9+ (not much will change for Firefox and Edge users since both browsers already support the API’s we’re planning to use). Of course we’ll try our best not to disrupt your workflow while following this policy.

Regardless of this news, we’ll continue to use Progressive Enhancement wherever possible. That’s how we implemented “Download asset” or “Copy to Clipboard” functionality in the Web App, without relying on an intermediate server or Flash fallback. Just for a quick reference, they use the download attribute of <a> element, and execCommand function whose restrictions has recently “loosened”. We hopefully want to dive more into details in our future posts!

This is how Zeplin’s support matrix will look like in the following weeks:

• Windows 7, 8 and below: Chrome 45+, Firefox, Windows App (Hype!)
• Windows 10+: Chrome 45+, Firefox, Edge, Windows App
• OS X 10.9 Mavericks and below: Chrome 45+, Firefox
• OS X 10.10 Yosemite+: Chrome 45+, Firefox, Safari 9+, Mac App
• Linux: Chrome 45+, Firefox

Hope you’ll enjoy what the future holds, and hopefully we’ll be back with a post on which API’s we’re experimenting with.

Until then! 👋