Quick Fix Days and Hack Weeks

At Automattic we’ve redefined our hack weeks to focus on product changes for customer kindness: fixing flows, removing dead ends, and paying down technical debt.

In The big secret of small improvements Tal Bereznitskey explains how to improve “quick fix days,” where software teams take time to make small improvements. Those small changes can together mean a big win for customers and the business.

At Automattic we’ve experimented with both 1-day bug scrubs in one team all the way up to a full “hack week” — so Tal’s principles strike a chord with me.

Framing the problem is halfway to solving it — I love how he suggests rewording the subject line of a software change to fix a bug as something actionable, not just a description of the problem.

6. Well defined. Only work on tasks that are defined properly. Prefer “Make content scrollable” over “Bug: can’t see content when scrolling”.

Create positive feedback loops — I remember during my days answering WordPress.com Themes bug reports and how rewarding it was to hear directly from the people I helped with a bug fix.

7. Thanks you. There’s nothing like hearing a customer say “Thank you!”. When a quick-fix was suggested by a customer, let the developer email him and tell him the good news.

This is the work: customer kindness — Our latest iteration at Automattic speaks to this customer focus as the goal of the maintenance work — it isn’t just polish or cleanup, this is the product work. We even have a fun acronym for it now! H.A.C.K. — Helping Acts of Customer Kindness.

Aaron Douglas: Being Mindful During Video Calls

Tips from my coworker and prodigious mobile app maker Aaron Douglas on being mindful during video calls. Great tips, not just for remote workers, either. “I’ve come up with a bunch of little tweaks to help with attentiveness and mindfulness during the call. It is important to show you’re listening.”

The Dangling Pointer

Working remote means I’m on a lot of video calls. I’ve come up with a bunch of little tweaks to help with attentiveness and mindfulness during the call. It is important to show you’re listening.

Look at the camera often

When you’re in person you look at people’s eyes to show them you’re listening. Doing that on a video call requires a bit of counter-intuitive body language by looking at the camera. You won’t be looking at the person but they’ll see you looking directly at them. It’s a subtle difference but I’ve found it highly effective.

Also try to place the video call window up the screen towards the camera. Also decrease the size of the window so the person’s eyes are naturally closer to the top of the window (closer to the camera). When you’re not looking at the camera while the person is speaking it’ll still look…

View original post 305 more words

Kerry Liu on Team Leadership: Three Important Things

Insight on team leadership and management from my colleague and technical team lead extraordinaire Kerry Liu.

Remember these three things: don’t fall into the safety of your old job, listen, and provide useful feedback.

These are the three most important insights I gained from working as an Engineering Team Lead at Automattic. 

Read the full article: Three Important Things.

Inclusive Design, Day 15/15: Links, Resources, Voices, and Stories

This is day 15 of 15 in a short series on inclusive design. If you missed any of the earlier posts, see day 1 here or view the full list below.


Resources, notes, and links to recap the 15-day series on inclusive design, where I shared what I’m learning about inclusive design with you.

I hope you’ve enjoyed following along and have learned something new. I welcome your comments and back-links to share your stories and resources, so I can learn what inclusive design means to you.


 

Voices


Product Stories & Companies


Automattic & WordPress Projects

  1. Design.blog — 50 thought leaders contributing essays on design, inclusion, +/- tech in Community, Creativity, Culture, Health, Leadership, and Product.
  2. Design and Exclusion — A free conference produced by Automattic, Mash-Up Americans, and the MIT Center for Civic Media at the Media Lab.
  3. Inclusive Illustrations — The illustration vocabulary created by Alice Lee and adopted by WordPress.com to express the broad range of customers that we serve.
  4. Inclusive Design Checklist — An online and printed resource launched at the 2017 AIGA National Design Conference.
  5. We Called it Gutenberg for a Reason — Matt Mullenweg on the essential freedoms of WordPress

Books


Blog Series: 15 Days of Inclusive Design

  1. Day 1: Introduction, Discovery, and Voices
  2. Day 2: Building Empathy
  3. Day 3: Mismatched Conditions
  4. Day 4: When Defaults Don’t Fit
  5. Day 5: To See Yourself in Imagery
  6. Day 6: Recognizing Exclusion
  7. Day 7: Roku and the 10-Foot Rule
  8. Day 8: Expand Your Market By Solving One Case First
  9. Day 9: Review of Principles
  10. Day 10: Making Your App Accessible Benefits Everyone
  11. Day 11: OXO Figured It Out
  12. Day 12: Improved Publishing Confidence on WordPress.com
  13. Day 13: Mind the Mobile, Design for Low Bandwidth
  14. Day 14: Diverse Teams Make Better Decisions
  15. (You are here.)

This content will live on in the form of a continually updated page: sensible.blog/inclusive.


About this Inclusive Design series Today (February 16, 2018) I’m giving a talk on inclusive design at WordCamp Phoenix 2018. Leading up to the conference I’ve been publishing notes on voices, stories, products, and other resources: everything I’m learning about this emerging practice. Read more about the series.

Inclusive Design, Day 14/15: Diverse Teams Make Better Decisions

This is day 14 of 15 in a short series on inclusive design. If you missed any of the earlier posts, see day 1 here or view the full list.


Inclusive and diverse teams make better, stronger teams — and these teams make better decisions. Because our work and thought patterns are influenced by our background and biases, working with a diverse group means not only fresh, new ideas, but we also counterbalance the tendency to design for people just like ourselves. A higher standard.

And that is why representation matters, not just to those who are represented, but to all of us. Because it expands our sense of what’s possible, and what we have reason to expect. —Cate Huston

Bring diversity into teams
Screenshot of the Automattic Inclusive Design Checklist, under Teams.

For maximum learning and a broader perspective, not limiting yourself to your immediate team or company; seeking out a wide variety of inputs from mentors, coaches, and other advisors.

If your team is limited and you don’t have the ability to expand, actively seek out people with other perspectives to consult or act as project advisors, and give special consideration to their feedback.


I learned from Sara VanSlyke and Trace Byrd at Atlassian that it also matters how a diverse team is represented, in their article “Illustrating Balanced and Inclusive Teams.”

As a company that wants to unleash the potential in every team, depicting people is especially important. How we represent the people who make up teams should be just as important. We’ve always known that the best teams are balanced; made of a diverse group of people with different backgrounds and perspectives, but our illustrations haven’t always reflected that.

An Atlassian team article
Screenshot from the Atlassian team’s article about illustrating their diversity.

The authors found that even though their team aspired to be more inclusive, how they represented themselves visually wasn’t keeping pace with the true diversity of the team.

Promoting diversity and inclusion within our brand is a persistent and multi-faceted effort. And it’s a challenge to depict diversity without it feeling merely perfunctory or symbolic until the reality of our industry truly represents the customers we serve and the world at large. More needs to be done outside of the brand to promote an inclusive workplace, but we’ve found that the results of constant vigilance and open conversation are worth the time and energy.

To truly represent our customers is something Automattic is improving — we still have a long way to go. If you missed the story about updating the WordPress.com brand illustrations to be more diverse, see Inclusive Design, Day 5/15: To See Yourself in Imagery — with illustrator Alice Lee and my designer colleague Joan Rho.

See also this YouTube series introducing Automattic employees from all walks of life. A diverse group! I’m proud to work with them every day.


For a thorough treatment of this topic, I highly recommend reading and bookmarking “On Improving Diversity in Hiring” from my Automattic colleague Cate Huston. In this in-depth article, she shares her hiring expertise to build diverse teams, everything from onboarding and recruiting to specific tips and tricks during interviews.

Screenshot from Cate Huston's post about improving diversity in hiring.
Screenshot from Cate Huston’s article about improving diversity in hiring.

This rule of thumb about stopping the behavior before someone is hired hit home with me as this is something I need to improve on personally. An off-color joke here, a comment there; I’m learning to speak up more when I notice these things.

A good rule for inclusion pre-work to diversity is to stop doing things you would have to change if the demographics of your team better reflected the demographics of the world. —Cate Huston

One practical tip shared by Cate that I’ve put to good use is Textio, a service to help make job descriptions more inclusive. I used it in 2016 to update the Excellence Wrangler job posting, replacing phrases like triage ruthlessly with triage efficiently.

Textio website screenshot
Screenshot of the Textio homepage.

Cate’s influence in the last year or so has helped me improve my hiring to be more inclusive, both in mindset and in practice. She’s inspired me to read more broadly, and think more openly.


In closing, a word from Scott Page via his Aeon article titled “Why hiring the ‘best’ people produces the least creative results:”

When building a forest, you do not select the best trees as they tend to make similar classifications. You want diversity.

(Scott has a new book out on this topic: The Diversity Bonus, How Great Teams Pay Off in the Knowledge Economy. I haven’t read it yet.)

For day 15 of 15 of inclusive design, the last day, I’ll share a recap of all the inclusive design learnings I’ve shared in this series so far.


About this Inclusive Design series Tomorrow I’ll give a talk on inclusive design at WordCamp Phoenix 2018. Leading up to the conference I’ve been publishing notes on voices, stories, products, and other resources: everything I’m learning about this emerging practice. This is day 14 of 15. Read more about the series.

Inclusive Design, Day 13/15: Mind the Mobile, Design for Low Bandwidth

This is day 13 of 15 in a short series on inclusive design. If you missed any of the earlier posts, see day 1 here or view the full list.


Bandwidth is a Precious Resource

Speed and connectivity should be considered be a major factor in exclusion. Just ride the BART in San Francisco. 😀

Joking aside, much of the world does not enjoy the wonders of high-speed bandwidth yet.  Like William Gibson famously said, “The future is here, but it’s not evenly distributed.” Kansas City Google Fiber gigabit on one end, on the other Tegucigalpa less-than-Edge with wires hanging off a string.

As evidence of the disparity consider the “lite”* apps built by tech giants for markets where they want to drive adoption. The need for a reduced-weight experience in places with low-speed wired broadband and tenuous mobile broadband highlights the case of exclusion. Where large populations are left out of the “modern web” due to connectivity limitations, cost of entry, archaic device types, and many more reasons both cultural and political. (*Side note: what the heck is with that spelling?)

One story I noticed recently that mentioned speed as a leading tech market indicator involved WhatsApp’s growth in India even as Facebook lags behind them, via The Economist, January 27, 2018. Sluggish web app performance is a factor in Facebook’s lack of adoption in India. People who pay by the megabyte or gigabyte prefer to use a service that is leaner, faster, less bloated. They’re voting with their app choices.

Photo of a story in The Economist about WhatsApp and Facebook
Screenshot from a story in The Economist about WhatsApp competing with Facebook in certain markets, winning there in part because of low bandwidth and connectivity.

In more ways than one, WhatsApp is the opposite of Facebook… whereas Facebook requires a fast connection, WhatsApp is not very data-hungry.

As a result [of this and other reasons], WhatsApp has become a social network to rival Facebook in many places, particularly in poorer countries. Of the service’s more than 1.3bn monthly users, 120m live in Brazil and 200m in India.

Extend the Benefits to Everyone

On the plus side, designing for speed brings about broad improvements to everyone else in the world. People should love the simpler interface with fewer settings and menus, alongside the bandwidth savings and reduced footprint for the app’s data storage needs.

Logically, “Design for low bandwidth” is on the Automattic Inclusive Design Checklist under “Bringing inclusion into designs.”

Automattic Inclusive Design Checklist item about designing for low bandwidth.
Screenshot from the Automattic Inclusive Design Checklist about designing for low bandwidth.

Back to the trend of tech giants creating lighter versions of their apps. When I take a closer look at the apps like “Twitter Lite” and “Facebook Lite” — at first they appear to be primarily designed for speed on slow connections. Yet the changes bring a new and different experience to many people who are mobile-first or non-technical.

The design enhancements resulting in a simpler and more intuitive app extends the benefit to a wide variety of people. For example, better readability from larger text size and the usability win from simpler navigation and clearer labels. That sounds like something the AARP crowd would all buy or click on or subscribe to.

If you’re curious about the “lites” — here’s further reading.

Twitter Lite:

Facebook Lite came out two years earlier: Announcing Facebook Lite (June 2015).

With Facebook Lite, our goal is to provide the best possible Facebook experience to everyone, no matter their device or connection. And we hope that by sharing how we built the app, we can encourage more people to build for the next billion coming online. — via How we built Facebook Lite for every Android phone and network

The next billion coming online! Ambitious.

Is Calypso Fast Yet?

WordPress.com teams pay a lot of attention to improving the user interface with a focus on speed, yet still have a long way to go to catch up. Much of the improvement happens “below the hood” in the Calypso React app — developers improve how the app bundles assets such as CSS files, images, and external JavaScript libraries. Loading files asynchronously when needed and not on the first page load, finding ways to remove extra weight from each page load, caching data in more places — all to make everything look, feel, and load ultra-fast.

Goal: Calypso is the WordPress Lite.

Calypso designers also pay attention to the user interface, of course — recently we’ve made the text size larger and improved the color contrast for readability. My team at WordPress.com is now digging into label changes and interactions needed for a refreshed, simpler navigation for managing WordPress websites.

For those curious, we track speed improvements in Calypso on this data-rich website: iscalypsofastyet.com. And, we’re hoping to improve both the mobile web performance and the usability of the app even more in 2018.

Is Calypso Fast Yet website screenshot
Screenshot from the Calypso project performance status site: iscalypsofastyet.com.

In a blog post Speed is a key design attribute John Maeda highlights two strong voices in recent web history — speaking out on the value of speed and performance: Marissa Mayer and Lara Hogan. They’ve both been preaching this same topic for years. I’m sure today no one argues the pivotal role of speed in Google’s early success and how it led them to market dominance.

Feel the Slowness to Build Empathy

Testing bandwidth limitations even on a fast network is a great empathy challenge. I’m grateful to John Maeda for sharing two ways to do this: Chrome has a throttling setting in developer options to try out slower speeds with your site or web app, and the Network Link Conditioner for XCode 9.2 for macOS.

I’ve felt this slowness most times I travel, even in the US — in airports, hotels, taxis, trains. Most definitely when in other countries, because I’m limited by my data plan’s built-in speed limitation. Or, as when I visited a WordCamp in Nicaragua, the slow mobile “broadband” is the reality for everyone living there.

Keeping in mind much of the world now sees the web only through a mobile device. Which brings us to a message from WapuuMind the mobile!

mind-the-mobile.png
Wapuu says: “mind the mobile.” (Background image: Pexels; Wapuu illustration by John Maeda.)

For day 14 of 15 of inclusive design, I’ll share behind-the-scenes details of the work Automattic designers put into our inclusive guide and checklist.


About this Inclusive Design series In 2 days I’ll give a talk on inclusive design at WordCamp Phoenix 2018. Leading up to the conference I’m publishing notes on voices, stories, products, and other resources: everything I’m learning about this emerging practice. This is day 13 of 15. Read more about the series.

Inclusive Design, Day 12/15: Improved Publishing Confidence on WordPress.com

This is day 12 of 15 in a short series on inclusive design. If you missed any of the earlier posts, see day 1 here or view the full list.


The pre-publish confirmation step in the WordPress.com editor.
Screenshot of the pre-publish confirmation step in the WordPress.com editor.

I’d like to share another example of solving for one case, extending to many. This one comes from my team at Automattic. We’re called “Delta” — and we focus on making the editing–publishing flow for WordPress.com as smooth and pain-free as possible.

The WordPress.com blog in English.
Screenshot of the WordPress.com blog in English. This blog is read by 40-plus million people.

From our own experience, we know that publishing content to the entire world can be nerve-wracking! This “publishing confidence” experience started out with a specific case in mind: the WordPress.com announcements blog. With 43 million email subscribers as of the latest count, the authors at Automattic writing for this English-language blog never want to accidentally hit that “Publish” button before a new announcement is polished and ready to go.

That’d be a total disaster, right?

Many years ago, we solved this by placing a tiny plugin created for our VIP customers on the WordPress.com blog. It’s super simple, a JavaScript alert() dialog intended to add a quick warning before publishing. Developed for use on high-end client sites running on WordPress.com, it looks like this:

View of the VIP plugin for publish confirmation.
Screenshot of the WordPress.com VIP plugin for “are you sure?” publishing confirmation.

Fast-forward to 2017 — the Delta team starts revamping these same publishing flows as we upgrade many of the key features in the new WordPress.com interface. As we researched the pain points in the experience, we realized that this same feeling of anxiety could be shared by many other people. In fact, our customers often wrote in to request this exact thing for their own blogs.

There needs to be an “Are You Sure” button on the publish section, I’ve accidentally published a blog post too early so many times. — A WordPress mobile app user, writing it to support in 2017.

What if we could make a product change to reduce that same anxiety for everyone? Well, yes — it makes sense. The team also upgraded the blog post preview pane to add in a switcher for screen sizes — mobile, tablet, and desktop — to further improve the confidence in the end result.

Solving this in the WordPress.com editor experience means making it much harder to accidentally publish on any blog. The change enables all of our customers to breathe easier. Like us with the WordPress.com announcements blog — they can now feel more confident that the changes they’re sharing are ready for the world.

The WordPress.com editor screen
Screenshot of the WordPress.com editor screen, showing the confirmation step in the sidebar. Note the opt-out checkbox to remove this extra step if it’s not helpful.

The WordPress.com preview pane.
Screenshot of the WordPress.com preview pane, showing screen size options. This way you can review your post before it goes live: in mobile, tablet, and desktop sizes.

See also Publishing on WordPress.com for a project-level report on improving this publishing experience written by colleague Shaun Andrews.

For day 13 of 15 of inclusive design, we’ll look at speed and connectivity as an exclusion example. How the trend of “Lite” apps built for certain markets to drive adoption brings needed improvements to everyone.


About this Inclusive Design series In 3 days I’ll give a talk on inclusive design at WordCamp Phoenix 2018. Leading up to the conference I’m publishing notes on voices, stories, products, and other resources: everything I’m learning about this emerging practice. This is day 12 of 15. Read more about the series.

Inclusive Design, Day 11/15: OXO Figured It Out

This is day 11 of 15 in a short series on inclusive design. If you missed earlier posts, see day 1 here or view the full list.


The “OXO Good Grips Story” is an astounding example of inclusive design, solving for one and extending to many. An opportunity that grew from one person’s kitchen solution into a $60 million business.

A view of the original kitchen vegetable peeler made of metal.
The original peeler is made of sharp metal.

Sam Farber — who created Copco enamel cast-iron cookware in 1960 — later developed what is now the quintessential OXO kitchen peeler from seeing his wife struggle with the classic shape and size of metal kitchen tools. He solved her pain by creating an ergonomic and comfortable grip that even people with arthritis could use. Turns out everyone else loves it, too.

The idea was always, from the start, to make useful products for people of all ages and levels of dexterity. We can improve every day life for people, without them even knowing or thinking about it. — Sam Farber

Watch the video, “Objectified: Smart Design OXO Good Grips Story,” for a behind-the-scenes look at OXO’s product development process and inclusive mindset.

Read more history in a case study from The Center for Universal Design: OXO International Becomes a Universal Design Icon (2000).

A view of the OXO peeler with an ergonomic handle.
The OXO version of the peeler in good design for everyone.

For day 12 of 15 of inclusive design, I’ll share about reduced anxiety when publishing to WordPress.com websites. A problem solved originally for one use case by adding an extra step for confidence.


About this Inclusive Design series In 4 days I’ll give a talk on inclusive design at WordCamp Phoenix 2018. Leading up to the conference I’m publishing notes on voices, stories, products, and other resources: everything I’m learning about this emerging practice. This is day 11 of 15. Read more about the series.

Inclusive Design, Day 10/15: Making Your App Accessible Benefits Everyone

This is day 10 of 15 in a short series on inclusive design. If you missed earlier posts, see day 1 here or view the full list.


Making your app accessible to visually impaired users benefits all your users. — Ayesha Zafar on the Invision blog

Taking the principles of inclusive design from idea to action means changing how and what we design. A reminder that technical details matter as much as the intention.

Via the design.blog/inclusive checklist under “Building inclusion into designs” we see how this relates to accessibility, “There’s no inclusion without accessibility.”

build-inclusion-into-designs.png
Screenshot of the “Building inclusion into designs” section on the design.blog/inclusive checklist.

The amazing thing about doing the hard work for universal access is that the changes benefit everyone. Design for slow bandwidth? It’ll load faster for all people.

Here’s the full text for this checklist section, for reference:

There’s no inclusion without accessibility. Accessible designs will present differently depending on the medium you’re working in; consider physical, visual, auditory, financial, and other factors as well as an individual’s temporary or permanent limitations to accessing each. Is your video accessible to someone with hearing impairment? Is your website accessible to someone with a low internet bandwidth? Is your copy readable by individuals with different education levels, for whom the text is in a second language, or who are new to the subject matter? The more contexts you consider, the more accessible and inclusive your designs will be.


For a real-life example, I love this in-depth look at providing an accessible mobile app experience for visually impaired users by product designer Ayesha Zafar. Written for Invision, makers of software for digital designers. To understand inclusive design at both the highest level, the why — means you then need to deliver at the detail level, the what and how.

Read the full article to learn about: How to Design Mobile App Experiences for the Visually Impaired.

Screenshot showing the Invision app experience of inclusive design
Screenshot showing the Invision blog article about inclusive design applied to visually impaired mobile app users.

Ayesha also wrote a similar guide — focused instead on blind users — that’s also full of accessibility tips and inclusive design principles: How to design accessible mobile experiences for the blind.

Image of Ayesha Zafar saying
Ayesha Zafar says “empathy is key when designing app experiences.”

On a digital product team it is everyone’s responsibility to have empathy for users and thus all users, no matter their ability, should be considered in the design process. — Ayesha Zafar on the Willow Tree Apps blog

Thank you, Ayesha. 💯

For day 11 of 15 of inclusive design, another example of “solve for one, extend to many — accessibility and usability considered first in the design: the story of “OXO Good Grips.”


About this Inclusive Design series In 5 days I’ll give a talk on inclusive design at WordCamp Phoenix 2018. Leading up to the conference I’m publishing notes on voices, stories, products, and other resources: everything I’m learning about this emerging practice. This is day 10 of 15. Read more about the series.

Inclusive Design, Day 9/15: Review of Principles

This is day 9 of 15 in a short series on inclusive design. If you missed earlier posts, see day 1 here or view the full list.


Today I’d like to pause, take a deep breath, and review the principles of inclusive design as I’ve come to understand them.

Here’s the working draft we’re using in Automattic, with a nod to Kat Holmes’s work on Microsoft’s inclusive design toolkit.

1. Recognize exclusion.
2. Broaden perspectives and build empathy.
3. Bring diversity into teams and processes.
4. Solve inclusively for one, extend to many.


 

Kat herself describes these principles of inclusive design superbly in this brief video, from an O’Reilly design conference in March 2017.

For day 10 of 15 of inclusive design, I’ll share a story about making an app accessible to visually impaired users — which then benefits all users.


About this Inclusive Design series In 6 days I’ll give a talk on inclusive design at WordCamp Phoenix 2018. Leading up to the conference I’m publishing notes on voices, stories, products, and other resources: everything I’m learning about this emerging practice. This is day 9 of 15. Read more about the series.