Stickers, Eclipses and Lighthouses [#35]

Today is a day for another round-up of interesting pieces from across the web. Nothing too special, but hopefully a little intriguing.

First up is Google Lighthouse, one of the many branches of the Alphabet behemoth and a pretty interesting little project. I haven’t actually managed to get it up and running, but I’ll definitely be trying it out on theAdhocracy some time soon (and probably weeping at the result). I don’t need to test it, though, to see it will be a very useful tool in battling the increasingly problematic issue of internet lag.

Second is the article which led me to Lighthouse in the first place: AMPersan, by Ethan Marcotte. Not much to add to this one, just another voice adding weight to my uneasiness with the idea of AMP and similar projects. Well worth a read if you’re interested in the open web.

In third place is a collection of ‘achievement’ stickers doing the rounds of the blogosphere right now. Originally designed by Jeremy Nguyen, published on The New Yorker and personally discovered via TheLogoSmith, the stickers are a humorous look at the pitfalls of being self employed. They’re specifically designed for freelance designers, but I feel a lot of them are applicable across disciplines. If you work from home, you’ll probably find yourself smiling and nodding.

Fourth on the list is a simple article from Martian Craft outlining “The Importance of Routine“. The post is aimed at remote works and is far from news to me, but it is a well written example of how to apply this kind of thinking. I’m saving it here more to try and force myself into setting something like this up for my own free time.

Finally, I was blown away by the “Lifetime Eclipse Predictor” visualisation created for The Washington Post (discovered via Source). In the wake of the recent total eclipse in the US, along with reading various posts on the rarity of such events, I’ve been left with a real urge to try and make sure at my path eventually coincides with a path of totality. It is a ridiculously awesome coincidence that our moon’s diameter and planet’s solar distance align so accurately. I mean, even if there are other life-hosting planets out there, we’re certainly one of an incredibly small number that can witness this phenomenon. That makes it practically a responsibility to see a total eclipse, at least once.

Marrs Green [#28]

I love the idea of G.F. Smith’s “World’s Favourite Colour”: ask people to submit examples of their favourite colour and then vote. The results are interesting for a variety of reasons, but for me the big one is just how much I love “Marrs Green”, the winning colour. I’ve always veered between saying my favourite colour was a shade of blue or green, with turquoise winning for many years in my youth but slowly losing ground. This particular shade, though, is stunning. Truly stunning.

Even my first exposure to the colour on Fstoppers stopped me whilst scrolling down the page. It’s rich, offers great contrast and is just incredibly visually appealing. I’d be fascinated to know whether my reaction is just coincidence or if there is something optically stimulating about Marrs Green that is somehow innately attractive. Whatever it is, I definitely have a new favourite colour; if I lived in London I would certainly be heading down to their pop-up shop to see it in person! Plus, the whole aesthetic and branding exercise is top-notch. Beautiful.

Empathy Just Makes Sense [#11]

Their immediate need was a revamped website, but once they understood that this need paled in comparison to all of the other places they could have an impact on their customers’ lives, they began talking excitedly about how to make this vision a reality down the road.

Let Emotion Be Your Guide is a wonderful article from Hana Schank and Jana Sedivy (published on A List Apart) which has taken me far too long to actually sit down and read. It’s worth your time pretty much regardless of your own career path, but personally it reminded me of some of the little reasons I enjoy the path I’ve chosen.

Whilst websites are a core point of contact for many businesses and deserve a rigorous, reasoned implementation the reality is that they are likely only one of many such points of contact for your customer, and each is just as important as the next.

What’s more, the best practices and strategies employed in developing a good digital foothold aren’t just applicable to the web. Increasingly, the way we think about UXD online is no different to the way we should think about every aspect of our lives. Putting empathy front and centre of your decision making is not just good practice: it’s the only method that makes sense in the long term. New features, applications, websites, brochures or whatever else are only useful if they solve a real problem, and you won’t know what the real problems are unless you talk to, and empathise with, other people.

CSV Albums: A Database

For the most part, using the Universal Scrobbler is as simple as searching for the artist/album you want and hitting Scrobble. There are a couple of albums I have, however, which don’t seem to be searchable on the relevant databases. Luckily there is a CSV entry option which makes scrobbling whole albums super easy. I figured I might as well leave the converted CSV files online, just in case they come in handy for anyone else (plus, it acts as a backup/easy access for me as well). I’ll add to/update this post whenever I find some new ones.

UPDATE: (06/04/17) I’ve converted all of the CSV lists to use quote-mark column delimiters. By doing so, I can have track titles that contain commas without worrying about odd results – hooray!

The Atrocity Exhibition – Lazy Habits

“Lazy Habits”,”Kicking The Clouds”,”The Atrocity Exhibition”
“Lazy Habits”,”Feed the Brass”,”The Atrocity Exhibition”
“Lazy Habits”,”Left 2 (Ruins)”,”The Atrocity Exhibition”
“Lazy Habits”,”Crossing”,”The Atrocity Exhibition”
“Lazy Habits”,”The Breach”,”The Atrocity Exhibition”
“Lazy Habits”,”Answer With Quiestions”,”The Atrocity Exhibition”
“Lazy Habits”,”Hindsight Bias”,”The Atrocity Exhibition”
“Lazy Habits”,”Cold Shoulder Freestyle”,”The Atrocity Exhibition”
“Lazy Habits”,”The Terminal Beach”,”The Atrocity Exhibition”
“Lazy Habits”,”Give It Up”,”The Atrocity Exhibition”
“Lazy Habits”,”Sanity For Sanctuary”,”The Atrocity Exhibition”
“Lazy Habits”,”Never Did”,”The Atrocity Exhibition”
“Lazy Habits”,”Waiting Around – Bonus Track”,”The Atrocity Exhibition”

Lazy Habits – Lazy Habits

“Lazy Habits”,”Processional”,”Lazy Habits”
“Lazy Habits”,”Ashes”,”Lazy Habits”
“Lazy Habits”,”Surface Dirt”,”Lazy Habits”
“Lazy Habits”,”Even Out”,”Lazy Habits”
“Lazy Habits”,””Perfect Sentence””,”Lazy Habits”
“Lazy Habits”,”Ghosts (Fallen)”,”Lazy Habits”
“Lazy Habits”,”Memory Banks (feat. Baby Sol)”,”Lazy Habits”
“Lazy Habits”,”Starting Fires”,”Lazy Habits”
“Lazy Habits”,”Fades”,”Lazy Habits”
“Lazy Habits”,”The Road”,”Lazy Habits”
“Lazy Habits”,”An Interlude”,”Lazy Habits”
“Lazy Habits”,”Bulletin”,”Lazy Habits”
“Lazy Habits”,”The Drowned World”,”Lazy Habits”
“Lazy Habits”,”Please People”,”Lazy Habits”
“Lazy Habits”,”Recessional”,”Lazy Habits”
“Lazy Habits”,”Ghosts (Screen and Fallen)”,”Lazy Habits”

Sun – Cat Power

“Cat Power”,”Cherokee”,”Sun”
“Cat Power”,”Sun”,”Sun”
“Cat Power”,”Ruin”,”Sun”
“Cat Power”,”3,6,9″,”Sun”
“Cat Power”,”Always on My Own”,”Sun”
“Cat Power”,”Real Life”,”Sun”
“Cat Power”,”Human Being”,”Sun”
“Cat Power”,”Manhattan”,”Sun”
“Cat Power”,”Silent Machine”,”Sun”
“Cat Power”,”Nothin’ But Time”,”Sun”
“Cat Power”,”Peace and Love”,”Sun”

Cold Fact – Rodriguez

“Rodriguez”,”Sugar Man”,”Cold Fact”
“Rodriguez”,”Only Good for Conversation”,”Cold Fact”
“Rodriguez”,”Crucify Your Mind”,”Cold Fact”
“Rodriguez”,”This Is Not a Song, It’s an Outburst: Or, the Establishment Blues”,”Cold Fact”
“Rodriguez”,”Hate Street Dialogue”,”Cold Fact”
“Rodriguez”,”Forget It”,”Cold Fact”
“Rodriguez”,”Inner City Blues”,”Cold Fact”
“Rodriguez”,”I Wonder”,”Cold Fact”
“Rodriguez”,”Like Janis”,”Cold Fact”
“Rodriguez”,”Gommorah (A Nursery Rhyme)”,”Cold Fact”
“Rodriguez”,”Rich Folks Hoax”,”Cold Fact”
“Rodriguez”,”Jane S. Piddy”,”Cold Fact”

Palookaville – Fatboy Slim

“Fatboy Slim”,”Don’t Let the Man Get You Down”,”Palookaville”
“Fatboy Slim”,”Slash Dot Dash”,”Palookaville”
“Fatboy Slim”,”Wonderful Night”,”Palookaville”
“Fatboy Slim”,”Long Way from Home”,”Palookaville”
“Fatboy Slim”,”Put It Back Together”,”Palookaville”
“Fatboy Slim”,”Mi Bebé Masoquista”,”Palookaville”
“Fatboy Slim”,”Push & Shove”,”Palookaville”
“Fatboy Slim”,”North West Three”,”Palookaville”
“Fatboy Slim”,”The Journey”,”Palookaville”
“Fatboy Slim”,”Jin Go Lo Ba”,”Palookaville”
“Fatboy Slim”,”Song for Chesh”,”Palookaville”
“Fatboy Slim”,”The Joker”,”Palookaville”

Interneting is (Apparently) Hard [#6]

Visual representation of the HTML DOM model

Visual respresentation of the DOM

Reddit has once again directed me towards a very interesting online resource: Interneting is Hard!

The website is beautifully illustrated and boasts a very elegant design structure. There are a couple of cross-platform inconsistencies but the quality of the content and layout is excellent. A quick overview of some of the sections has highlighted the knowledge on display is equally well thought through. Overall, a very impressive find that I look forward to diving deeper into in the future and a great introduction to web design.

Cards Against Clarity

The concept of “card based” web design has been around for at least three years now. So why is it that the following quote from Khoi Vinh, written back in 2014, still appears to be a fundamental truth:

it hasn’t gotten much easier to explain to the uninitiated what, exactly, a card is.

Because here’s the thing: as much as I love reading about web design, I am still very much a member of the “uninitiated”. I can tell because I still have absolutely no idea what a “card” is.

I realised this (yet again) thanks to a recent article that cropped up in my RSS feed. I’ve been singing their praises recently, so hopefully Zurb won’t mind too much if I point to 5 Common Mistakes Designers Make When Using Cards in Design as a prime example of 1 Common Mistake Web Designers Make When Talking about Cards, chiefly, that what a card is fails to be defined anywhere.

Perhaps this whole situation is just down to me. Maybe I’ve fallen so far behind web trends that my outdated ways of attempting to understand “cards” are just not up-to-scratch. But, frankly, there doesn’t seem to be much help out there.

Early articles on using “cards” in design tend to paint a picture of API driven, cross-platform data sharing. A sort of standardised method of pushing/pulling content from/to various web apps; an ecosystem of information, if you will. That all sounds interesting and pretty great, yet presents a concept that is simultaneously vague and highly technical, creating a perfect mixture for people to be excited about yet confused over.

Yet “cards” are also used to describe certain design styles. In that linked Awwwards article a number of examples of “good card-based web design” are cited. Some, such as Dribbble and Pinterest, appear to be examples of the information ecosystem mentioned above. But then you have websites like White Frontier, which whilst being a great example of web design do not appear to have any form of content interaction or applicable data extraction methods. Yet these designs are, apparently, just as “card based” in their makeup.

As far as I can tell from Googling around the subject, “cards” are just rectangular content areas situated on a website. They might pull in information from a third party, they might just be a stock photo and a strapline. The article I initially quoted comes to a similar conclusion, that cards either fit into the “design” or “third-party” camps, which doesn’t seem particularly useful to me. If they’re just a design style then, really, they’re just a particular way of presenting content; a way which, ultimately, seems pretty much identical to how most people have always done it. If they’re only to be used when pulling third-party data then we need a tighter definition, because I don’t feel anyone would be happy suggesting iframes are all cards.

Currently, their only unifying factors appear to include being responsive, rectangular and online. So perhaps that’s all there actually is to them, which would be rather neat. If that is the case, then I can happily claim to have been making card-based websites since 2007, putting my well ahead of the trend!

Doth the Bell Toll for Zurb?

Today’s lunch started no differently to any other. Grab some food, open Internet Explorer (I know, it’s not by choice…) and fire up theOldReader to chip away at the ever mounting pile in my inbox. I dipped into the Oatmeal and realised I have, once again, missed a Kickstarter for a product that I genuinely want. Read some interesting thoughts from Adactio, Dan Mall and UNSTOPPABLE ROBOT NINJA (now, sadly it seems, going by the far less awe inspiring Ethan Marcotte). And then I looked at my inbox and wondered if it was about time that I started removing some of the feeds which I’m no longer excited to read. Feeds like the one Zurb publishes.

Although I’ve been subscribed to Zurb’s RSS for years now (possibly a decade) I struggle to think of a single article over the past six months that made me sit up and think: aha! Updates have been flowing as routinely as ever, but mostly they have focused on their internal business. Posts about new product updates or team members have been, seemingly, the core output for quite some time and whilst these do occasionally feature interesting anecdotes or clever imagery, ultimately they don’t feel particularly relevant. So then, I thought, today I will catch up on what I haven’t read and if nothing jumps out it’s bye-bye Zurb.

I am, admittedly, a little behind on Zurb’s feed so it was back to mid-October for a post titled The End of the Black Turtleneck, featuring a prominent image of Steve Jobs. As someone who laments the grasp Apple has on most of the industries I admire, a review of their glorious leader’s preferential attire didn’t exactly fill me with excitement. However, the old adages are true: you really shouldn’t judge a book by its cover.

Far from being a humorous or anecdote laden parade of fanboyism or irrelevant commentary on how Zurb have learnt to design the ‘Jobsian Way’ (which is hopefully something I just made up, though I can believe somewhere out there a design agency has it engraved into the ceiling…), The End of the Black Turtleneck is filled with genuinely interesting incite and actually takes several shots across Apple’s bow. In other words: things just got interesting!

I’m not going to say too much more on that article or the subsequent follow ups that were just as enjoyable and arguably more useful, except to highly recommend you go and read them yourself. If you’re in any way interested in the struggles that the design industry faces or even just the issues inherent with casting false messiahs or getting engrained in past zeitgeists, they’re definitely worth a read. I can’t say everything I’ve caught up on so far has been riveting, vital content but The End of the Black Turtleneck and The Perversion of Beautiful Design, both written by Zurb’s head honcho Bryan Zmijewski, are some of the most intriguing and thought provoking blogs I’ve read in a while. They’re clear, well written and have valid criticisms at their core. Most importantly, they gel well with my own belief that design should be as much about aesthetics as it is functionality; that function = form and vice versa, with neither greater than the other.

Plus, I learnt that the term ‘pixel’ was coined to describe the picture elements of videos shot by probes around the Moon and Mars. That titbit came from The Mighty Pixel, which is also well worth a read. I guess there was a reason to stay subscribed to Zurb’s feed* after all. In fact, it looks likely that there might be several.


* I wanted to link directly to Zurb’s RSS feed here but I can’t seem to find it anywhere. It clearly still works, but they obviously don’t feel it’s a feature any visitors want. So, I guess, there’s at least one aspect of Zurb that I disagree with. Either that or I’m a moron…