• Let’s Meet At Web Summit 2018! The P2H team is coming to the Web Summit 2018 that will take place in Lisbon on Nov… twitter.com/i/web/status/1…

COMPANY BLOG & NEWSROOM

05May

The Best of April 2016: New Releases of Sketch & React, New Handy PS Plugins and Many More

april-639x296

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!

INDUSTRY NEWS

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.

FLASH CONTROL

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.

vivaldinewbrowser

 

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.

CSS IN JAVASCRIPT

Finally, the moment we’ve all been waiting for… a set of tools that enable us web developers to use CSS in JavaScript! Check out the full guide on Smashing Magazine.

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.

LONG-SHADOW GRADIENTS

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.

longshadowwithgradients

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.

DPI GUIDE

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.

explosiveheroimages

FREEBIES

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.

FreeUIkits

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.

leave a comment

All posts Back to top