The Best of April 2016: New Releases of Sketch & React, New Handy PS Plugins and Many More
As a lover of all things web dev and design related, you’re probably keen to find out the latest industry developments – with a view to polishing your skills and staying competitive. However, slogging through the internet to find all the juicy tips and news takes a lot of time – so we’ve done the hard work for you. I know, I know – we’re too kind!
Here’s a round-up of the latest web dev news, plus some amazing tutorials and freebies. Have fun!
IMPORTANT SKETCH UPDATE
Big news for Sketch users – Symbols has been updated. It’s a big departure from the original implementation in 3.0, and now functions a lot more like Artboards, occupying just one central space in your document. Want to find out more? Hear what the experts have to say about it in Sketch’s recent blog post.
Microsoft Edge has introduced some changes that give users far greater control over Flash. Content such as ads or animations that are built with Flash will display in a paused state, unless you explicitly click to play them. This should massively improve performance, so it’s a welcome introduction. You can learn more about it here.
REACT 15 RELEASE
Want to know all about the release of React 5 and discover why there were two updates one after the other in April? Learn the details at GitHub. Quick tip from us, install React v15.0.1, some issues were fixed in this version.
VIVALDI, THE NEW BROWSER
Finally, Vivaldi 1.0 has landed! The first stable release of the new web browser has got the industry talking, with many people loving the minimalistic user interface and customizable functions. If you haven’t checked it out yet, get involved here – and let us know what you think of it.
MUST-SEES FOR DEVELOPERS
AWESOME FLEXBOX PATTERNS
If you’ve got the right skills, Flexbox can be invaluable. However, there are some fundamental Flexbox concepts that are difficult to implement. This handy guide features some interactive examples, showing you practical ways to build UI components. It’s a great way to get your knowledge up to speed. Check it out.
360˚ PRODUCT VIEWER
Your eCommerce clients are continually seeking ways to display their products online. This simple-to-use 360˚ product viewer enables the user to see the product from all angles – something your customers will undoubtedly thank you for. Learn how to do it by reading CodyHouse’s walkthrough.
DYNAMIC SVG TIMER
Does your project require a clock or timer? It’s a bit of a hassle using bitmaps, so StyleCampaign.com have come up with a clever way of creating a timer using CSS to drive an SVG animation sequence. Find out how to incorporate it into your own work right here.
Adding long shadows to your fonts provides a real sense of dynamism to the page, especially with gradients. Those wonderful designers at Codepen have been working hard to create a guide detailing exactly how to achieve this effect in your own designs. Enjoy.
WEB DESIGN MIX
8 STEPS TO MICROINTERACTION DESIGN PERFECTION
Designers are always focused on offering the best user experience possible. Microinteractions may be small, but they make a big difference when it comes to creating an amazing user experience. If you’re not 100% confident that your microinteractions are performing well in your designs, read this helpful guide featured on Awwwards.
Are you keen to learn more about cross-DPI and cross-platform design? This awesome, no-nonsense guide from Sebastien Gabriel talks you through all you need to know – starting with the basics.
HANDY PHOTOSHOP PLUGINS
Okay, so Photoshop was never really meant to be used for web design. However, despite that fact, it still offers a number of great features for web dev projects – but it can slow down the performance of the site. Here’s a list of the 10 best plugins to keep your site running smoothly whilst using Photoshop.
TYPOGRAPHY SECRETS FOR BETTER HERO IMAGES
We love a good hero image. It’s attention-grabbing and gets the message across quickly. However, typography can sometimes fall short, especially if the central image is a powerful one. Here’s six key typography tips that’ll make your hero image soar off the page.
EASIER SITE MOCK-UPS
Looking for a simpler way to sketch up sitemaps and build site mock-ups? These 126 crafted cards, made by Petr Knoll, make life so much easier – and you can download them all for free. All assets come in SVG, EPS and AI formats. Check it out here.
RESPONSIVE OFFICE ICONS
Want a set of 150 office icons completely free of charge? You got it! Head over to Tympanus.net to claim yours.
FREE SKETCH MOBILE WIREFRAMING KIT
This fantastic free flow-chart kit is completely Sketch-ready, and makes wireframing so much simpler. Thanks to Behance.net for this useful freebie.
SOCIAL USER UI KIT
Here’s a handy UI kit for your designer toolbox – a social user-focused one. Find out more by reading the details on Behance.net.
FREE UI KIT
It’s always a good idea to have plenty of UI kits at your disposal. Market-Me have got this slick design for you – and it’s completely free to download.
We hope that you picked up some useful tips in this month’s round-up. If you’d like to keep up to date with all the latest industry news, reviews, tips and techniques, simply subscribe to our newsletter or follow us on Facebook or Twitter.