Category: Online Software

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.

Applications that I use

Having mentioned Sketch in my previous post, I thought that I would expand on the applications that I use in my workflows. And to start with, I need to expand on what those workflows actually are.

Which is tricky—because I do quite a number of varied jobs.

First, I do a considerable amount of management, both in my team and in the wider business. This is why my job title is the, slightly unwieldy, Creative and User Experience Manager (usually shortened to CrUX Manager).

Essentially, I lead the team that designs and builds our customers’ websites and intranets on our company’s content management platform (CMS). However, I also design the user interface (UI) and user experience (UX) for the CMS—plus I also design a lot of the new functionality too.

Occasionally, I give talks at events—both internal and external—about the web, CSS, Accessibility, and other related issues.

Because I know a lot about the web, our product and our customers, I have also spent a lot of time in customer pitches, Information Architecture (IA) workshops, and in discovery meetings for new software. In other words, I am heavily involved in a customer’s entire journeys with our company—and, in many cases, for determining the steps along that journey.

And, since I run the CrUX team, I am also responsible for recruitment to that team and, with the operations team, for managing resources on a day-to-day basis. And, of course, when we have a new starter, I am responsible for sorting out software and hardware—which means that I know how much we invest in our applications!

Which brings us back to where we began—the applications that I use to achieve all of this.

Graphic Design

For the moment, I find myself continually coming back to Photoshop—like a dog to its sick. I don’t really like Photoshop for design (and I loathe Illustrator) but it is familiar and thus relatively easy to dip into.

However, I am gradually weaning myself off Adobe’s products in favour of smaller, cheaper applications that are, in many ways, better for the job than Adobe’s bloated behemoth’s.

I have been playing about with Sketch (about £30) a lot, and I think it’s a wonderful application. It is very capable and, with every update (usually monthly), it becomes more capable and more stable. I am aiming to make it my primary design tool.

For non-vector based work, I have been getting into using Pixelmator (about £20) which is also an excellent (and cheap) photo-editing and design application.

Browsers

My browser of preference is Safari. Its Web Inspector tools are almost as capable as Chrome’s, and I find the browser faster and more reliable than Google’s offering.

However, I do test in all major browsers—including Internet Explorer 7, 8, 9 and 10. To achieve this on my Mac, I use VirtualBox (free) and the wonderful IEVMS script to automate the conversion of Microsoft’s supplied disk images to a format that VirtualBox can read.

Coding

A few years ago, I found myself, with a colleague, in a café with free Wi-Fi; up until that point, I had used Dreamweaver to code my work. However, my laptop was not equipped with my meatier applications and so—needing to do some coding and having read a good review of it—I downloaded Panic’s Coda.

And I have never seriously used another coding environment since (although I have also dabbled with MacRabbit’s Espresso—before they merged it with CSS Edit). I certainly never launched Dreamweaver ever again.

Coda was, essentially, my first foray into the sunlit uplands of indie Mac Developers. Up until that time, I had basically used Adobe applications and little else; for someone with this experience, the speed with which Coda launched and operated, as well as its feeling of lightness, were a revelation.

That independent developers are challenging Adobe in its core areas of photo-editing and vector design (this latter being an area that Adobe basically stole when it killed my beloved Freehand) is one of the very best things about the Mac platform right now.

I write in LESS and use the excellent CodeKit to process it, as well as for compressing images, and other useful things. Be sure to read CodeKit’s amusing release notes, by the way…

Finally, I started using CodePen a lot for experiments, reduced test cases, reference files, etc. I particularly like the fact that it compiles LESS on the fly. I haven’t had much time to continue playing with it recently, but that should change in the next few days.

Software Design

My role in this area is, essentially, to gather customer needs, to productise them, and write requirements specifications.

For this I use Apple’s Pages (£14) for the text and, for the workflows, Celestial Teapot’s very nice little diagramming application called, simply, Shapes (roughly £3!).

This latter app is—like most Mac indie apps—under active development and Celestial Teapot seem very good at taking feedback and incorporating it into releases.

Administration

For most other administrative tasks, I use Pages, Numbers and—for presentations and speaking engagements—Keynote.

When presenting, I use Apple’s Keynote Remote—running on my iPhone—to control the slides and display presenter notes (where necessary). In the absence of Wi-Fi (a rare thing these days) I carry a standard, hardware Apple Remote.

Miscellaneous

I do dabble with a few other apps, and I like to try out new applications quite often.

Wireframes

Where necessary, I use MockingBird for building up wireframes; it is simple, elegant and easy-to-use. The lack of development on it over the last couple of years has been disappointing, but it is still an excellent online application.

Animation

One app which has a great deal of potential is Tumult’s Hype. Using this application, you can build up complex animations using a timeline model, and Hype will then generate a file containing CSS3 animations (including complex matrices): even better, it will also generate the Javascript required to cater for older browsers.

Combine this with Modernizr and the built-in YepNopeJS, and you have a modern, compliant solution for creating complex animations.

Project Planning

Since I have taken over my current job role I don’t use OmniPlan as much, but I still find it useful for internal scheduling: it’s a fully-fledged project management application, with proper concepts of utilisation and efficiency.

Font Management

For font management, I still use the free version of Linotype FontExplorer X (which, whilst difficult to find now, has lasted me for years and years!), but I am starting to switch over to Bohemian Coding’s Font Case.

For web fonts, I use TypeKit (although, since Adobe has taken over, I am finding some issues with reliability. What a surprise) and, occasionally, Google Web Fonts.

And that’s about it. There are one or two applications that I play with, but the major ones are those listed above.

Do you have any favourite applications? Feel free to leave your preferences in the comments…

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…