Tuesday, December 30, 2014

Smashing Newsletter #128: Offline and Material Design

With a few Chrome extensions and inspirational blogs. Issue #128 Tuesday, December 30th 2014 180,774 readers View in the browser

The Smashing Email Newsletter

Dear Friends,

The web keeps getting heavier and heavier, but we know that already. However, what exactly does this mean for the users visiting our websites? I've been traveling a lot this year, and unless I have good Wi-Fi, I tend to tether my phone and use it as a hotspot. My consumption of data is modest; I don't do audio or video streaming via 4G, I don't sync Dropbox or GitHub, nor do I upload or download large files, and I always remember to disable all background traffic. I take good care of my hotspot, and I am considerate when it comes to using or not using it. I do use email a lot though, and I do find myself reading a lot on the web — both when writing, editing and doing research.


Throughout 2014, December was the second month in a row when my monthly limit of 5GB of data was reached early on — primarily due to Retina images and image overhead sent to my device (which happens to have a Retina screen). Now, 5 GB is quite a lot of data, and seeing so much data being wasted so quickly is astonishing, to say the least. That's why responsive images are so important, but they cover only one side of the story.

I wish I had a "bandwidth" mode in most modern browsers that would enable me to disable loading of Retina images by default. Perhaps even 'mobile-friendly' Google search results could show page weight. Proxy browsers such as Opera Mini are a good option, but usually I do want to see shiny, fancy SVGs and JavaScript interactions available as well. What about a mode to disable bitmap images in general and allowing for vector images only?

What else can you do? Well, you could try using Chrome and its Data Compression Proxy, when travelling. In case you use your phone as a hotspot a lot, you can have that feature added to your desktop Chrome as well. And it's a good idea to also enable Chrome's Offline Cache Mode in case there's no connection at all. It helps, but perhaps if we get more considerate with how we send our images to end devices, we can make it easier for our users to get back to our sites and use them without getting annoying bandwidth warnings at the end of the month.

Happy optimizing!
Vitaly (@smashingmag)

Good Stories Of Design, Content And Technology

You're most probably too familiar with that moment when you lean back on your couch and log onto the Internet, but with no particular purpose in mind... All you want is to get some nice distraction, maybe read an interesting article that will inspire you to try something new. So you're now convinced that you'll be sure to find something good (isn't the web packed with cool stuff, after all?), but then you end up finding out Cameron Diaz got engaged. Well, this kind of content doesn't exactly inspire any of us, right?

Good Stories Of Design, Content And Technology

Well, it's about time you added Intersect to your list of bookmarks. After only two minutes of browsing, you can find yourself on a virtual tour across Russia, and maybe even learn that "steel" is the story America is rooting for, and finally, you could even paint the town red on Jacobin Mag! In fact, you can end up with dozens of open tabs and find yourself struggling to decide which place to explore first. A perfect place to take off to very well designed websites and fascinating publications. Dig in! (ea)

The Stories Behind The Products

Whether it's a head-up display compatible with any car, a foldable kayak or a smart bicycle wheel; makers out there come up with the most ingenious ideas to make our lives simpler, more fun, or, well, just more beautiful. However, just as interesting as the products themselves are the people and the stories behind them. How did an idea evolve and how did it finally get to see the light of day? That's exactly what the blog "Maker Stories is all about.

The Stories Behind The Products

Maker Stories collects the stories behind extraordinary products and introduces us to the people who made them come to life. It's about clever inventions and solid craft. A very insightful blog, that is just the starting shot for an entire storytelling platform for professional makers to showcase their creations, tell their stories, and connect with consumers. Make sure to keep an eye on this one. (cm)

Create Material Color Palettes… With Just Two Clicks!

If you're designing for Android, there is no getting around Material Design (Google's new visual design language) these days. A valuable resource which simplifies the workflow of any developer and UI designer working with these new requirements now comes from Matt Aussaguel: Material Palette. It makes creating and exporting those bold material color palettes a breeze.

Create Material Color Palettes… With Just Two Clicks!

To get started, you simply choose 2 colors, a main color and an accent color, from a given selection and the tool creates a color palette for you, consisting of dark and light versions of your main color, and colors for primary and secondary text, as well as for icons and dividers. The site does not only display your palette in an example design, but also lets you download it in CSS, SASS, SVG, XML and PNG formats for easy implemenation into your project. Handy! (cm)

Happy Holidays!

What's your most favorite, memorable experience in 2014? Probably not a front-end technique you've discovered, not a responsive site you've built, not a performance trick you've learned. It's the special moments you shared with people you care about most, isn't it? So why don't you come up with a thoughtful, exceptional surprise for your loved ones today?

Think of something very special to let them know how much they mean to you. Draw a painting for them, compose a song, write a poem, build a fireplace, prepare a trip to watch the Northern lights together, get tickets to their favorite bands, arrange a live orchestra performance for their birthday, or just bring them to the finest chocolate museums in the world. Take time to thoroughly craft those meaningful, memorable moments for 2015 with and for them, perhaps away from technology and your work.

Your craft is important and makes you who you are, but it's not what matters most at the end of the day. Share experiences and authentic conversations, delight the eye, the mind and the soul, celebrate what you have and what really matters to you. Everything else can wait. And so can our workshops.

Happy holidays, dear friends, and many delightful, happy moments for you and your family in 2015. Craft experiences that you and people around you will remember even years after they have passed. (vf)

New on Smashing Job Board

Here are the recent job openings published on our Smashing Job Board:

  • Senior Front-end Developer at 6 Minutes Media GmbH (Berlin, DE)
    We're looking for a senior front-end web developer who is a keen problem solver, with a sharp eye and attention to detail to make sure that everything comes together perfectly.

  • UX Designer at Fusionapps (Secaucus, NJ)
    We're looking for a UX designer who can translate user needs and business requirements into screen designs that ultimately evolve into prototypes and a finished software product.

  • Unity 3D Client Developer at Goodgame Studios (Hamburg, DE)
    We're looking for a developer who will work on new online games in an interdisciplinary product team, and develop the client with which thousands of players interact on a daily basis.

Smashing Highlights (From Our Archive)

  • Design Something Every Day!
    As designers, we're all trying to get better at what we do. We surf the Web daily for hours trying to find useful tips and tricks to enhance our design skills. But what if we spent less time surfing the Web looking for inspiration and more time creating and designing things?

  • UX Sketching And Wireframing Templates For Mobile Projects
    This article presents Outline, a set of sketching and wireframing papers for mobile platforms and Tapsize, a set of templates for checking optimal tap areas without a mobile device.

  • Absolute Horizontal And Vertical Centering In CSS
    We've all seen margin: 0 auto; for horizontal centering, but margin: auto; has refused to work for vertical centering… until now! But actually (spoiler alert!) absolute centering only requires a declared height and particular styles.

Recent Articles On Smashing Magazine

Sent to truly smashing readers via Mailchimp.
We sincerely appreciate your kind support. You rock.

Email: newsletter@smashingmagazine.com
Follow us on Twitter Join us on Facebook

The authors are: Iris Lješnjanin (il), Vitaly Friedman (vf), Cosima Mielke (cm), Esther Arends (ea), Christiane Rosenberger (research), Elja Friedman (tools).

unsubscribe update preferences view in your browser

No comments:

Post a Comment