Breaks

When you enjoy your work there can be a natural bent towards encouraging it to become all absorbing. This can also happen if things are going very wrong at work. 

Last week I was really inspired by a book from the guys at Basecamp. This, along with the writings of Cal Newport, has given me the head knowledge to recognize the need for setting boundaries in my work and my life. However, an intellectual acceptance of something, and even at times wholehearted actions to take things in that direction, isn’t always enough. It’s easy to get busy, to get into your work and not come up for air. 

Over the past two weeks I’ve gone back to practicing a separation. On Friday afternoon I stop my work, and I don’t check email or Slack until Monday morning. In addition, each afternoon after work I turn off Slack and email (notifications especially, I don’t have those anymore) and don’t check until morning. If previous attempts at this are any indication, the most likely culprit for falling back into previous patterns is an upcoming event or deadline. 

My goal is to see if I can identify the things that trip me up and work to prevent them. If I’m able to stop thinking about work when I’m away from it, I can focus on other things I care about; leaving me fresh and ready to tackle work again the next morning. 

Building AMP Stories in WordPress

A few months ago our team at XWP was tasked with the challenge of building AMP Stories in WordPress. We began working with the team at Google to come up with an initial minimum viable product.

Following are some of my messy sketches showing our process and what it took to move from the initial idea to a released product. I find sharing the process is as important as the final product as it shows the thought and deliberation that went into it, and helps open up discussions for further improvements. 

The project

We didn’t have an unlimited period of time to work on it, so we knew we’d have to work quickly to try out some ideas and create a shippable beta for sharing with users and stakeholders.

AMP Stories are a mobile format for sharing articles and content in a tappable way. They’re similar to how Instagram Stories function. The idea with bringing this format to WordPress is anyone using the AMP for WordPress plugin would be able to create their own stories without needing to code a custom solution.

At the start of the project it made the most sense to build the interface for AMP Stories using Gutenberg, a soon-to-be-released editor for WordPress. This gave us the opportunity to work with a new editor and pave the way for experiences that could improve Gutenberg as a whole.

My role on the project was to design the user experience. I worked closely with several of our team as we all brainstormed and looked at ways to make this happen. The initial problem was around AMP Stories themselves. At its most basic an AMP Story has several parts to it:

  • A bunch of pages
  • Layers inside each page
  • Elements inside each layer

An AMP Story can be as few as one page, and could easily number 10-50 pages. We needed to somehow match that to the block interface in Gutenberg. 

Initially this felt right, like it should work. However, we weren’t quite sure how easy it would be for someone to build a story using this editor. We also didn’t want to introduce unnecessary complications for users.

If you’ve ever used a program that has layers built in, such as Adobe Photoshop or Sketch, you’ll be familiar with the concept of hiding and showing layers in a way that allows you to manipulate content. Below is a sketch showing the elements that might normally be shown in a layers palette. 

We knew we’d need to make sure it wasn’t too complicated to edit pieces of one layer without overwhelming users with things on other layers.

With this idea of trying to match all the parts of an AMP Story to the available parts in WordPress, I began sketching ideas for the interface in collaboration with the rest of our team. Products like this often require lots of iteration before we can settle on a solution.

So, I tried out a bunch of ideas.

The process

If you follow the initial conversation on Github, you’ll see that we started by wrestling with the concept of the story, the pages within the story, the layers, and elements in the layers. This first sketch, color coded accordingly, attempts to figure out what that interface could look like.


And here is another sketch thinking through that concept further. Please note that for the sake of brevity I’m skipping a few things. 

From the first few sketches and ensuing conversations I was feeling like I had figured out the problem, and was itching to go from simple sketches into a more complete design (using Balsamiq wireframes). 

As I’ve shared before, this is ok to do, but be cautious! The moment you go from a simple form of visual sketching into something that’s more detailed there’s some risk. This is called going from low fidelity to medium fidelity (and then eventually to high fidelity). The problem is you’ll sometimes get so stuck in something you’ve spent hours building that it’s hard to scrap it if things are going wrong.

I was thinking that the layers and blocks could fit into a tab interface right on top of the story. That sounded right in principle, but in reality it didn’t make sense when I shared it with the team. 

I tried some other ideas, and we also agreed that pages shouldn’t be in a tab, instead they should just go down the page as linear blocks; reducing one extra user element, that’s good!

Well, after chatting with the team we realized this wouldn’t make sense, it was still too complex. I even created a bunch of screens and showed a video walkthrough of the user journey. It wasn’t working. So I went back to simple sketches again. 

This is where we landed on a concept that made it into the final product. We knew we wanted a way for users to be able to select different layers and elements, and knew it’d be important to make that visually simple, so we added small layer cards next to each page. Viola!

We had further discussions to make sure we were on the right page, and decided we were headed in the right direction.

We started getting the idea of the layer cards a little bit more fleshed out. One design element I hoped to simplify with the card icons was the types of layers. Since a page can have several different layer types (fill, thirds, vertical, horizontal) I wanted to create different icons for each one.  

At one point we had a discussion to make sure the selectability of the layer cards made sense. I sketched out the various selected states. Our idea was that if a bottom layer was selected all layers and elements above that layer should be hidden, to allow for easier editing. 

That was a good idea, but we needed to make sure the layer cards helped with showing which layer was active. 

We finally landed on an idea that felt right, didn’t get overly complex, and was worth building out for real world testing. 

I then took the rough sketches and created a prototype and user journey for creating a basic AMP story.

From there our team was able to develop this into a beta feature for the WordPress for AMP plugin with Gutenberg as the platform. You can also view a clickable prototype of the work in Adobe XD. 

Conclusion

This was a wonderful project to work on. The team was great to work with and we created a useful MVP within a short period of time. The work was built using our own expertise, best practices in UX in WordPress, as well as feedback from a handful of folks. 

Projects like this are always challenging and fun and offer opportunity to figure out the best thing to build with as simple of a user experience as possible. 

If you’re curious and want to try it out you can download the latest version, keep an eye on XWP’s blog for an updated post. 

31 Candles

Tomorrow I’ll be turning 31. Instead of writing about being 30 at the start of the year, I want to share my thoughts on the last day of it.

I could speak directly to experiences in my life (I’ve had many wonderful ones!), things I’m thankful for (the list is long), or people who mean something to me (close connections have made me who I am). Instead of that, I want to touch on a few points today that have impacted me deeply: 

  1. Comparing yourself to others – It’s easy for me to look at others and compare myself to them. I could use another’s station in life to mentally push them down in order to lift myself up. I could look with jealousy at someone who, from my viewpoint, has it better. All of that is pointless, and damaging to relationships and my sense of self. Instead, my goal is to strive to be the best version of who I’m meant to be. If there’s to be any comparisons made, it should be between where I’ve come from and where I intend to go. My journey isn’t the same as anyone else’s, and to create comparisons isn’t healthy or accurate. 
  2. Leadership qualities – For me leadership has been an interesting thing to discuss and an odd ideal to pursue. We can talk about servant leadership, micromanaging bosses, or absent managers. In my experience a little book, “Turn the Ship Around!”, has been one of the best pieces of advice on the topic. A true leader looks to create leaders that think one level higher than their rank (in a naval context). Instill in others autonomy and guidance to make their own decisions, then back them up or gently steer them in the right direction.
  3. Striving in your career – Without vision you won’t go anywhere. There’s an interesting point between going all in on an idea, fully invested, versus not caring or simply holding back. Over the past year I’ve seen opportunity to push the boundaries on things I’ve believed in. The results, while not what I expected, have still brought about answers that can move things forward. The takeaway for me then is: in the work you pursue strive to do something worth doing, go big, be daring. However, in the doing, don’t invest all of your being into that work, keep a part set aside for your outside of work life. 

This life is a special one that we’re given. I want to use it to build relationships that matter, and help lift others up. 

Pausing

Anxiety doesn’t generally come from making decisions, but rather from the time spent deliberating on whether to make a decision. 

At a certain point there’s enough information gathered, and a choice should be made. That choice isn’t always Option A vs Option B, but could include Option C all the way to Option Z. 

If you’re struggling with a decision, use the best data you have now and decide (even if that means intentionally deciding not to act, just be direct about it). You’ll be wrong sometimes, but the anxiety of it will hopefully lessen.

On good communication

You can tell someone what you’re thinking, and convey that in a way that you believe is correct. But that’s only a very small part of what it means to communicate something. 

Communication happens through the words you choose to say, the words you leave unsaid, the way your words are shared, and the language your body is presenting (if you’re in person). You also communicate through the way you approach a project, how you talk to your team members, what you choose to share publicly and what is only said behind closed doors. 

You also communicate through built up trust over an extended period of time. If a close friend tells you something that’s hard to hear, but says it in just the right way, it might have an impact. If a coworker with a bone to pick says something in a spiteful manner (even if they’re right), well you’re unlikely to take much notice. 

All of this, and more, is important to keep in mind when trying to share your thoughts. It’s the responsibility of the sharer to convey what they mean to share. 

Writing

Writing down an idea is a way to gather your thoughts and think through a problem. It’s also a way to decompress after a long day. 

I’ve found over the years that I need to get out what I’m thinking in some form. Sometimes that comes down to sharing with a close friend how my day or week went and breaking down the pieces that occurred. Other times it means writing a daily update and sharing with my team. 

Then, sometimes, writing means taking the idea or concept I’ve been struggling with and retooling it in a way that I can share more publically. Sure, this could benefit someone else reading this, but more importantly it’s an outlet for me to add some structure to my thoughts. 

If you have found this helpful, or have any specific feedback, feel free to reach out! 

Working with people

You run into an interesting situation the moment you introduce more than one person into a project. Whereas at the start a project may have been from the mind of just one, now you have a few folks weighing in. At this point multiple opinions enter into a discussion, and you have to make decisions and tradeoffs based on that. 

This is a good thing. When everyone is pulling together in a healthy tension great things can happen. The challenge is it can be hard for a team to figure out the right balance between that healthy tension and a toxic environment that shoots down the value of everyone’s feedback. 

A lot of teams struggle with getting this balance right, and it’s tempting during any point in the project to think that everyone else is the problem. That’s not the case though. Any company you work at, any project you take on (unless you’re truly the only person) will involve figuring out how to work together with others. 

Recognizing this and just calling out the tension for what it is helps to solve part of the problem. Also, having grace for what someone says, and what they mean, makes a big difference. For example, when someone is trying to explain a concept they are likely to not use the right words for what they’re trying to say. Or, they might say something that’s incorrect, or that you disagree with. Having grace and patience means you’ll accept their intent, or question what they said, and find a way to work together.

If you start counting remarks as points against a teammate, and holding onto those as fighting points, then collaboration and mutual support will start to break down. 

Getting this right is hard. But it’s something we must figure out if we want to succeed in our work. 

Two sides

There are times when you’re presented with two opposing views. Surely two sides of something can’t both be correct at the same time, right? 

Life usually isn’t black and white on everything. If you’re trying to figure out the best way forward on something, and are looking at multiple options that seem to have no clear crossover, then that’s where the hard work of making decisions has to come in. 

It’s important when presented with all the information to make a decision. Then be willing to change that decision if it was wrong. 

What do you do with the insanity?

Five projects are due next week. You’re a blocker for two teams across four of those projects. You need to hire three new team members to handle all the work going on, but you have no time to find that hire. 

What do you do?

You could work 12-15 hour days. You could find a new place to work. Or you could ignore most of what’s going on, focus on one or two things at a time, and deal with the fallout. Sometimes that last option is a decent one.

Here’s the thing. There’s not really a great answer. We all find ourselves in situations where there’s too much to do. In no particular order, here’s how I’ve found ways to deal with the insanity:

  • Take a break – Every seven days, on Saturday, I completely disconnect from work. That means I won’t check my work email, Slack, Github issues, design updates, attend business calls, business conferences, etc. It’s a solid rule I’ve made for my whole career, and it’s one of the reasons I’ve kept from getting fully burned out. At times I’ve gotten close, but there was always knowing Saturday would come and I could disconnect for 24 hours. 
  • Get help from your team –  It’s tempting to think we’re the only person in the world who can solve a problem. That’s not the case, not at all. If you work with others, or even if you’re completely on your own, chances are there’s someone out there who can help you. 
  • Force constraints – Find a way to shrink the amount of work. There’s usually somewhere that fat can be cut without compromising the integrity of what you’re building. 
  • Don’t overwork for too long – We’ve all done it where we worked a ton of hours for an extended period of time. The reality though is the quality of work absolutely suffers the more time we put in without rest. Sometimes it means deciding you’re done for the day and getting a full night’s sleep to tackle the problem with a fresh set of eyes.
  • Be nice to yourself – You’re amazing. You’re doing wonderful work, you believe in what you’re building, give yourself a bit of a break. It’s going to be ok. 
  • It will be ok – Yes, this is worth repeating. You’ll get through this. Keep up the great work!

Getting away

On Friday I stepped away from work. Lots going on, but I had done what I could to get things in place for Monday. And with that, for the most part I was off until Monday morning. 

On Saturday our family spent some time in the afternoon hiking with friends out in nature. Part of that hike involved walking out onto a walkway into a marsh. It was beautiful.

The smoke (it’s getting better) in Washington lent a hazy yellow to the atmosphere, dulling the colors and adding a feeling of warmth to everything.

Looking back I have some wonderful photos of the kids, and a feeling of just getting away and taking a break. 

That’s important. We need times like this.