apatters

Human-centric design in modern times

Just like accessing my camera or my contacts, interrupting my day with sound, light and vibration is a privilege for which you must first request my permission. The platforms you built your app on didn’t get this right, many app vendors took every liberty they could to get spam in our faces, and now people are wary of it, which is why the brand equity of the worst offenders (like Facebook) is tanking. Now if you’ve bought as many friends in government as Comcast or Google, maybe you don’t care if your brand is hated–in which case, spam away.
 
But for the rest of us, there is this concept called permission based marketing which is now 20 years old. It’s the idea that customers are like friends and you treat their time and attention with respect. Do the right thing. Ask before you spam me (or allow someone else to spam me, for instance a messaging app assuming that every single person in a contact list should be able to call, beep, buzz and post at me). If you do this customers will reward you with more loyalty, more referrals, and more lifetime value.
 
Millions of people yearn for a time when they were less distracted and less distressed. Research has tied the modern appconomy directly to the loss of control they’ve experienced over their time and attention. This is an opportunity for smart companies to take the high road and win loyalty.
By the way, check out the Safe Affordable Credit Indiana website.

The emperor has clothes, but they’re a little gaudy

I have to think that the new post formats on Facebook which let you make your status update A HUGE FONT ON A COLORED BACKGROUND represent the ultimate antipattern and the death of good design at the hands of metrics-driven optimization.

They surely exist because so many A/B tests over the years made pieces of Facebook’s UI bigger, louder, and more image-heavy because all those changes encouraged more clicking and addiction and “engagement.”

Then one day someone at Facebook observed that everyone had stopped doing what they’d signed up for in the first place: reading the status updates their friends posted.

So of course this modern day Picasso decided to make status updates BIG AND SHINY AND BRIGHT RED too!

It’s Comic Sans and the marquee tag v2.0. Actually, this is more like v5.0.

Anyway, check out the Safe Affordable Credit Indiana website.

A rough sketch for an Indieweb plugin UX update

Some ideas I threw together for an updated Getting Started screen. Introduces the user to the IndieWeb concept, presents prominent next steps for ‘Indiewebifying’ their site and learning more. Eliminates the need for the Extensions page.

A stream-of-consciousness review of the Indie Web’s onboarding experience

Update: I did a rough sketch of an alternative Getting Started UI for the IndieWeb WP Plugin which addresses some of these issues.

 

This is my experience “indiewebifying” my personal WordPress site.

A user test from a “Gen 1” UX guy who just heard about this stuff last week.

Hopefully none of this comes across as too critical. I am REALLY impressed by what is already working.

  • First off, guilty confession… before this weekend I’ve just been posting on Facebook and didn’t have a personal website. Because 10 years ago when I did have a personal website, far less people read my posts.
  • What’s this you say? I can “POSSE” and suck Facebook comments back onto my own site? I can own my own content again? Awesome! OK, let’s give it a shot.
  • Hours spent browsing indieweb.org. A goldmine of awesome concepts but a lot of jargon.
  • OK, found http://indieweb.org/WordPress, and that’s my favorite CMS, so let’s get started.
  • A download of wp-cli and 20 minutes later: www.aaroncommand.com is reborn. Copy-pasted over a few recent FB posts for some dummy content. Chose Independent Publisher from the suggested themes because it’s so purdy.
  • $ ~/wp-cli.phar plugin install indieweb
  • wp-admin -> IndieWeb -> Getting Started: OK, a lot of UA text. Seems to tell me I’ll need a lot of other plugins too. Why not just roll all the functionality into one plugin? Let’s hit that blue button, it appears to be the next step.
  • Oh man. Overload. Too many choices and it’s not clear enough what I should do next. Do I need all of them? I think for a lot of people “Your Adventure Ends Here.” But I did work out what some of these things are from reading the wiki. I’m pretty clear on what Bridgy, IndieAuth, and WebMention are for example. Bridgy’s probably the piece that intrigues me the most, so let’s see if I can just get away with installing that.
  • Install… OK… Activate… three clicks is probably 1-2 more than needed
  • What’s the next step? I’ll randomly click around in WordPress to see if a Bridgy settings page appears. OK, a link has appeared in the hidden submenu of IndieWeb.
  • *** Humble suggestion: don’t give people a list of plugins to install and activate. For Gen 2: give them a list of *benefits,* like “Post Syncing” or “Federated Login(?)” each with a “Configure” button next to it. Hitting Configure installs and activates a plugin if necessary behind the scene, and takes them straight to the relevant configuration screen. For Gen 3 and 4… this stuff should probably all just be set up by default with a goal of zero config.
  • I enable Facebook, disable Twitter, for now. Save. Surprised there is no FB login stuff at this stage. “Bridgy publish requires a Webmention plugin.” Why not just install that for me when I install Bridgy 🙂 Links takes me to WP Plugins directory… But I just installed a plugin from the Indieweb settings UI, so this feels a little uncomfortable, even as a very experienced WP guy I wonder if there may have been some magic about that Indieweb install screen. So I back up to ‘Getting Started,’ install and activate Matthias’ plugin from there.
  • At this point I’m presented with no prompts as to what I should do next. I suppose the install was probably successful. Back to Bridgy settings… nothing there. Umm… let’s try a post. OK if I scroll to the bottom of the WP’s new post screen there is a place where I can check a box to syndicate my new post to Facebook. Let’s post something about how awesome Bridgy is.
  • Bridgy Error: Could not find Facebook account for aaroncommand.com. Check that your Facebook profile has aaroncommand.com in its web site or link field, then try signing up again. *** Humble suggestion: tell the user what they need to do for each silo on the Bridgy settings page.
  • Added http://aaroncommand.com on my FB profile under Contact and Basic Info -> Websites, tried to post again but it still doesn’t work. Maybe visibility needs to be public instead of the default setting ‘Only Me?’
  • Made it public, still doesn’t work. At this point I’m totally stumped. On a complete whim I go to http://brid.gy and click the Facebook button. Aha! An OAuth prompt! Scary to Gen 3-4 but reassuring to Gen 1-2 that some progress is being made. Click through a couple screens on brid.gy until I see a big “Click to enable publishing: Facebook” button. That’s very visually prominent so it’s probably what the website’s owner wants me to do.
  • This brid.gy website is now giving me a lot of info. It’s pulling event invites and things from my FB profile. That’d be pretty creepy if I wasn’t friends with anyone in the Indieweb community. Scared: if someone gets the link to this page, can they read all this stuff about my private life? *** Humble suggestion: My scenario was “syndicate to FB” so if we need to involve a third party please mention it when I’m deciding to install/configure Bridgy. I totally get that at this stage Bridgy probably wants to show everyone in the community how much awesome stuff is happening here, but as usage of the tech expands to total strangers, I would consider not regaling the user with lots of their previously friends-only content. I actually gathered from the talk yesterday that Bridgy had a server component, but most people won’t even know that.
  • There is nothing on the Brid.gy site about going back to my WordPress blog and posting from there, but lacking any other clear instructions for what to do next, I’m going to give it a shot. Type up my post again and hit Publish and WordPress says it was published successfully! But no mention of FB. So I go over to my FB profile, and after a minute or two, there it is! With an embedded blurry copy of my profile image in the post for some reason! Will have to figure that out, but this is a great achievement, so for now, a break for some victory chocolate.

*** Humble suggestion: user should get a notice when they publish that the post has been syndicated to {Facebook, Twitter, etc.} and will appear there in a few minutes.

*** Humble meta-suggestion: I suspect Brid.gy supports many more use cases than the WP-to-FB case I walked through today. Perhaps Brid.gy config chould be exposed through a RESTful API, delegating the UI question to the consumer (in this case the WP Indieweb plugin). Consumers of the API could then provide UI which is more contextually relevant.

Still todo: Set up FB comment syncing. Figure out if I can make posts on my site friends-only (!). (I know “privacy” on Facebook is at best security through obscurity, but that doesn’t make it useless. I don’t run ssh on port 22 either. I don’t want what I post to be world-readable by default.)

*** Last thoughts: That was easier than I expected! I didn’t run into a single part of the process that was really buggy or broken. Just a lot of UX nitpicks. What has been achieved so far is really impressive, it’s amazing that this stuff just worked without exploding once it was all authorized.

From a UX standpoint IMO my biggest hangups were:

1) At several points during the onboarding experience there was no clear next step. Users always look for a prominent button/banner/etc. which tells them what they need to do next to accomplish their task. Adding these at points in the workflow where they don’t currently exist is probably the easiest way to increase the number of people who onboard successfully.

2) Being confronted by a ton of plugins which all have obscure purposes. Consolidate these into one plugin or handle installation and activation behind the scenes when the user starts to configure a specific feature.

3) Having to jump out of the WordPress UI and go to another site to set up Brid.gy. Wasn’t actually told anywhere that I needed to do this, so if I hadn’t been furiously absorbing info from community resources for the past few days, I would never have figured it out. Keep the user in WordPress as much as possible while configuring Brid.gy.

 

Playing with https://brid.gy/ and Webmention plugins for WordPress. Pretty cool!

If there are two things we need to do to preserve the free and open Web right now I think they are 1) liberate the social graph and 2) provide a robust alternative business model to advertising. I was surprised to learn today that Tantek Çelik is now one of the co-chairs of the W3C’s Social WG! Tantek was one of the key guys involved in making Mac IE the best browser in the world during the early aughts, I met him once or twice in my early days as an MSFT intern and the dude was super smart. I need to learn more about this WG’s work.

Well, if you always wanted to watch “Animal Stories from Quran,” make sure you fly Lufthansa. #paidforbyswissair