This newsletter issue was sent out to 233,520 newsletter subscribers on Tuesday, December 13th 2016. If you are not subscribed yet, feel free to subscribe to our email newsletter anytime.
December is a quite magical month of the year. Not only because everything gets slower, giving you time to reflect and plan ahead, but also because it pulls you away from the routine of the working day. The new year always stands for new beginnings, so once you’ve returned from your break, your perspective on your tools, techniques and workflow may look quite different. After all, who doesn’t have a little side project to explore something new during the calm holiday season?
Luckily, the community is right here to distract you with all kinds of fancy techniques, strategies and tools. Just like every year, 24ways, the advent calendar for web geeks, has opened its doors this year as well, with 24 upcoming articles highlighting the new challenges and possibilities on the web. So does 12 devs of Xmas and Web Advent Today as well. UXMas is an advent calendar for UX geeks, while Performance Calendar provides the speed geek’s favorite time of the year.
Not enough? Well, then snuggle up and get cozy in these cold, breezy days with a couple of handy smashing books, like the Sketch Handbook or Inclusive Design book, and maybe even get prepared for next year’s SmashingConf San Francisco (early-bird prices available only until late December)!
Have fantastic holidays, and don’t work too hard! – Vitaly (@smashingmag)
Table of Contents
- A Little Help From Santa
- The Design Kids Are Here!
- A Visual Guide To CSS Properties
- 10×16 = Eye And Ear Candy
- One Day, One Experiment
- Responsive Layouts With Style Scoping
- Upcoming Smashing Workshops
- New On Smashing Job Board
- Smashing Highlights (From Our Archives)
- Recent Articles On Smashing Magazine
(#)1. A Little Help From Santa
Christmas is coming closer, and, well, who doesn’t want to gift their loved ones the perfect gift? If you’re still not sure what to put under the tree this year, the folks at Brooklyn-based digital agency Huge might have just the right suggestion for you. They recently shared the gifts they’re giving and the ones they’d like to get in return, and assembled a holiday gift guide out of it that has something for nearly everyone — coffee connoiseurs, typophiles, wannabe barkeepers, hobby chefs, outdoor lovers, the kids, and the kids at heart.
If you’re on the hunt for something extra-geeky to surprise your favorite developer buddy or perhaps your teen nephew, also be sure to browse by Think Geek. Just because things can’t get any geekier than a Back To The Future Flux Capacitor Wristwatch or lightsaber chopsticks, can they? (cm)
(#)2. The Design Kids Are Here!
If you’ve just graduated from design school and are about to gain a foothold in the design industry, it’s good to have a network of like-minded people to make the transition into professional life a bit smoother. The Design Kids, a global community of students and new-fledged designers, attempts to provide just that network.
The concept behind it is simple, yet powerful. It aims to bring students, grads and pros together in local meet-ups, design events and competitions to bridge the gap between the graphic design industry and college. To get young designers a step closer to landing their dream job, the platform also hosts job and internship listings and provides professional advice. A selection of cities in the US, Canada, Australia and New Zealand are already covered on The Design Kids; Europe and South America will follow hopefully soon. (cm)
(#)3. A Visual Guide To CSS Properties
When front-end designer Jeremy Thomas was looking for a simple CSS reference guide but couldn’t find any, he decided to make one himself. And, well, the result of his endeavor is nothing short of impressive: CSS Reference.
CSS Reference lists the most popular CSS properties (nearly 130 in total) and visualizes their effect with illustrated (sometimes even animated) examples. A cool additional feature: You can click on a property, and it will be copied to your clipboard so you can paste it into your code and use it right away. Perfect to refresh your CSS know-how. (cm)
(#)4. 10×16 = Eye And Ear Candy
The end of the year is traditionally the time for countdowns and best-of lists. A music countdown of the special sort that is not only bound to make music but also make design lovers’ hearts skip a beat is 10×16. Its mission: 19 visual artists count down their ten favorite albums of 2016 — by reimagining their cover art. Eye and ear candy guaranteed!
Among the featured designers are names like Jessica Hische, Adam R. Garcia, Damien Correll, and Erik Marinovich. While their styles are as diverse as the music on the albums themselves, one shared color palette keeps all artwork visually together without making it boring. By the way, if you want to tune in to one of the newly discovered albums, there’s a sample song embedded for each one. Happy browsing! (cm)
(#)5. One Day, One Experiment
When we were little, Christmas was a time of magic and wonders. As we grew older, that feeling of sweet anticipation which we felt back then as the big day approached has faded or even vanished completely. A lovely project that could bring back some of that wonder to our December days are the Christmas Experiments that David Ronai started back in 2012 and that have now returned for a 2016 edition.
Each day up to Christmas, the project reveals another jaw-dropping digital experiment — be it a mini game or some other interactive experiment — to highlight the skills of top web creatives just like of promising newcomers. And, well, surprises are guaranteed indeed. One day you might smash a piñata, the next you’ll need to save Christmas and help Santa get back on track after a night of partying. But, psst, we won’t reveal more just yet. Go and see for yourself. (cm)
(#)6. Responsive Layouts With Style Scoping
Style scoping. Tommy Hodgins has been experimenting with the CSS concept for the past couple of years even though all development for supporting style scoping has been stopped. Why? Well, paired with any kind of responsive query, style scoping provides a powerful new way to build responsive layouts, as Tommy describes in a recent blog post.
(#)8. Upcoming Smashing Workshops
With so many techniques, tools, style guides, design patterns, strategies, abstractions, frameworks and boilerplates available nowadays, what do you really need to know to keep your workflow fast, smart and efficient? That’s exactly what our classes are all about: practical front-end and RWD workshops that will help you become better front-end developers and designers, today.
Workshops at SmashingConf San Francisco 2017
- Scalable Design Systems with Nathan Curtis (April 3rd)
- Building Performant Websites with Tim Kadlec (April 3rd)
- Smart Responsive UX Design Patterns with Vitaly Friedman (April 3rd)
- Hands-On Checkout Optimization Workshop with Christian Holst (April 6th)
- Advanced SVG Animation with Sarah Drasner (April 6th)
- Advanced CSS Layouts With Flexbox And CSS Grids with Rachel Andrew (April 6th)
- Creative Data Visualization Techniques with Nadieh Bremer (April 6th)
- New Front-End Adventures In Responsive Design with Vitaly Friedman (April 6th)
Our Public Workshops
- Zurich, Switzerland — Smart Responsive Design Patterns Swiss Mobile Devs, Feb. 24th, 2017
Or, if you’d like to run an in-house workshop at your office, feel free to get in touch with Vitaly at firstname.lastname@example.org and briefly describe what problems you’re facing and would like to solve. Don’t worry about the costs — we’ll find a fair price for sure. Get in touch — it’s that easy!
(#)9. New On Smashing Job Board
Here are the recent job openings published on our Smashing Job Board:
- Senior Cloud Engineer at The American Institutes for Research (Washington) “We are currently seeking a Senior Cloud Engineer to join our team in the Washington, DC office.”
- Senior Ruby on Rails Developer at Ben Kinney Companies Tech Division (Bellingham, Washington) “We’re looking for someone with a passion for programming and for writing beautiful code who’ll join a team of exceptional developers.”
- UX Designer at PVH Europe BV (Tommy Hilfiger & Calvin Klein) (Amsterdam, The Netherlands) “We are looking for a talented User Interface Designer to create amazing user experiences.”
(#)10. Smashing Highlights (From Our Archives)
- Why Performance Matters, Part 3: Tolerance Management When technical performance optimizations reach certain limits, psychology and perception management might help us to push the limits further. Waiting can consist of active and passive phases; for the user to perceive a wait as a shorter one, we increase the active phase and reduce the passive phase of the wait. But what do we do when the event is a purely passive wait, with no active phase at all? Can we push the limits even further?
- Design Principles: Visual Weight And Direction Every element on a web page exerts a visual force that attracts the eye of the viewer. The greater the force, the more the eye is attracted. These forces also appear to act on other elements, imparting a visual direction to their potential movement and suggesting where you should look next.
- “Be Careful: Trends Come And Go” As one of the top designers on Dribbble, Jan Martin attracts many followers with his visual design skills. Unlike many designers, Jan is incredibly humble about what he has achieved. “Stop following what the visionary designers think,” he says. “There is no wrong or right way. We need to create our own things and always design with our heart.”
(#)11. Recent Articles On Smashing Magazine
- How Creating A Design Language Can Streamline Your UX Design Process
- Best Practices For Animated Progress Indicators
- The Atomic Workflow — People, Process, And Making Design Systems Happen
- Enhancing Grid Design With GuideGuide, A Plugin For Photoshop And Illustrator
- GPU Animation: Doing It Right
- Progressive Web AMPs
- How To Build A SpriteKit Game In Swift 3 (Part 1)
- How To Build A SpriteKit Game In Swift 3 (Part 2)
- How To Build A SpriteKit Game In Swift 3 (Part 3)
Inspiration, Freebies, Misc.
- Christmas Goodies: Free Winter- And Holiday-Inspired Icon Sets (EPS, AI, PNG)
- Freebie: Christmas Advent Icon Set (25 Icons, AI, EPS, SVG, PNG, PDF)
- Christmas Wallpaper Calendars: December 2016
- Breaking Out Of The Box: Design Inspiration (December 2016)
- Brush Lettering: It Only Gets Better After Practice (Part 2)
- Web Development Reading List #162: Server Side React, Inclusive Design And The Web Worldwide
- Web Development Reading List #161: Restyling Form Elements, HTTP/2 HPACK, And The Empathy Vacuum
- Getting The Sketch Workflow Right: Meet “The Sketch Handbook”
- Microcopy and UX Writing
- Front-End Cheatsheets
- Front-End Accessibility
- Open-Source Icons, Fonts and Goodies
- Next.js Boilerplates and Guides
- CSS Global Resets, Gradients and Transitions
- Interface Design Patterns
Looking for older issues? Drop us an email and we’ll happily share them with you. Would be quite a hassle searching and clicking through them here anyway.