It’s an understatement to say that the C-word has well and truly turned every aspect of our lives upside down; work being no exception. For those of us making a living in the tech industry, working remotely has been a relatively easy transition from office to — well — home office.

The combination of working on a digital product and having a decent WiFi connection means many of us can happily sit in our PJs eating Nutella from the jar, judgement free, and occasionally get on with some work in the process [See helpful literature regarding working from home and not being a complete hot mess here].

However, the one* thing I really do miss about roaming freely in the office as a product designer (and human being) is talking to people face-to-face. In particular, pairing with awesome software developers. Not only will this article explain how pairing has adapted during COVID-19, but also highlight how crucial the process is if you want to deliver great products.

Okay I lied. I also really miss the free snacks when someone comes back from their holiday 🍪👀🤷‍♀️

What is pairing?

In a nutshell, pairing means teaming up with someone to tackle a problem together. We only have to look at the likes of Bonnie and Clyde, Simon and Garfunkel, or Spongebob and Patrick to see that two masterminds are definitely better than one.

Despite pairing being a more common practice in the world of software development, it is certainly applicable to designers and developers too.

In fact, when these two disciplines work harmoniously together they are a force to be reckoned with.

Typically, a design and development pairing session happens once the developer has built a feature/page which is ready to be reviewed before releasing into the wild.

Pre-COVID Pairing

The Process
Back before toilet rolls were frantically flying off the shelves and when commuting involved being closer to strangers than your family members, face-to-face designer and developer pairing was a seamless process which went a little something like this:

Step 1: The design is shared with the developers using Figma. Here, multiple colleagues can view and comment on designs simultaneously, keeping communications lines open, and developers can delve into the CSS using the ‘Code’ panel. Can you tell that we love Figma?

Figma’s cheeky little code panel on the right hand side 🤓

Step 2: A staging link is sent to the designer (that’s me) to cast their beady design eye over. At this point, I will:
a) Make a note of any design changes. These design tweaks should be frictionless, and often stylistic, as opposed to completely changing the behaviour of a page or feature.

b) Schedule some uninterrupted time with the developer to sit and go through these changes together.

Other, less-scrappy note taking tools are available 🗒

Step 3: Physically sit together, viewing the same screen and work through the design changes whilst having an open and honest discussion.

That last bit is super important — you don’t want to feel like a dictator, plus hearing the expert opinions of others is always valuable, whatever stage of the process you are at. If you didn’t get through it all in the time you’d allocated don’t fret, schedule in some more time or, if you’re up against the clock, make some compromises that you’ll agree to revisit later and factor them into the next sprint.

The Pros of Pre-COVID Pairing

• It is much more time efficient to have a face-to-face conversation. It is also more likely to prevent miscommunication. In previous roles, I’ve worked with Sketch to create designs, and Zeplin to communicate said designs to developers. Relying only on software or online tools to communicate really felt like I was chucking the designs over the wall and wishing the developers all the best in their endeavours.
• It allows you to develop a stronger cross-discipline relationship. Having conversations with developers as well as your immediate design team may make you think about solutions you never even realised were a possibility.
• You’ll become a better designer. Sitting with developers means you’ll naturally start picking up their language, which in turn has a knock on effect of improving communication between the two disciplines. I’m not saying you need to be fluent in coding in order to pair together, but you’ll start noticing little differences in how you articulate your changes. As a trainee UX designer, I’d sit with developers and request unbelievably vague changes* like, “Make the spacing a bit smaller on the left-hand side”, or “I reckon we could do with moving that title up a bit”. Thanks to better pairing experiences, I’m confident inspecting the design and articulating changes in a much clearer way — e.g. “Change left margin from 16px to 8px”.

*Hi there, BBC Sounds Engineering team. If any of you are reading this, I’d like to apologise for putting you through my wishy-washy reviews as a trainee 🙃

The Con(s) of Pre-COVID Pairing

• The act of scheduling in time to pair can sometimes feel too formal or unnecessary. If you’re both free and sitting near each other, and already discussing the project, just crack on with it.

Post-COVID Pairing

The Process
From the point of view of a chatty designer who thrives on face-to-face interaction, I initially found the idea of remote pairing daunting. Sure, we’d paired remotely on occasion when colleagues were working from home, but this was next level. Thankfully the incredibly talented software development team at Culture Trip make the whole process an absolute breeze. Our new way of working goes a little something like this:

Step 1: Similar to before, the design is shared with developers using Figma, is built on staging by the developer and shared with the designer to review. In this example, the feature being built is a carousel at the bottom of a page to give users the option to view more things to do on their travels, as opposed to reaching a dead end at the bottom of the page.

The carousel in all its glory 🤸‍♂️

Step 2: Rather than jotting down changes in note form, I’ll put together a more comprehensive design review which:

• Clearly outlines the change in written form
• Specifies the breakpoint where the change will be applied
• Provides ‘current’ and ‘expected’ visuals to accompany the description, or a screen recording when changes relate to a transition or moving element

This may feel excessive however when working away from one another communication needs to be crystal clear.

Being thorough AF with design changes in Figma 🔍

Step 3: This is shared with the developer. We then schedule in time to discuss any outstanding changes that they’re unsure about remotely, whilst sharing our screen.

Sharing is caring 💻

The Pros of Post-COVID Pairing

• If you use Slack to screen share (other communication platforms are available) then you can doodle all over the place with their crayon tool, which is great when you’re struggling to get your words out at 9am after having stayed up all night binge-watching Tiger King 👀
• The basis of what we do is all on screen. Therefore theoretically, with the right tools at your disposal, there is no need to be physically present.

The Cons of Post-COVID Pairing

• It’s more effort for the same outcome — many conversations, and this applies to life in general, tend to happen more fluidly in person.
• It’s easier for feedback to get lost in translation. Remote pairing often relies on both of you being strong verbal communicators who can articulate thoughts and ideas fluently. Sometimes this can be challenging over WiFi when you don’t have a visual point of reference that you can physically point at, or two screens you can compare side-by-side.

As disruptive as COVID-19 has been, it has helped many companies find inventive new ways of working together — ways that perhaps we should have been adopting regardless of a deadly viral outbreak.

However, it is comforting to know that as the office landscape continues to shift around, we’ve managed to effectively adapt and deliver ace things in unbelievably difficult circumstances.

Pairing has been — and always will be — a critical role in the process, whether it’s done face-to-face or through a screen. It makes both disciplines think in different ways, it strengthens team relationships, and hey, you might just learn something new while busy perfecting a killer product.

So go on, name me a more dynamic duo. I’ll wait.

Originally published on medium.