Smashing Newsletter #100: Here’s To Another Hundred Issues!

This newsletter issue was sent out to 171,629 newsletter subscribers on Tuesday, January 7th 2013. If you are not subscribed yet, feel free to subscribe to our email newsletter anytime.

Editorial

100 newsletter issues, twice every month, published and sent out tirelessly over the last two years. What started as a humble little project back in 2010 is now a part of our editorial, a part that we wouldn’t want to miss. Finding and featuring all these little side projects, techniques, resources and crazy ideas is so rewarding and so much fun, so of course we’re just getting started! Do you have a project to share? Tweet us any time: we do read every single tweet that we receive, you know.

We also like conferences, but you know that already, too. So are you ready for something… special? Alrighty! We are coming to New York, baby! SmashingConf New York will take place on June 17th–18th 2014. As usual, we will have one track, 2 full days, 18 brilliant speakers and 350 truly smashing attendees. Of course, with fair and affordable ticket prices.

The tickets will go on sale at 2pm CET on January 28th, 2014. Since we have only 350 seats available, make sure to set your alarm clock! We also have a Smashing Book Mystery (ready for Round 2, folks?) coming up on the front page at exactly the same time. And the prize for the winner will be a two-way-flight to NY, hotel and a conference ticket. Sounds smashing enough for you? Well, pull out that alarm clock, will you?

This is going to be quite a year. We’ve got many surprises coming your way in the next few months, but we never said it wasn’t going to be fun. Keep that cup of coffee or tea ready every second Tuesday and stay tuned with the Smashing Newsletter, folks! ;-)

— Vitaly (@smashingmag)

Table of Contents

01. Freebie: Infinity Icon Set, A Journey Into Space

02. Designing In The Open

03. There Is No Average Joe

04. Shape Hover Effect With SVG

05. Mobile Devices + Twitter + World

06. Screencasts For Web Developers

07. Tickets Deserve A Redesign, Too

08. Conferences All Over The World

09. Let’s Talk About In-house Workshops!

1. Freebie: Infinity Icon Set, A Journey Into Space

Space. The Universe. Infinity. Do you tend to get fascinated by these terms and the stories based on them? Well, perhaps we can bring a little bit of the outer space into your earthly projects. Infinity Icon Set features spaceships, satellites, asteroids and solar system planets. This free set was designed by Adam Katyi for To Infinity And Beyond, a space art exhibition of 40 Hungarian graphic designers and painters currently on display in the Budapest Planetarium.

This pictogram-dingbat font allows you to create your own space story, i.e. the lowercase and capital latin letters are the main space icons. You can find the whole solar system once you start typing in numbers. Please note that this freebie is meant for non-commercial use and can be downloaded only if you pay with a tweet or Facebook post. The icon set will soon be updated with new characters, so make sure you stay tuned! (ea)

2. Designing In The Open

It’s sad but it’s just the way it is: in corporate settings, it’s quite common to sign NDA agreements before starting a new project. So in the end, you can’t share what you’ve learned, and often you can’t really reuse the techniques and tools you’ve developed. But have you actually tried to convince the client to design “in the open” instead?

There are quite a few projects that involve the open source community into the projects, presenting the source code on GitHub or just explaining the process and releasing the development files for everybody to download. Gov.uk Frontend provides the full source code of the Gov.uk website on GitHub; The Guardian’s responsive website on GitHub is available as well; and both BBC and National Geographic provide many tools, too. In fact, Brad Frost makes a compelling argument for designing in the open and provides some ideas on the benefits of the approach and how to convince customers to follow this idea. Why not try it out? (vf)

3. There Is No Average Joe

Who do you design for? Do you rely on archetypes to build the best user experience possible, or do you build around an average user, let’s say a 34-year-old woman with 2.3 children? The question leaves a lot of room for discussion. A thought-provoking read on this controversial subject is Susana Gonzalez Ruiz’s article “Designing for the extremes (or why your average user doesn’t exist)“.

Designing for an average user, so the idea of the article, creates dysfunctions because the “average” is nothing but a formula, a result of statistics that has little to do with real people. A possible solution to increase the experience for every user would be to design for the extremes first so the rest will take care of itself. Very interesting thoughts that have already fueled some discussions on Twitter. (cm)

4. Shape Hover Effect With SVG

Do you remember those dark times when we used JavaScript to mimic hover effects onMouseOver? By using CSS, we finally found a way to easily adjust any CSS property on :hover, but we still couldn’t properly play around with shapes. However, if you combine CSS, SVG and a bit of JavaScript, you can create any kind of hover effect using any shape defined in SVG.

In their article on Shape Hover Effect With SVG, Mary Lou shows how to use the Snap.svg library for just that. The idea is to create a SVG with one path that represents the shape background for some caption and to morph that path into another one on hover. It doesn’t sound very difficult, and it really isn’t. The only issue is that you still need to use JavaScript for the hover effect—which is suboptimal. But perhaps that’s something for you to play with for your next project? (vf)

5. Mobile Devices + Twitter + World

Here’s one for you: collect data from more than 280 million tweets posted from mobile phones, analyze this data, study the geographic location, visualize it on a map and explore geographic usage patterns in unprecedented detail. That’s exactly what Mapbox Twitter Gnip has done.

The visualization displays which mobile phones were used at a specific location, with Android, iPhone and Blackberry users mapped onto the map with corresponding dots. Apparently, iPhone is used a lot in urban areas and city centers while Android is more popular in rural areas. (vf)

6. Screencasts For Web Developers

You can learn a lot from an article or a detailed tutorial, but if you really want to understand a certain technology or tool, it’s great to sit next to someone who has a wide understanding and is able to answer all of your questions. Even better: you can sneak a peek behind their workflows, too!

Well, perhaps you shouldn’t be annoying to your colleague all of the time, so why not get a cup of coffee, biscuits and check a video screencast instead? Chris Coyier’s screencasts often feature interesting workflows and tools, e.g. Build Podcast is all about tools, libraries and techniques. Breakpoint Show is dedicated to developer tools and time-saving techniques. Any other suggestions? Let us know on Twitter! (vf)

7. Tickets Deserve A Redesign, Too

Matthew Lew loves concerts and is among one of the millions of people who buy tickets from Ticketmaster. Being a graphic designer, Matthew couldn’t help but ponder about the design of the tickets. What he noticed was quite alarming. Apparently, in 2013, Ticketmaster tickets looked pretty much the same like they did in 1979. According to Matthew, they looked like code spat out by a faceless robot.

However, robots aren’t the ones who buy and read these tickets. So where on earth (or on the ticket, to be more precise) is the human element? Matthew decided to present a comprehensive redesign of the tickets which you may actually want to consider for real. If you’re all warmed up now and are looking for other problems to solve, try redesigning a currency or even airplane tickets! (ea)

8. Conferences All Over The World

Hurry, the new year has already begun! Just like every year, there are a huge number of Web design events and conferences that will be held… so, how do you plan on keeping track of all of them?

Alex Cowles was having trouble keeping track just like most of us, and has gone ahead and created a simple calendar that seemed to be the best solution: Conference Calendar. This way it’s a little easier to see what’s on and when. We should certainly meet at one of them, don’t you think?! (kv)

9. Let’s Talk About In-house Workshops!

We love fixing existing problems. Is your company struggling with legacy systems or a suboptimal front-end workflow? Well, perhaps we can help. We’d be more than happy to organize in-house workshops in your company, tailored specifically to your needs.

Sketchnotes from a Smashing Workshop (sketched by Elisabeth Irgens).

We’re flexible about the topics and format of the workshops, but what we really want is to help you solve your actual problems. What about responsive design, advanced front-end techniques, performance optimization, UX, conversion rate optimization, sketching and wireframing, or even debugging?

If you’d like to have an in-house workshop, just get in touch with Vitaly and shortly describe what problems you’d like to solve. Don’t worry about the pricing either, we’ll find a fair pricing for sure. Yes, it’s that easy! (vf)

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

© Smashing Newsletter Team for Smashing Magazine, 2014.