Menu Search
Jump to the content X X
Smashing Conf San Francisco

We use ad-blockers as well, you know. We gotta keep those servers running though. Did you know that we publish useful books and run friendly conferences — crafted for pros like yourself? E.g. upcoming SmashingConf San Francisco, dedicated to smart front-end techniques and design patterns.

Smashing Newsletter: Issue #89

This newsletter issue was sent out to 158,151 newsletter subscribers on Thursday, July 25th 2013. If you are not subscribed yet, feel free to subscribe to our email newsletter1 anytime.


While we love sharing nifty tools, services and techniques we stumble upon, we often tend to focus on them instead of looking a bit more closely at how we work ourselves, what our own workflow looks like and what tools we use to save our poor souls and minds unnecessary headaches and stress. We can all learn from each other’s failures rather than successes. Remy Sharp has kindly been publishing short screencasts about his workflow2 in which he explains his full coding stack and how he works in DevTools. Andrey Tarantsov has also published an article about his Sublime Text Workflow3, and Paul Irish as well as Addy Osmani have written about their tools and workflows quite4 often5 recently6.


Not many folks like to talk about their mistakes, disappointments and things that just didn’t work out, but quite often they’re just as useful as all those amazing success stories you can read about in hundreds of books and articles. We can significantly benefit from sharing how we work, build and play, so why don’t you post a blog post or a short screencast about your own workflow as well? What tools worked for you and which didn’t, and why? Please share your stories and your thoughts using the hashtag #smworkflow!

P.S. If you’re a huge fan of learning and sharing valuable experiences just like we are, then why not engage students and educators8 or even a company or your coworkers9 to read our lovely eBooks and encourage better productivity and quality of work in various fields including design, Web development, copywriting, and more! Just sayin’! ;-)

— Vitaly (@smashingmag)

Table of Contents

  1. No More Color Worries In Your Digital Workflow10
  2. Quirky Nots: A Free Display Font11
  3. Date For Humans, The JavaScript Way12
  4. Let’s Pair Program! But Let Me Stay On Native Ground13
  5. 40 Days Of Dating14
  6. Make Some Mock-Ups15
  7. Eye Candy For Lettering Lovers16
  8. Retro Furnish: Free Icons17
  9. Connecting Time And People18
  10. Unfold To Zoom In: The Zoomable Map On Paper19

1. No More Color Worries In Your Digital Workflow

Color management in the digital workflow is not a piece of cake. Lots of different roles are involved and each role and task has their typical issues. The photographer is worried about whether the display on the monitor used to check the image can be trusted. The retoucher needs to take care that he edits the image the way the photographer intended. The designer might notice that the color displayed on the monitor doesn’t match the printed one.

No More Color Worries In Your Digital Workflow

If you are in some way involved in managing colors, these issues are probably very familiar to you. Guess what, there’s help available and you don’t even have to pay for it! Check out the Color Management Handbook, a free guide which introduces a color management system and shows you the benefits and key points of each and every step of it. The handbook is only 14 pages long and very compact. You can also download it from iTunes20. (ea)

2. Quirky Nots: A Free Display Font

Amit Jakhu from Canada made this beautiful display font21 for his Typography class and decided to share it with us and release it for free. It’s perfect for a friendly and playful invitation, e.g. for your next summer barbecue or your child’s birthday party.

Quirky Nots: A Free Display Font22

You can use it everywhere, share it, and even modify it. There are no restrictions. However, the creator is curious what you will do with it, so why not share a screenshot of your work, get in touch23 with him and make him happy? (ml)

3. Date For Humans, The JavaScript Way

Filling in Web forms is probably one of those few things that are so time consuming and sometimes so annoying on websites. It’s getting even worse on mobile, especially with those tiny button controls that have to be zoomed in and out all of the time. Don’t you just prefer to get stuff done via phone hotline or at a counter in these situations? Point in case: calendars.

Date For Humans, The JavaScript Way24

Wouldn’t it be nice to just type the date and time you prefer (e.g. “sunday night”, “next week tuesday” or “15 minutes from now”) instead of selecting the hour, day, month and year every single time you use a service? Matthew Mueller’s Date for Humans25 is a JavaScript library that takes care of that. Your users can “write” a date like a normal human being would, and the date will be determined on the fly. And if JavaScript doesn’t work, there is still a “classic” fallback with the calendar that we all know and use. A nice enhancement for an otherwise tedious and annoying task. (vf)

4. Let’s Pair Program! But Let Me Stay On Native Ground

Once upon a time, in a vibrant tech firm not too far away from the San Francisco Bay Bridge, two coders met. Their names were Geoff and Matt. Geoff liked to mess with motorcycles and Matt liked to climb stuff. Besides that, they both liked to code and so ended up pair programming. After they had coded together for almost a year, they were not quite happy. It bugged them that they couldn’t find a real-time collaboration tool which allowed them to work in their favorite native editors. So, what did they do?

Let's Pair Program! But Let Me Stay On Native Ground26

They simply decided to build such a tool. And so they created Floobits27, a platform that lets you use native text editors to collaborate on code in real time. Floobits currently supports Sublime Text, Vim and Emacs. It has a collaborative terminal so you can share shells. There’s a diff shipper that keeps a directory on your computer in sync with a Floobits workspace. And you can use Google+ Hangouts to voice-chat and screen-share while editing. Floobits still has a few bugs, but Geoff and Matt are diligently working on them. Just go ahead and test it — for free! (ea)

5. 40 Days Of Dating

Jessica Walsh and Timothy Goodman are two young designers based in New York City with opposite relationship problems. They’re tired of wading through the dating scene and have decided to conduct an experiment together. They will date each other for 40 days, since that’s how long it takes to break any habit.

40 Days Of Dating28

They both have six rules to follow: 1) They will see each other every day for 40 days. 2) They’ll go on at least three dates a week. 3) They’ll attend weekly couples therapy. 4) They will go on at least one weekend trip together. 5) They will fill out a daily questionnaire, and 6) They won’t be seeing anyone else during these 40 days. And guess what? They’re already almost halfway through29(sh)

6. Make Some Mock-Ups

Brand identity is an essential part of graphic design; your brand will get you noticed and tell everyone what you’re about. All businesses, no matter how large or small, need a brand and we’ve found a few tools that’ll make life a little easier for you to include this skill to your repertoire. Whether it’s for a client or for your portfolio, these tools will give your work a professional edge with a polished finish.

Make Some Mock-Ups30

Blue Graphic31 provides a whole host of vectors in PSD file format and all you need to do is to pay with a tweet. Take a look at the Producer’s Mixtape of advertising agency, CP+B, too. They’ve provided InDesign files for production checklist and a custom 3D printable case. Graphic Burger32 provides a basic PSD template where you can change the colors and add your own design elements. And last but not least, Phan Giang Hong Phuc33, a freelance graphic designer, provides free downloads for an assortment stationery. (sh)

7. Eye Candy For Lettering Lovers

Nice typography makes my heart leap for joy — whether it’s on the Web, or on a simple milk package. But the personal touch of hand lettering made with pencil on a piece of paper or with chalk on the smooth black surface of a restaurant’s chalkboard menu is something special. If you do feel the same, here is a site to satisfy your handlettering needs (well, at least for a while): The Art Of Hand Lettering34.

Eye Candy For Lettering Lovers35

This Tumblr blog is a collection of beautiful hand-lettered art, unique, twirly and wonderfully inspirational. From pencil sketches to final prints and wall art, this resource is filled to the top with eye candy waiting to be explored. New inspiration guaranteed! (cm)

8. Retro Furnish: Free Icons

Great things happen when creative minds think alike and get together. Two designer siblings, Clotilde and Adrien Heury, have created a collection of retro furniture icons36 including lamps, tables and even chairs that make you almost consider refurnishing your very own home.

Retro Furnish: Free Icons37

These 25 fantastic icons are available under a Creative Commons Attribution 3.0 license, so you can use the set for your own purposes (including commercial use) as long as credit is provided! If you like these icons, please support Clotilde38 and Adrien39 by spreading the word with a kind tweet or facebook post. (kv)

9. Connecting Time And People

With over 7 billion people living on this planet, there’s quite a lot happening around the world. Timg40 wants to help and give you a glimpse by letting you search for pictures by location, date and time. There’s also a little map in the top left corner where you can simply move your mouse and zoom into any place you like.

Connecting Time And People41

You can find pictures of particular events that people have experienced and were willing to share with the world, e.g. the mass protests in Moscow42 following the conviction of Alexei Navalny. What Timg basically does is search for pictures that people from all over the world have posted on Flickr. If you don’t have a Flickr account yet, then what are you waiting for? (kv)

10. Unfold To Zoom In: The Zoomable Map On Paper

Summer is knocking on our doors, bags are packed and we’re all ready to explore new places. But honestly, do you still carry paper maps to prevent you from getting lost in some obscure backstreet? With digital maps always at our fingertips, most of us have long said goodbye to these giant monstrosities on which we never really found what we were looking for anyway. Pinching and zooming just feels a lot more natural than juggling with 10 square feet of wrinkled paper that resembles advanced origami. But now, paper deserves a second chance!

Unfold To Zoom In: The Zoomable Map On Paper43

With map244, Anne Stauche has reinvented the traditional map and created something that you can confidently call the “smartest paper map ever”. With its ingenious design, map245 is incredibly intuitive to use. When folded together, it fits the palm of your hand. Unfolding it once provides you with a quick glance at the public transport system, and twice for an overview of the entire city. And to zoom into your desired area, all you have to do is open up one edge of the map. Simple, and brilliant. At the moment, map2 is available for Berlin and London. (cm)

The contributors to this issue are: Iris Lješnjanin (il), Vitaly Friedman (vf), Esther Arends (ea), Shavaughn Haack (sh), Cosima Mielke (cm) and Kristina Vogt (kv).


  1. 1
  2. 2
  3. 3
  4. 4
  5. 5
  6. 6
  7. 7
  8. 8
  9. 9
  10. 10 #a1
  11. 11 #a2
  12. 12 #a3
  13. 13 #a4
  14. 14 #a5
  15. 15 #a6
  16. 16 #a7
  17. 17 #a8
  18. 18 #a9
  19. 19 #a10
  20. 20
  21. 21
  22. 22
  23. 23
  24. 24
  25. 25
  26. 26
  27. 27
  28. 28
  29. 29
  30. 30
  31. 31
  32. 32
  33. 33
  34. 34
  35. 35
  36. 36
  37. 37
  38. 38
  39. 39
  40. 40
  41. 41
  42. 42
  43. 43
  44. 44
  45. 45

↑ Back to top Tweet itShare on Facebook

The Smashing Editorial prepares bi-weekly newsletter issues with lots of love and appreciation for the good ol' web with the latest tips and tricks for designers and web developers. Vitaly Friedman, Smashing Magazine's editor-in-chief, started this project back in early 2010. Today, we can't imagine a better way of informing and communicating with our fans and readers!

  1. 1

    Little mistake in the text here: “Clotilde and Henry Heury”, in fact it’s “Clotilde and Adrien”.
    We named us “HEURY & HEURY”, because we are brother (Adrien) and sister (Clotilde), both designers and we work together!

    • 2

      Iris Lješnjanin

      July 26, 2013 11:20 am

      Hi Adrien,

      Apologies for the typo — it’s fixed now! :-)

      Keep up the fantastic work! Cheers!!


Leave a Comment

You may use simple HTML to add links or lists to your comment. Also, use <pre><code class="language-*">...</code></pre> to mark up code snippets. We support -js, -markup and -css for comments.

↑ Back to top