What’s wrong with my site?

In late-2015, my now-wife and I decided to move away from the city we’d lived our whole lives in. I applied for tons of development jobs in London before the move but hardly heard back from any of them. I figured it was because I had nothing to show online and was 7000km away.

The history

So I went to WordPress and grabbed the first decent WordPress theme that I could find. I then published a handful of articles, including Using boost::bind and boost::signals2 to Automatically Propagate Signals. These early posts were a great exhibit of my technical knowledge. They also lulled all readers into a deep, restful slumber.

Not long after those two posts, I found a job. Coincidence? Yes. Because that was also around the time that I actually made the 7000km move to London. But my online presence couldn’t have hurt!

Since then I’ve written fifty more articles. These articles have shifted, along with my career, from engineering to design.

But I haven’t changed the design of this site at all.

A designer’s site should be designed

It’s bugging me more and more lately. C++ experts are almost expected to have hideous, unusable blogs. But a professional user experience designer? No. This will not suffice.

So now I’m going to commit to improving it… Actually “I” am not committing to it. “Future Shanes” are.

July Shane: Information Architecture

July Shane, you’re going to hate me for this, but you’re not here to defend yourself. I’m volunteering you to fix the Information Architecture (IA) of this site. If someone comes to ShaneG.ca and reads an interesting article, it’s difficult for them to explore. That’s a problem because there’s over fifty great articles that they might like.

Look at this main menu.

Screenshot of the main navigation of the site. 

Menu
    About Me & Contact
    Programming
        C++
        boost
    Consulting
        Google Apps Script
        Google Forms
        Google Sheets
        UX
    Oddly Specific: Various Notes and Collections of Links
    Getting Started in UX
    Portfolio
Search bar
The current site menu as of June 2019. There’s a lot more on this blog than the Programming and Consulting that I posted about in 2015.

So get out the post-it notes. Wrap your head around our content. Group it, tag it, categorize it. Then update this menu. By the end of the month, I want a coherent, usable hierarchy of content. It should highlight your recent work as well as the early stuff. And I want you to blog about it.

If anyone is reading this beyond July 2019 and the menu hasn’t changed, please shame July Shane. Use a tweet or get creative.

Update: July Shane did his job, just in time! See Fixing the Information Architecture of my Site

August Shane: Usability

I don’t know about you August Shane, but I don’t hate the hamburger menu. In certain cases, it can fine. This site is not one of those cases. Especially when you’re viewing on a big desktop web browser or even a tablet. Why bury July Shane’s beautiful categories of content under three boring lines?

The current site banner. It’s clean, but not intuitive or usable.

What I DO hate, though, is the align-right symbol floating opposite of the hamburger menu. Can you guess what’s under there? Align all the words on the page to the right for some reason? No. It’s to “follow” this blog.

Anyway, August Shane, all I want you to do is get rid of the hamburger and the right-align buttons. Use words instead. Then blog about it.

If anyone is reading this beyond August 2019 and the banner hasn’t changed, shame August Shane. Here’s a template tweet you can use.

September Shane: Have fun

I’m not always a jerk to my future self. September Shane, your job is to have fun improving this site. Maybe get into the code and make it so ShaneG.ca is the actual domain of the blog instead of a redirect. Maybe use IFTTT to post all articles to Twitter and LinkedIn automatically. Maybe add alt text to all images to make the content more accessible.

Whatever you choose to do, have fun and don’t forget to blog about it! Oh, and update this article with a nice happy ending for this three-month-mini-makeover.

Hey reader, are you from October 2019 or later? Is there a happy ending to this article? If not, shame that slacker September Shane s’il vous plaît.

Advertisements

Killing your darlings

Last month I wrote about my process of designing what I called vesting sparklines. I was super excited about them because they packed so much information into a small area and because they made so much sense to me.

There is nothing like the moment when you suddenly come upon the answer to a design problem. Whether it is a particular interaction or the perfect design element, it is a moment of pure elation.

-Joshua Brewer, 52 weeks of UX

Testing my idea

When I showed a couple coworkers an early version, they were extremely confused. They wanted to understand but even with me there explaining it to them, it took a while. Even then, they didn’t seem to love it.

And these are patient, smart people, open to the idea.

Users are typically in a rush, distracted, and resistant to change.

But that’s okay, I thought, it’s just an early version.

Tweaking my idea

So I added a detailed modal to my prototype, so that if you click the sparkline you see a carefully labeled version of it with a table showing all the data below. Hover any piece of the chart and the appropriate table row lights up. Hover any row and the appropriate bar on the chart lights up.

Retesting my idea

Recently, another group of coworkers was discussing showing a timeline of events. I couldn’t contain my excitement so I called them over to my desk and showed them my sketch file with the table and the hover and everything.

It fell flat. Again.

Five brilliant people, all very knowledgeable in the world of equity compensation, didn’t understand it. So I explained. And explained. And it still wasn’t clear.

Example chart of price vs. quantity for upcoming equity vests

Part of my “improved” design: simple, right? Wrong!

Then a coworker asked “What pain point is this solving?”

Oh. Yeah. That.

The problem with my idea

My problem with this idea was that it wasn’t directly addressing a known user need. It was just an exercise I came up with based on the Tufte book I read.

They say when the only tool you know how to use is a hammer, everything looks like a nail. I was wielding my Tufte hammer and swinging it all around, not realizing that there were no nails sticking out.

Another lesson here is that even designers are guilty of self design. I’ve always been an Excel nerd, in love with spreadsheets and data and graphs. Most normal people aren’t. So while the sparklines I designed may have been perfect for me, they were utterly baffling for most other people.

Killing my idea

It’s hard to do, but as a designer, sometimes you need to kill your darlings.

So goodbye vesting sparklines. It was nice knowing you.

On the bright side

While designing this, I taught myself how to get API responses from the Chrome inspector, turn that json into csv, and play with it in Excel. This has already come in handy in a real work situation when we wanted to dig into the responses of the API when testing some recent work.

Also, I enjoyed the process of creating this design. It was truly eye-opening to test the it and see what people thought about it. Those tests didn’t go as planned, but that’s why we test!

Fall out of love with your ideas and fall in love with your process.

Chirryl-Lee Ryan

It’s okay to be slow

This post is #7 in a series of posts about my UX research about UX Maturity. For all other posts, see my UX Maturity Research page.


 

Last week I wrote a long post summarizing my progress so far. At the end, I discussed some of my constraints, including the following:

 

Do TWICE as much with HALF the resources

  • Don’t do more; do it differently
  • Can’t sacrifice speed

 

Which came from numerous quotes in my research, such as:

  • “We [designers] slow things down because we think about them longer. “
  • “Can’t slow down velocity on getting features done”
  • “Product owners need to demonstrate progress. If feels like we’re interfering with their status updates. “

But now I’m starting to have my doubts.

 

Maybe you can sacrifice speed

I recently realized that while it would be great to speed up design, that might not be the best approach to increasing an organization’s UX maturity.

The reality is that good design does slow things down.

But isn’t it better to walk in the right direction than to run in the wrong direction?

Yes, well-designed solutions take longer than just getting features done, but they make your users happy, they are less buggy, more maintainable and extensible, and they differentiate you from your competitors.

My research was focused on mid-maturity companies, where people told me that design has to be fast. But I’m now learning that high-maturity companies don’t think that way. As UX Designer Barbara Shain told me about a past employer:

“There isn’t just a perception that design slows down development– we all accept it as a fact.”

In other words, yes UX is slow, but no that’s not a problem.

Related image

 

But speed is still important

As I was writing this post, I decided to look up some transcripts of the podcast that first introduced me to User Research 3 years ago: Dollars to Donuts. Turns out that many of the mature companies featured in this podcast do still have speed pressures.

I think if we double the size of the research team, I’m not sure that would be in the best interest of the company. I think that might actually slow things down.

-Alex Wright, Etsy

[The research team] got our foot in the door with some product teams and showed what kind of impact we could have and how… rapidly we could do this work… How it could speed up development in some cases.

-Aviva Rosenstein, DocuSign

But again, speed isn’t everything.

You can go too fast if you skip especially those early important steps of focusing on ‘Okay, let’s clarify, what are we doing?’ … if you cut the wrong corners, there’s a “gotcha” at the end.

-Kerry McAleer-Forte, Sears Holdings

Like many things in life, this is a very delicate balancing act.

 

What do I do now?

I’m so confused. But that’s normal in research.

Going forward, I’ll continue exploring ways to incentivize teams to care about design while keeping up the speed. However, I’ll also look into ways of embracing the slowness!

Duolingo is great, but…

I LOVE Duolingo. I can’t recommend it enough for people who want to start learning a new language.

Ever since I first tweeted about it back in 2015, I’ve been using it pretty much daily. First for a little bit of Spanish, and now for French and even a little bit of Vietnamese!

However, I have a few bones to pick, especially with some of the more recent changes, both as a user and as a UX professional.

Lingots vs. Gems

Back in the day, Duolingo used “lingots” to reward users for things like having a long streak of practicing, allowing them to “buy” things like extra lessons or even costumes for Duolingo’s owl mascot. This was consistent between the web application and the mobile app.

But sometime in 2017, the mobile app switched over from lingots to “gems”. I remember seeing a nice notification after that switch that explained to me why the change was made and what it meant to me. No harm done.

The weird thing: The web app didn’t switch over. I thought this might just be a temporary transition, but several months later and it still hasn’t. So one one device I have gems and on the other I have lingots.

The Shop on mobile: I have 3272 gems and I’ve wagered 50 gems on “Double or Nothing”.

The Shop on web: Even though it’s the same account, I have 2334 lingots and I haven’t made a “Double or Nothing” wager but I can for 5 lingots.

I really have trouble keeping track of the difference between the two. I wish I didn’t care about these fake internet points but when my 650+ day streak is riding on them, I can’t ignore them.

The fix

My suggestion to Duolingo: Follow Jakob Nielsen’s heuristic of “Consistency and standards”.

Users should not have to wonder whether different words, situations, or actions mean the same thing.

Choose one: gems or lingots. Then get rid of the other.

The Double-Tap Bug

It may be because my iPhone 6 is no spring chicken, but I’m regularly frustrated by the following behavior on Duolingo’s iPhone app.

On “listen then type” questions, when I tap the field to start typing, nothing seems to happen. So I tap again. The keyboard then appears (due to my first tap) then immediately disappears (due to my second tap). So I tap once more and all is well.

Confusing? Here’s a gif I made to illustrate it.

duolingo double tap bug.gif

The double-tap bug. Due to a delay in registering the first tap, the first two taps cancel each other out. The third one works though!

The bad thing is that this doesn’t seem to consistently happen. Sometimes when I tap the first time the keyboard immediately appears so there’s no problem. Sometimes I tap, then wait patiently for the keyboard to appear, resisting the urge to tap again, only to be staring at my screen for several seconds like an idiot, apparently because the app didn’t actually notice my first tap.

The fix

The problem seems to be that there’s a delay in registering the first tap, possibly due to the phone working hard to play the audio. I wonder if it’s possible to ignore a tap to close the keyboard if it happens immediately after the keyboard was opened.

Also, perhaps make the tappable area larger on these questions? That would prevent the “staring like an idiot” scenario above.

Condescending Messages

On the iOS app, after my first five questions of the day then again after about ten, I get a message. Instead of letting me continue on in my French flow, that damn owl pops up and gives me an infuriating pat on the head.

Yes, maybe when I start learning Japanese and am getting frustrated with the first few lessons, this might be a welcome ray of light. But not when I’ve devoured all the French content that Duolingo has to offer and I’m just reviewing a few old words. In that case, it’s just annoying.

The fix

As I said in my tweet, maybe these messages should just be for beginners. Or better yet, why not add a “Stop showing these messages” button to allow for opt-out?

But it’s not all bad!

With that being said, I still love Duolingo and will probably continue using it for years to come. And not all of their new stuff is bad.

Stories

I love Duolingo’s new stories feature, which seems to only be available on the web app under the “Labs” tab or at stories.duolingo.com.

These are short, enjoyable stories with words on screen and voices narrating, these are a great way for intermediate to advanced learners to get comfortable with how a language is spoken. They’re interactive to make sure you’re paying attention.

Duolingo’s story. It’s asking me which word means “to stay on the surface of the water”. It’s “flotte”!

And best of all, they’re entertaining. The stories usually have a nice little twist at the end.

The twist: The man that Rose was speaking to at the art gallery was Captain Black Beard himself!

Conclusion

Keep doing what you’re doing Duolingo!

For the gems vs. lingots, I’m guessing that either I’ve run into an edge-case bug or that there is some kind of constraint that I’m not aware of.

For the messages, I know that I’m now turning into an edge case. There are millions more beginners on your platform than people like me who have consumed all content for a given language, but still, with a couple of small changes, you can keep me preaching about how awesome you are without alienating your new customers at all!

For the stories, please make them mainstream! They’re such a great, entertaining way to learn!

Want to talk Duolingo with me? Find me on LinkedIn!

Quotes from Interviewing Users by Steve Portigal

I just finished reading Interviewing Users. It’s one that has been on my list for a long time, probably because I loved Steve Portigal’s Dollars to Donuts podcast. It did not disappoint.

It was a great read for me because I’ve done enough user research to have some experience to map to, but not so much that I knew everything in the book.

Here’s a collection of quotes from the book that I found valuable, organized by theme.

Preparing for interviews

Portigal first walks the reader through what to do before interviewing users.

“At the outset of a project, make the objectives your initial priority.”

Interview 6-8 stakeholders (yes, you interview the team even before you interview the users!) to see what they want to learn. Sift through the politics and agendas and try to get everyone on the same page as to what the objectives are. Find issues such as

“…hypotheses masquerading as facts, aspirations, and mass hallucinations… resolve those issues as tactfully as possible.”

Prepare a field guide but

“this is not a script. It reads very linearly, but it’s really just a tool to prepare to be flexible.”

Research scheduling

Once you’ve agreed on the objectives and recruited participants, schedule two interviews a day or so. But why not more?

“Quality work doesn’t come from being rushed, exhausted, harried, or overwhelmed. Interviewing is hard work. You need time between sessions to reflect.”

And while it’s tempting to save time or resources by using Skype or a phone call or getting users to come to you, go to where the users are.

How many people should go to each interview?

“I find the ideal size for the field team to be two people: one to lead the interview, and one to back up the other person.”

Documenting the interview

Photography

Prepare a shot list before interviews that lists the photos that you want to take.

“Even if you’re capturing imagery using video, still pictures are essential.”

“Even though they agree to the use of photography when they sign your release, let the interview settle in before you start taking pictures. You can verbally confirm that it’s okay before you take your first picture.”

Taking notes

Note taking is okay but no one writes fast enough to capture everything and

“you must maintain eye contact while writing.”

If taking notes, just write the facts. Not judgements. But if you must interpret,

“it’s easy to lose track of what you were told versus the conclusions you made, so take care in how you document the two.”

As soon as possible after each interview, write a top-of mind summary.

“Allow time for debriefing after each interview… The longer you wait, the less you will remember, and the more jumbled up the different interviews will become.”

Video or audio

Video or audio recording is the only way to capture everything the participant says.

“Keep your eyes and brain in interview mode until you are fully departed.”

“consider keeping your recording device on, even if it’s packed”

because of

“the “doorknob phenomenon,” where crucial information is revealed just as the [therapy] patient is about to depart.”

Interview technique

Portigal offers lots of tips about actually conducting the interview.

They’re the expert

“make it clear to the participant (and to yourself) that they are the expert and you are the novice.”

“Asking that person to play the teacher role not only reinforces the idea that she is the expert here, but it also can make it easier for her to articulate the details you are seeking.”

Invite honest criticism

“if you bring out a concept by saying, “Here’s something I’ve been working on…” you’re activating a natural social instinct that will diminish their comfort in being critical.”

Building rapport

Start with general (easy) questions to get them warmed up. It will feel awkward and uncomfortable but accept and break down the awkwardness by

“accepting, acknowledging, and appreciating her responses.”

“Try to construct each question as a follow-up to a previous answer.”

If you change topic, “signal your lane changes”.

Stories

Once you’ve built rapport, you will reach a tipping point from question/answer to question/story.

“Stories are where the richest insights lie, and your objective is to get to this point in every interview.”

Use their language

“build rapport by accepting the terms the participant was using rather than trying to demonstrate credibility.”

“Don’t correct her perceptions or terminology if the only outcome is “educating” her. Advocate for her, not for your product.”

The interview isn’t about you

“[Only] talk about yourself if doing so gives the other person permission to share something.”

To dodge questions asked by participants,

“Do the Interviewer Sidestep and turn the question back to them: “Is that important to you?” “What would you expect it to be?””

Question Types

Ask about sequence, quantity, examples. Ask for exceptions, lists, relationships. Clarify comments, language/ code words, and emotional cues. Ask them to teach, to compare, etc.

You want to know about their needs. But you can’t directly ask about their needs. So you ask them indirectly.

“There’s a difference between what you want to know and what you ask.”

On participatory design

“My aim with participatory design is to give people a different way to talk about needs, where the solutions stand as proxies for those needs.”

You don’t actually have to implement any of these designs.

Silence

“One way a novice interviewer tries to counteract nervousness is by preemptively filling the silence.”

“Ask your question and let it stand…. After she has given you an answer, continue to be silent.”

Improving as an interviewer

Practice interviewing. Even in daily life.

“Cultivate a style of interacting socially that emphasizes listening, reflecting back the other person’s comments, allowing for silence, and so on.”

Also, review your interview recordings with a critical eye like a football coach would review game tape.

“ask someone to come along to your interviews and get his feedback. Also ask for feedback from the rest of your field team.”

Other tips include teaching others to interview and even taking an improv class, because that will improve your abilities of thinking on your feet, accepting awkwardness, and “going with it”.

 

Analysis and synthesis

After you’ve finished all of your interviews, follow a procedure like this to squeeze as much learning as possible out of your research:

  1. Divide and conquer: “get your data in text form and divide it among the team.” Each team member reviews and summarizes one or more interviews.
  2. Summarize for the team: “The group should then reconvene and present each interview as a case study.”
  3. After all summaries, recap: “Discuss each interview briefly, and then create a sticky note that summarizes the key point of that interview.”
  4. Group findings: “create groupings. You may want to start with the categories from your topline and add to them.”
  5. Prepare the report: “the Presentation of Findings, which is the main research deliverable.”

User research and organizations

Interviewing is a good way to increase a company’s UX Maturity. It…

“starts to drive shifts in the organizational culture”

“position yourself in your organization so that interviewing customers is an integral part of how you work.”

How?

“The most impact for the least effort comes from your colleagues joining you in the field.”

For organizations with high maturity, research informs design but also exposes

“new opportunities for teams to embrace a user-centered approach to their work.”

Conclusion

I really enjoyed this book and I’m sure I’ll continue to refer to it (and these notes) for years to come!

The lorem ipsum bag

I’m currently on the trip of a lifetime. My fiancee Carolyn and I are exploring Southeast Asia with no return ticket and no real timeline other than “Be back in Canada by December”.

Carolyn and I wanted a lightweight way to share and remember our trip, so we are posting daily to ShaneAndCarolyn.wordpress.com using Post by Email.

The posts are mostly just fun pictures and anecdotes, but I recently posted one with a bit of a design spin, so I wanted to re-post it here on my tech blog.

So here it is! Feel free to check out the other posts as well.

Shane and Carolyn's Asian Adventure

Designers who are working on websites sometimes sketch out layouts and put what’s called fake placeholder text to show where the actual web content goes. This is sometimes known as Greeked Text. Here’s what I mean.

The idea is that if you put the buttons and icons and navigation in the right place, that your website will be great and you can worry about the content later. Some say that this is a bad thing– content is king so it should come first- but I think that it depends. Usually it’s not the end of the world.

That is, as long as you ACTUALLY CREATE CONTENT.

Today I was looking for a nice big backpack for me to use during my Asian travels then in the mountains when I get back to Canada. I found a great Jack Wolfskin 60L pack, but let’s just say that the price was…

View original post 82 more words