Category: Miscellaneous

Why creative people sometimes make no sense

Matthew Schuler has been browsing Creativity: Flow and the Psychology of Discovery and Invention—the result of over 30 years of research into creative people by Mihaly Csikszentmihalyi.—and has distilled many of the creative quirks cited into a short, but uncannily accurate post.

Matthew quotes nine apparent contradictions that creative people apparently exhibit; I must say that I identify with all of them—to a greater or lesser degree.

As I have been carrying out a UI/UX review of our product—which I designed a few years ago—I find #8 particularly apt at present.

Most creative people are very passionate about their work, but remain extremely objective about it as well. They are able to admit when something they have made is not very good.

Throughout my career—from my humble beginnings in print, pottery and sculpture, through graphics and print, right up to the applications that I currently design—I find that, from many hundreds (possibly thousands) of things that I have created, there are only a few that I am still really proud of.

Indeed, I find that I am, at best, luke-warm about the vast majority of the work that I do only a few months afterwards.

This is less true now than when I first started working in print design, back in 1997. In those days, I was creating posters for the student theatre: budget constraints meant that full colour work was simply not available. As such, I learned to leverage the power duotones and tritones. And, of course, I could really go to town with metallics, fluorescent and other specialist inks.

The world has moved on since then: printers are now set up to produce full colour work incredibly cheaply—and now it is all of those interesting spot inks that I can now longer afford to dabble with. And, of course, real metallics simply don’t exist on the web.

Some of my pieces, however, transcend the limitations of their production methods: and some of these I have loved for many years.

The best tribute that anyone ever paid me was that they had come to see an adaptation of Neil Gaiman and Dave McKean’s Mr Punch1 purely because he “loved the poster”.

Which leads me to draw your attention to #6 on Matthew Schuler’s list:

Most creative people are genuinely humble and display a strong sense of pride at the same time.

Perhaps…

1It was through Mr Punch that I discovered the art of Dave McKean: the poster style was influenced heavily by McKean’s work, and he remains my favourite artist of all time.

About

I am a web and print designer, UI/UX interface guru, and marketing director at a growing UK web software company—based in Woking, UK.

These days, I spend most of my time combing tenders, talking to customers and to prospects in order to determine what online solutions we should be developing; I then write specifications—both functional and UI/UX—and help our development team to prioritise developments.

However, I still dabble in front-end development—both in some of our deployment projects, and on CodePen.

Additionally, you can currently find me on LinkedIn and Twitter.

Flexbox

Two years ago, I tried to implement our web software interface using flexbox. Unfortunately, I was a little too eager in this endeavour, and had to hastily reinforce my fallbacks as the specification changed.

The Flexible Box Layout Model—commonly known as flexbox—has the potential to solve a number of perennial problems that front-end devs have been banging their heads against ever since CSS was invented in 1996, including equal height columns, true proportional width flexibility, and DOM ordering over-rides (very useful for Accessibility).

A number of these practical problems—and how flexbox solves them—are illustrated on Philip Walton’s Solved by Flexbox GitHub page.

However, as I discovered back in 2011, flexbox has had rather a chequered history—passing through three distinct specifications. Detailed support is outlined at caniuse.com, but, roughly, browser support is:

  • flexbox-legacy: supported by Safari 5–6 and Chrome 4–20;
  • flexbox-intermediate: Internet Explorer 10;
  • flexbox: Chrome 21+, Safari 6.1+ (allegedly), Firefox 21+ (sort of: there’s no support for flex-wrap and flex-flow).

To make things more complicated, Modernizr only has feature-detection for the oldest and newest syntax, which are output as flexbox-legacy and flexbox respectively.

And finally, once you delve into all of the possible variables, the syntax is not at all simple.

Luckily for us, a number of very smart people have been keeping up to date with all of the progress and built some useful web tools to generate code for us.

  • Flexyboxes provides a neat WYSIWYG interface for building flexible layouts, and it will generate code for all three syntaxes if you need to. Do be careful, however, as the older versions are not as capable as the up-to-date flexbox.
  • You can only use Flexplorer if your browser supports the latest syntax (which Safari 6.0.2 does not!), but it does also give a useful rundown of browser support for vendor prefix requirements.

With everything settling down—and a UI refresh of our software on the cards—I have been considering writing a set of LESS mixins for deploying flexbox in the wild. Inevitably, of course, putting “flexbox less mixins” swiftly shows that yet more smart people have got there first.

With so many to choose from, David de Coninck’s version jumped out at me most immediately—his use of guard expressions is really elegant.


See the Pen Flexbox 2013 LESS mixins by David De Coninck (@davidgenetic) on CodePen

Do you have a favourite LESS mixin that supports all of the syntaxes out of the box? Let me know in the comments…

 

Stripe wants to “redesign the world’s online payment structure”. It won’t.

I was recently having lunch in Skylon with a friend of mine who is also involved in software, and he mentioned that Stripe—a payment gateway—had now launched in the UK. A bit of light searching revealed a Wired article which asserts that Stripe’s co-founder wants to “redesign the world’s online payment structure to achieve one universal system”.

“… The internet has made it easy for people to communicate, but payment is still fractured. As a result the internet gets fractured as well. We don’t have this problem offline. The internet is a testament to a connected system that works—it’s a global network where any computer can reach another, and easily transfer information across.

“What if we designed payments for the internet? With interconnectivity and user experience as the goals. We’re designing from the groundup for the internet. We’ve not achieved it yet, but we expect more instruments will follow as Stripe spreads. The reason this problem is so important is that the web economy has so much growth left in it.”

The trouble is that this is simply not going to happen—not through Stripe, in any case.

Why? Well, just look at Section B5 of Stripe’s UK Terms and Conditions:

[B5] Prohibited Businesses

By registering for Stripe, you are confirming that you will not use the Service to accept payments in connection with the following businesses, business activities or business practices: (1) door-to-door sales, (2) offering substantial rebates or special incentives to the Cardholder subsequent to the original purchase, (3) negative response marketing, (4) engaging in deceptive marketing practices, (5) sharing Cardholder’s data with another merchant for payment of up-sell or cross-sell product or service, (6) evading Card Network’s chargeback monitoring programs, (7) engaging in any form of licensed or unlicensed aggregation or factoring, (8) airlines, (9) age verification, (10) age restricted products or services, (11) bail bonds, (12) bankruptcy lawyers, (13) bidding fee auctions, (14) collection agencies, (15) chain letters, (16) cheque cashing, wire transfers or money orders, (17) counterfeit goods, (18) currency exchanges or dealers, (19) embassies, foreign consulates or other foreign governments, (20) firms selling business opportunities, investment opportunities, mortgage consulting or reduction, credit counseling, repair or protection or real estate purchases with no money down, (21) credit card and identity theft protection, (22) cruise lines, (23) essay mills, (24) flea markets, (25) drug paraphernalia, (26) extended warranties, (27) fortune tellers, (28) “get rich quick” schemes; (29) gambling (including but not limited to lotteries, Internet gaming, contests, sweepstakes, or offering of prizes as an inducement to purchase goods or services), (30) sports forecasting or odds making, (31) illegal products or services, (32) mail-order brides, (33) marijuana dispensaries and related businesses, (34) money transmitters or money service businesses, (35) multi-level marketing or pyramid schemes, (36) online or other non-face-to-face pharmacies or pharmacy referral services, (37) prepaid phone cards, phone services or mobile phones, (38) pseudo pharmaceuticals, (39) quasi-cash or stored value, (40) securities brokers, (41) sexually-oriented or pornographic products or services, (42) shipping or forwarding brokers, (43) substances designed to mimic illegal drugs, (44) telemarketing, (45) telecommunications equipment and telephone sales, (46) timeshares, (47) travel agencies or travel clubs, (48) online or other non-face-to-face tobacco or e-cigarette sales, (49) weapons and munitions (50) virtual currency that can be monetised, re-sold or converted to physical or digital goods or services or otherwise exit the virtual world, (51) personal computer technical support, (52) selling video game or virtual world credits (unless you are the operator of the video game or virtual world), (53) selling social media activity, such as Twitter followers, Facebook likes or Youtube views, (54) human hair, fake hair or hair-extensions, (55) any product or service that infringes upon the copyright, trademark or trade secrets of any third party, or (56) any product, service or activity that is deceptive, unfair, predatory or prohibited by one or more Card Networks.

The vast majority of the businesses prohibited above are—assuming relevant registration and permits are obtained—totally legal and legitimate businesses.

As it happens, I was looking at Stripe in connection with a charity-related business that I am involved in. At first I was incredibly excited: Stripe seemed to offer all of the security and flexibility that we need—including OAuth integration.

Unfortunately, there is a gambling element to this business; and, even though the business has all of the required permits and clearances from the British government, Stripe’s Terms and Conditions mean that we cannot use their service.

Section B6 of the T&Cs covers illegal trading, which would surely be enough in most circumstances.

[B6] Business Conduct.

You will only accept payments through Stripe for transactions between you and your customer for the bona fide sale of lawful goods or services. You will not solicit or use a cardholder’s Card Data for any purpose other than to process payment for your goods and services. You will comply with all applicable laws, rules, regulations and orders of governments having jurisdiction in connection with your use of the Service.

One can only conclude, therefore, that Section B5 is something that Stripe have inserted to assert their own morality into their business model. Which is entirely fair enough: Stripe’s gaff, Stripe’s rules.

However, Collinson cannot make grand, sweeping statement about wanting to  “redesign the world’s online payment structure to achieve one universal system” or opine that “we’re still waiting for [an integrated] payment tag, but rather than universal it’s still fractured” when Stripe itself is committed to preventing entirely legitimate—and heavily regulated—organisations doing business online.

Collinson goes on to say:

“Payment systems are holding back online progress. You still have to fill in 15 different fields, then get redirected to Verified [by Visa].”

Collison imagines a one-click world, where making use of any entrepreneurs’ product is as fluid, natural and as user-friendly an experience as the design itself, with little friction and more transactions.

It seems that, like many entrepreneurs, Collinson makes a good case for interconnectivity on one hand whilst, in fact, establishing business practices—based, presumably, on the personal morals of him or his investors—that stifle creativity on the other.

When we have a Stripe-like system that will encourage—or at least allow—any and all legal businesses use their service then we might actually get the universal payment system that Collinson says he desires.

Until that time, talk of wanting to “redesign the world’s online payment structure to achieve one universal system” remains so much hot air.

Microsoft announces Steve Ballmer’s retirement

So, Microsoft has announced Steve Ballmer’s retirement as CEO—presumably effective from whenever the company can find someone competent that Ballmer has not driven out.

Here’s the hitch though: Ballmer has chased all potential successors out of the company — Ray Ozzie, Robbie Bach, J Allard, and most recently, Steven Sinofsky.

Just about everyone in the tech scene reckons that Ballmer was, in fact, fired—and not before time.

As someone who has always loathed Windows as a horrible piece of software (or, if you prefer, ‘as a Mac fan-boi’) I am, of course, very sad to see Ballmer go. The man’s inability to understand how to penetrate the important new markets has not only brought the destruction of Microsoft exponentially closer, but his total lack of vision and ridiculous pronouncements have also destroyed the company’s technical credibility.

The wider problem for Microsoft is that Ballmer had just initiated his (extremely risky) One Microsoft re-structuring and the decision to get rid of Monkey Boy now explains why he has remained at the helm for so long and through so many disastrous product launches, e.g. Zune, Vista, Windows 8, the Surface Tablet, Windows Mobile, Windows Phone, etc. And that reason is, quite simply, that Microsoft’s board have no more clue than Ballmer about how to save the company: it has taken them this long to work out that Ballmer was never going to be their saviour.

Indeed, not only does the board seem to be at sea, but—as Guy English points out—they don’t seem to understand that this moment is, in fact, the worst possible point to fire the idiot.

Ballmer writes in his farewell memo:

There is never a perfect time for this type of transition, but now is the right time.

No. It’s not.

They’ve just completely recreated the company in a pattern that’s totally alien to most organizations of their size. Indeed, the current configuration only seems to work for Apple. Which, arguably, grew into it completely organically. The structure of Apple certainly wasn’t created by fiat a month prior to a CEO hitting the bricks.

The only way that today’s news could have been good for Microsoft is to have announced a successor and to have said that the new structure was determined after long discussions with them. The only story that could be positive is that Ballmer and his successor, whoever they are, have worked closely together and now that the structure has changed there’ll be a year of handing over the reigns.

As it stands? Ballmer has completely shaken up the way that Microsoft has always worked. Now they don’t only need to find a new CEO who believes they can lead Microsoft out of the hole they’ve dug themselves but one who believes that the last decision that Steve Ballmer made, a company wide reorganization, is the way they, as the new leadership, want to run the company.

Microsoft is currently searching for a new CEO who’ll fit the straight jacket Steve Ballmer has left behind.

Yes, Microsoft is still making large amounts of money, but it is difficult to escape the fact that Ballmer’s tenure—certainly over the last decade—has been a failure: Marco Arment neatly sums up why.

My favorite part of this news is that this — the massive, probably-terrible internal reorganization — is what seemingly got the board to finally fire Ballmer. It really shows how far Microsoft is up its own ass.

Let the stock stagnate for over a decade? Fine.

Fail to dominate consumer web services, and only get your share by losing billions of dollars for years? That’s OK.

Lose control of online collaboration of Office documents to your biggest rival? Well, maybe the internet will turn out to be a fad.

Miss the entire smartphone revolution, then field what’s still one of the least popular major smartphone platforms? No problem.

Preside over the mass cannibalization of the PC business by tablets, while having effectively zero tablet marketshare? Hey, maybe you can try again next year.

But try to mess around with our divisions? You’re fired.

Anyone who read my last post on Microsoft will realise that the mind-boggling management practices at the company had stifled any chance of innovation long ago—certainly before Ballmer became CEO (although as part of senior management, he bears a heavy burden).

After all of this, however, people will no doubt point out that Ballmer was good at milking the assets that Microsoft already has, and that’s true.

So, perhaps the board should rethink their decision to fire Ballmer and adopt the strategy suggested by Tim Worstall—sweat the remaining assets, return as much money to the shareholders as possible, and then wind up the company.

Microsoft leads the way

On page 4 of this Vanity Fair article (can’t seem to direct link), Kurt Eichenwald outlines how Microsoft leads the way—in this case, the technology giant ably demonstrates how to destroy a culture of innovation within a business in one easy step.

At the center of the cultural problems was a management system called “stack ranking.” Every current and former Microsoft employee I interviewed—every one—cited stack ranking as the most destructive process inside of Microsoft, something that drove out untold numbers of employees. The system—also referred to as “the performance model,” “the bell curve,” or just “the employee review”—has, with certain variations over the years, worked like this: every unit was forced to declare a certain percentage of employees as top performers, then good performers, then average, then below average, then poor.

“If you were on a team of 10 people, you walked in the first day knowing that, no matter how good everyone was, two people were going to get a great review, seven were going to get mediocre reviews, and one was going to get a terrible review,” said a former software developer. “It leads to employees focusing on competing with each other rather than competing with other companies.”

Supposing Microsoft had managed to hire technology’s top players into a single unit before they made their names elsewhere—Steve Jobs of Apple, Mark Zuckerberg of Facebook, Larry Page of Google, Larry Ellison of Oracle, and Jeff Bezos of Amazon—regardless of performance, under one of the iterations of stack ranking, two of them would have to be rated as below average, with one deemed disastrous.

For that reason, executives said, a lot of Microsoft superstars did everything they could to avoid working alongside other top-notch developers, out of fear that they would be hurt in the rankings. And the reviews had real-world consequences: those at the top received bonuses and promotions; those at the bottom usually received no cash or were shown the door.

Wow.

Do go and read the rest: the further revelations about just how utterly insane this idea was—is?—are quite flabbergasting.

In the end, the stack-ranking system crippled the ability to innovate at Microsoft, executives said. “I wanted to build a team of people who would work together and whose only focus would be on making great software,” said Bill Hill, the former manager. “But you can’t do that at Microsoft.”

If you want to know why every “innovation” that has come out of Microsoft in the last decade or so has been an ignominious failure, then you need look no further.

Reciprocity: give to get

Living in the world that we do—with its smartphones, transatlantic travel, ultra-high-def TVs and One Direction—it’s sometimes easy to forget that we are, at the most basic level, animals.

We have, over the course of human evolution (modern humans it’s generally agreed upon have been around for at least 200,000 years), carried with us various traits that helped our long gone ancestors to navigate and survive on this planet we call “home”.

In the modern world of communications these traits may seem of no real concern to us but the truth of the matter is that we still act and make decisions based on them.

The use of reciprocity, for example, can be a powerful tool to help create a reaction and a connection with your clients and customers. It can help build a deeper relationship, creating trust and loyalty.

At the most basic level, reciprocity is the exchange of something of value between two or more people. This doesn’t have to be as obvious as giving a present or receiving a birthday card: assistance, advice and contacts can equally be a form of reciprocity.

By and large we try to repay in kind what another person has given us; if we don’t, we usually have an overwhelming feeling of guilt—and there aren’t many people who enjoy that feeling. I know I don’t.

There are many theories as to where reciprocity comes from and why it’s a major influence over our lives and decision making. It has been theorised that it relies on a universally held belief of future obligation: if we give something of value away it won’t be lost forever but will be repaid to us in the future with something of equally valuable (or even more so). Humans for the most part will almost always strive to repay this “debt” even when the expectation of repayment is a vague one.

We can see reciprocity happening all the time in the online arena—take LinkedIn, for example. When we receive endorsements or recommendations from our clients or associates, most of us will respond in kind without being asked—we somehow feel compelled to do so.

When someone comments on one of our photos on Facebook, we will often comment back on one of theirs. Even if we don’t feel obligated, we would rather do this than not as it’s fundamental to our social success.

We can make use of this ancestral practice in a variety of ways.

  • Write free articles—not only will you be giving your readers knowledge for free but you’ll also be enhancing your position and credibility as an expert in the field in which you operate. The same can be said for coding. There are many developers who use reciprocity by giving away bits of code they have created: those who download the code feel obliged to either spread the word about the developer’s site, leave comments of thanks (usually praising the developer’s skills) or offering solutions or “bug fixes” for free.
  • Offer a free consultation—by giving away a bit of your knowledge and helping your potential clients/customers just a little it will instil the feeling that you’ve gone out of your way to help. It will enhance your reputation and increase the prospect of a more meaningful and prosperous relationship.
  • Compromise—by showing that you have the ability to compromise, your client will more than likely wish to reciprocate in kind, leading to a mutually beneficial outcome. This doesn’t mean that you have to become weak and go against your fundamental principles. Be strong, but always make room for compromise too.

It seems that even though we are moving full steam ahead into the future, there are certain traits that are ingrained in the collective human psyche. Don’t forget to use those traits—they’re effective, they work and they have done for at least the past 200,000 years.

A Link List Apart

A LIst Apart's new home page
The new A List Apart home page, viewed at my browser’s full height. No, I haven’t scrolled down.

A List Apart have embarked on a redesign, and I have to say that I am not a fan. Let me very briefly lay out the reasons why:

  • the cut-off logo looks weird. Not cool—just weird. I keep checking whether my scrolling has gone haywire.
  • it has massive text. Why does it have massive text? Seriously, why would you want to force me to scroll more than I already have to? And yes, I do have a scroll-wheel at home; but no, I do not have one at work. And that applies to Zeldman’s site too.
  • the RSS Feed is now full of endless links to other endless resources. If I spent every hour of my day checking them, I would be unemployed.
  • part of the excellence of A List Apart was its carefully selected articles that did not clutter my RSS Reader with endless link lists of other people’s things to read. I thought that ALA’s principled stand against the constant barrage of information whoring was admirable—it showed a confidence in its format and writing. Now it is just another Daring Fireball or Shawn Blanc.
  • I wouldn’t mind lots of link lists to interesting articles if all of these massively profitable sites—like Daring Fireball and Shawn Blanc and, now, ALA—weren’t basically linking to the same stuff. (I know, because they are all in my Feed Reader.)
  • yes, I do know that I can modify my ALA Feed: but why should I have to…?

I don’t pretend to be the world’s most amazing designer—and, even if I did, you certainly wouldn’t know it from this largely unmodified template—but I rather think that ALA’s redesign is not an improvement.

And I really wish that people would stop trying to make money by piggy-backing off the time and effort that other people put in. I mean, I don’t always agree with them, but at least the denizens of Boagworld write their own material.

The increasing prevalence of blogs consisting of little more than daily link lists is a bit like having a bunch of friends who think that repeating Monty Python sketches word for word for an entire evening is either amusing or interesting.

Eventually, the tech internet is going to consist solely of link lists of link lists.

At which point, I shall pray for the Apocalypse.

Removing comps in web design

For a few years now, I have had the feeling that we are approaching web design in the wrong way. Many designers—and their clients—have made the transition from the medium of print, and transferred the design processes too.

In print, we were all used to producing proofs with millimetric—nay, pixel-perfect—precision because we had to: the high-resolution of print meant that that one pixel gap was obvious when the material came off the press.

But it made absolute sense to produce these proofs—or composites (“comps”)—because print is a fixed medium: what you see is, pretty much, what you get.

Building a nightmare that never stops

Hence the bane of the website builder’s job: a pixel-perfect Photoshop comp married—in Hell—with a customer who doesn’t understand that their website is never going to precisely match that beautiful image proof that they have signed off.

The web has always been a fundamentally fluid medium: in print, the amount of text was often governed by the size of the printed page—in web design, the very opposite is true.

And this point is compounded when designing for a content management system (CMS), where the designer could not—and should not—absolutely control how much text a user can insert.

The death of the static image comp in web design

As such, I really believe that we need to kill this idea of using static image comps in web design and, a few weeks ago, Brad Frost succinctly summed up why in a post entitled The Post-PSD Era

Throughout my career, I’ve watched immensely talented designers waste a shitload of time creating fully fleshed-out comps of what a website could look like. Pixels get pushed, details are sweated, pages are printed out, hung on walls, and presented to clients. Clients squawk their feedback, then designers act on it. They repeat this dance until everyone is content (or until nobody gives a shit anymore, which happens more often than you’d think).Only then do those pristine comps get handed (more like shoved) over to developers to build.

It’s an increasingly-pathetic process that makes less and less sense in this multi-device age.

As it happens, Brad wrote this post at roughly the same time as I was presenting a new design process to my fellow managers—and I found it when looking for some pithy comment with which to populate a slideshow presenting said process to the rest of the company.

Bringing it home

My company designs and implements websites on its own Content Management System (CMS). I have moved through different positions within the company over the last five years, but I was put in charge of the new Creative and User Experience Team in July.

In between delivering customer projects, I have been attempting to make our processes more efficient. It swiftly became obvious that there were a number of problems with the way in which we designed and build our websites and intranets.

Improving our process: driving efficiency

The first has been largely improved by the adoption of an increasingly robust CSS LESS framework.

The second, however, was more difficult to address—customers’ expectation that their websites would look precisely (yes, even in IE7) like the lovely images that they had signed off .

We were also duplicating work.

So, the first thing that we did was to push the responsibility for producing wireframes solely onto the Information Architects; wireframes were already an output of these workshops (driven largely by the Attention Mapping exercises), so duplicating this work seemed ridiculous.

Next, we created a selection of mood boards—with recognisable, non-techie names—which, combined with the wireframes, enabled our designers to get a very good idea of what the customers were aiming for.

Zombie comps that will not die

But, at the end, we were still producing fixed image comps that were taking too long to create and, importantly, amend. Customers were getting hung up on the positioning of elements when, in our CMS, you can place anything anywhere (just about).

So, in December, I my research turned up Samantha Warren’s styleti.es—a website dedicated to promoting the use of said Style Tiles.

Style Tiles are similar to the paint chips and fabric swatches an interior designer gets approval on before designing a room.
An interior designer doesn’t design three different rooms for a client at the first kick-off meeting, so why do Web designers design three different webpage mockups?

Style tiles are for when a moodboard is too vague and a comp is too literal. Style tiles establish a direct connection with actual interface elements without defining layout.

The sites and systems that we build are huge.

There is simply no way that we can proof up all of the pages that make up the tens of functional Modules that our customers may have bought.

Style Tiles and a way forward

As I saw it, Style Tiles—with a bit of modification—would enable our company to provide the important elements to our customers (the look of a menu system, how a Staff Directory entry might be displayed) without them getting hung up about where on the page these elements might appear.

After all, not only is the web a fluid medium but our CMS also gives the customer total control over their page structure.

With Style Tiles, clients could focus on the important details, rather than getting hung up on where those things appeared on a page. We would, in fact, be aligning our processes with the flexibility of our product and thus reinforcing its superiority.

There were, of course, other benefits, including being able to turn around work much more quickly and thus increase the productivity of the team.

It’s never enough…

But Style Tiles wouldn’t be enough—especially in the age of Responsive Design.

As such, we decided to build Live Prototypes alongside the Style Tiles. With our LESS framework (which has mobile @media break-points built in), and the CMS’s inbuilt styling options, this became a viable proposition.

The first run is scheduled for Tuesday morning: I’ll let you know how it goes…

Cultural fit

I’ve been with my present company for nearly five years and have fulfilled numerous job roles over that time: I was hired as the second Web Designer, then moved into Project Management, then to Marketing Manager. After that, I led the nascent Product Development Team as Product Manager for two years; about six months ago, I was asked to head up and lead the Creative and User Experience Team (design had been part of the Operations Delivery Team, rather than a function in its own right).

In this time, I have been involved in hiring for a varied selection of job roles: designers, telemarketers, sales development managers, project managers, account managers, front-end developers, back-end developers, operations managers, and more.

In every case, whilst the candidates’ skills have been important, what has defined their success within our company is whether or not they are a good “cultural fit”.

An article in Bloomberg BusinessWeek maintains that, in hiring, job applicants’ cultural fit can trump qualifications.

In the December issue of the American Sociological Review, Northwestern professor Lauren Rivera concludes that companies are making hiring decisions “in a manner more closely resembling the choice of friends or romantic partners.” Rivera found that apparently off-topic questions have become central to the hiring process. “Whether someone rock climbs, plays the cello, or enjoys film noir may seem trivial,” she wrote, “but these leisure pursuits were crucial for assessing someone as a cultural fit.” As a result, Rivera argues, “employers don’t necessarily hire the most skilled candidates.”

The phrase “cultural fit” may summon up obnoxious images of old boys clubs and social connections, but it’s a powerful buzzword among human resources professionals. A cooperative, creative atmosphere can make workdays more tolerable and head off problems before they begin. “I used to work for an e-commerce company that spent a lot of time refining its culture,” says Mercedes Douglas, now head of recruiting at Kikin, an Internet search startup. “I hired someone as a manager, and it created a lot of tension because he didn’t fit in. People tried to alienate him because they weren’t interested in him as a friend,” she says. And it also goes the other way. “I once hired a woman who really didn’t have the right background or experience for the job, but who I hit it off with during the interview,” says Rebecca Grossman-Cohen, a marketing executive at News Corp. (NWS). “And because we got along so well, I was able to train her easily, and she ended up doing great things for us.”[*]

Cultural fit is tremendously important and, given two candidates with different skills, we will certainly go with the one that we feel is going to fit in best with the company culture.

Don Melton does offer some words of warning about this attitude—not least in that it is possible that asking certain questions of a candidate could get you into trouble legally. However, this hiring policy can have negative effects on your business too.

More importantly, screening for cultural fit is a tricky goal since your organization could wind up with a monoculture. Making sure your new employees embrace your company culture, e.g. innovation, is a good thing. Making sure all those employees are similar culturally can play havoc with diversity and limit perspectives. And that’s bad.

This is true, but the danger can be somewhat mitigated by the fact that the cultural fit in certain teams might be different. The culture which pertains to our Sales & Marketing Team, for instance, is very different to that within my own—partly because they do a different job, and have a rather different attitude to the customer.

However, none of this alters the fact that the people driving our company forward—regardless of what team they are in—share a certain attitude: they are, in the main, extremely knowledgable about our customers and markets, extremely technically savvy (not necessarily in the detail of code, but in identifying wider trends), strong-willed and entrepreneurial. Importantly, they are able to understand how to apply all of this general knowledge to the specific problems and developments that our company needs to address.

But most crucially, all of these people are committed to ensuring the company’s success, despite any set-backs.

And these people are often not “managers”; this being the case, our company is not massively hierarchical because power naturally flows to those with not only the knowledge and skills but also a “can do” attitude.

After all, if you have a question about something, you aren’t going to go to that guy who is going to get annoyed or mock you for not knowing the answer, are you? No, you are going to go to the guy who not only knows the answer and will give it to you freely, but is also going to say “what can I do to help?”

Whilst it could be argued that this leads to a certain exploitation of these individuals, in a small company, the maximum dissemination of knowledge is incredibly important. And if I, as a salesman, am asking a question about the capabilities of one of our products, it must mean that I require it so that I can do my job, i.e. selling said product; and, of course, selling said product (and being accurate about its features) is to the benefit of the company.

As such, it does also mean that these knowledgable individuals are seen to be aligned with the company’s aims rather than just their own. This perceived similarity of purpose binds them—in the minds of others as well as, often, themselves—into a team that transcends normal hierarchical or departmental bounds.

And so we return to this idea of cultural fit, and of which kind of culture you actually want people to fit into.

When I interview people, I do want definitely want them to fit into my team’s ethos; but if they are highly skilled and are going to be able to do the job that I need them to do really well, then we’ll hire them.

However, what I am really looking for—every time—is someone who is likely to become one of those “core” people; someone who is going to advance the company, who will be a manager—whether officially or not.

And that’s the cultural fit that we’d really like candidates to suit.

* Let’s hope that the interviewee in the latter example wasn’t Rebekah Brookes.

** As it happens, I am currently looking for two Web Designers / Front-end Developers. And one of them most definitely needs to be a “core” person, since they will eventually be leading the Creative and User Experience Team.

Bandwidth media queries

Back in March 2012, Chris Coyier opined that, in addition to other @media queries, what we really needed was bandwidth media queries.

But is screen width the correct metric to use here? Perhaps it is, why would a screen that is 400px wide ever need an image that is larger than 400px wide? Well I think the retina display on certain new devices are answering that question for us. Those devices may respond to certain width media query but really have twice the pixels available and be able to show much sharper images. Yes, we have device-pixel-ratio media queries for that as well, but I still think we’re dancing around the issue.

That issue is: bandwidth. If I’m in a place / on a device that has super slow internet, I’d love to be served a very light web page so browsing is still acceptably fast. If I’m in a place / on a device that has super fast internet, by all means ratchet it up and deliver me more.

This doesn’t mean ignore screen size. That’s obviously relevant when it comes to layout. This extension of media queries would give us a more appropriate tool for media in a world where the size of your device is increasingly unrelated to its bandwidth.

So I wonder: is it possible?

The short answer, as provided by Yoav Weiss writing at Smashing Magazine and interpreted by your humble Devil, is “no, it’s not; and it is not desirable in any case. And even were measuring bandwidth desirable, bandwidth media queries would be entirely the wrong way to approach it”.

The reasons are many-fold, but they start with the fact that not only is effective bandwidth is incredibly difficult to measure but also that, even on a relatively stable connection, the TCP protocol is designed so that bandwidth actually changes all of the time.

And that is without including mobile users, whose rated bandwidth might change as they move between broadcast cells.

TCP is the dominant protocol for the reliable transfer of data on the Internet. The protocol itself has a certain overhead that results in a difference between the theoretical and the effective bandwidth. But another factor is responsible for an even more significant gap between the two. TCP doesn’t always use all of the bandwidth available to it, simply because it doesn’t know the bandwidth’s size.

Sending more data than the available bandwidth can cause network congestion, which has disastrous implications on the network. Therefore, TCP uses a couple of congestion control mechanisms: slow-start and congestion avoidance.

Each TCP connection is created with a very limited bandwidth “allowance,” called a congestion window. The congestion window grows exponentially over time, until the TCP connection sends enough data to “fill the pipe.” That is the slow-start phase, which can take up to several seconds, depending on the network’s delay. Then, TCP periodically tries to send just a little more, to see if it can increase the amount of data it sends without causing congestion. That is the congestion-avoidance phase.

Both of these mechanisms assume that packet loss is always caused by congestion; so, packet loss results in a significant reduction to the congestion window, as well as to the rate at which data is sent. On wireless and mobile networks, this behavior is not always ideal because they can suffer from packet loss for reasons other than congestion (for example, poor reception), which can result in under-utilization of the network.

So, bandwidth, by its very nature—by its very design—is variable over time. But even if the browser could accurately measure the effective bandwidth at any one moment, bandwidth media queries are precisely the wrong way to implement any tests.

As far as the browser is concerned, a media query is a direct order with which the browser must comply. It has no room for optimizations. It cannot avoid obeying it, even when it makes absolutely no sense. Let’s explore what that means for bandwidth media queries.

Let’s assume for a minute that browsers actually do have an accurate way to measure the current bandwidth and that a solution for responsive images is in place and can use a bandwidth media query.

The natural thing to do, then, would be to define a responsive image with multiple sources— a high-resolution image to use when the bandwidth exceeds a certain value, and a low-resolution image when the bandwidth is low. The browser loading the page that contains the image would then download the high-resolution image, since it has good bandwidth conditions.

Let’s say that, after a few seconds, the bandwidth conditions change for some reason. The browser (sharp at detecting bandwidth as it is) will immediately detect that the bandwidth is down. The browser is now obligated to download the lower-resolution image and replace the high-resolution one with it. The result is a useless download of the low-resolution image and a worse user experience, because the quality of the image that the user sees is worse than it could be. Even if this happens to only a low percentage of users, that’s bad news.

Now, you could argue that the browser could optimize and use the version it already has. But the fact of the matter is, it can’t; not with media queries — at least not without changing the whole meaning of them.

So, the quick answer to Chris’s question is: no, bandwidth media queries are not possible. And even if such measurements could be implemented reliably, media queries would be the entirely the wrong way to go about making web pages responsive to bandwidth anyway.

Solving problems in a framework

Ian “Hixie” Hickson, editor of the HTML “Living Standard”* at WHATWG, is one of the most influential people on the web today. HTML5 Doctor has a very interesting interview with him, but I wanted to highlight one passage in particular.

In my day job, I usually describe myself as a web software designer. Trying to describe what that means is usually a little tricky: there are, of course, aspects of User Interface (UI) and User Experience (UX)** design in there; I also bring in some Information Architecture, a degree of HTML and CSS mastery (though, alas, my Javascript is pretty basic) and a great deal of market knowledge.

However, there is one passage from Hixie’s interview—in a context not entirely unrelated—which pretty much sums up the nitty-gritty of what I do.

Often when people send feedback (not just authors, pretty much anyone who hasn’t been in the process for a long time starts this way) they send feedback along the lines of “I want to add feature X” or “I want feature X to be extended in manner Y”. But when we drill down, ask them “what problem are you trying to solve”, or “what’s your use case” (same question but phrased differently), we often find that either (a) they actually don’t have a real problem, they just thought that it would be a good idea, or (b) their solution wouldn’t actually solve their problem. Often we’re able to come up with much simpler solutions (or point to already-existing solutions), which is quite satisfying.

Like Hixie, I am working within an existing framework—our Enterprise Content Management Framework—and, when a customer requires some new piece of functionality, I need to take into account what others have fed back and how to best solve their problem within our existing framework.

Luckily, we designed and developed the framework fairly recently—and in response to existing customer requirements—so often we can point the customer to an existing function that solves their issue.

However, when that isn’t the case, I never rely on our salesmen or, indeed, the customer’s own specification. Whenever faced with a development request, my first question is “what is the driver”, i.e. what is the problem that they are trying to solve.

Designing within a framework, understanding multiple customers’ needs, taking account of possible future developments and, thus, solving problems in the most elegant way are what give me pleasure in my job.

And deriving that enjoyment from such is what makes me good at what I do.

 

* Otherwise known as HTML5.

** There’s a school of thought that maintains that there is no difference between the two; indeed, many hold the opinion that any way in which customers interact with your company or its products is, in fact, UX.

A useful resource for teaching customers about web design

As discussed in my last post, many customers do not really understand design; this is doubly true when it comes to designing for the web. Right on cue, Wee Nudge is an excellent recourse for teaching customers about web design (and, indeed, design in general).

Topics include spec work, the “fold”, whitespace, wireframes, content—and that all-important subject of giving, and getting, feedback. The articles are from a variety of sources, and should be an invaluable resource in enabling you to work better with your customers.

You know what they say: “give a man a web design and you feed him for a day; but teaching customers about web design will enable a great working relationship.”

Or something like that…

Welcome to The Devil’s Repose

For nearly seven years, I wrote a political blog from a libertarian stand point. However, in early 2008, I was hired by a small software company based in Surrey, in England. Since this time, I have become more and more interested in the web, and its development—as such, I have laid down the stale and futile political mantle, in favour of writing about technology.

And so here we are…

A bit about me

I started my career designing posters for the Edinburgh University Theatre Company (traditionally known as Bedlam) and, from the winter of 1996 until the end of 2006, I designed hundreds of posters, flyers, programmes and leaflets. (I also variously lit, directed and produced over forty productions there.)

I had ostensibly been studying Microbiology at the University of Edinburgh but, swiftly realising that this consisted mainly of biochemistry (which I disliked), I dropped out at got a job as a Mac Operator in a small Edinburgh print-shop. Over the next eight years, I moved through a variety of similar jobs—each one having more of an emphasis on design (rather than processing the designs of others)—before moving to London (where, of course, the streets are paved with pure gold) in 2006.

During my last two jobs in Edinburgh, I had learned the art of website building and taught myself HTML and CSS. And so, in London, I set up as a freelancer and worked enough to ensure that I remained comfortable.

But being comfortable is rather dull, and before long I found myself craving company and people from whom to learn. And so, via a variety of coincidences, interviews and impulsive decisions, I ended up working for my current company—which builds and deploys websites and intranets on its own content management system (CMS).

Although hired as a second-string designer, my strong views and inability to keep my mouth shut has resulted in my being deployed through various parts of the business over the last few years: I have been a designer, a project manager, marketing manager, an information architect, product manager, UI/UX designer and creative manager.

About this blog

This blog aims to bring together many of the things that I have learned along the way, and to keep track of trends in current web development; from a coding point of view, I shall be focusing particularly on what is traditionally known as front-end development—and cutting-edge HTML5 and CSS3 techniques.

Many of the posts will simply be links to interesting articles and methods, but I shall also be undertaking longer posts about personal experiments and opinions. At some point, it is likely that others will join me.

I hope that you enjoy this little divertissement, and do feel free to comment and join the discussions…