Redesigning This Blog Based on Components

Around the end of June, I decided it was time to redesign my blog. On a flight back from Disney in Orlando, Florida, I opened up Sketch and began crafting a new design.

This is what I came up with:

I’ve always built my WordPress theme from scratch. I like having as little code as possible, speed, and hand-crafting custom CSS. I’m not against frameworks, I just choose not to use one for my own site. More on that in a future post.

Then I let the design sit for a week. Great.

I was also stuck on what I wanted the mobile layout’s navigation to look like. I still have work to do on that. That’s fine. Ship it. Iterate. Repeat.

Evolving the Approach

In the past, I would have taken my own mockup, put it in Zeplin, and then start coding out the CSS from the top down. However, this time, I decided to try something different: I would look at the code as components. With this task, I was not only creating the HTML/CSS but also cleaning up the PHP & HTML that makes up the current theme.

The site would consist of: the main template structure, a blog template, the main navigation, a blog topic navigation, the search bar, a social media cluster, and the blog post content area.

To build momentum, I started out with the smaller components. Doing that ends up being a quick win, which gives you a boost of creative energy. Then repeat and knock out another; repeat it again.

Solving Complex Problems & Dispelling Anxieties

How’s that for a headline? Rolls right off the tongue. Let’s dive into creating solutions, getting rid of clouded thinking, and making forward progress.

Artfully Frustrated, Again

There are times where I find myself being Artfully Frustrated, again. I have to remind myself that others experience this, it’s a sign that I’m still growing, and to push on forward.

That frustration comes from a drive to constantly be improving. As with all things in life, there is a balance. When that drive escalates to perfectionism, then it can be a problem. Dysfunctional perfectionism is at the heart of depression, anxiety, workaholism, procrastination, and suicide.

How do we change for the better? By focusing on what we do have, being thankful, expressing gratitude, and being authentic.

Authenticity & Gratitude

Authenticity is the daily practice of letting go of who we think we are supposed to be and embracing who we really are.

When we are focused so hard on expectations, even those that are imposed by our own self, it leads to anxiety.

Instead, we should trade those expectations for appreciations.

The best way to get rid of that worry is to express gratitude. The two can not coexist.

In the book Flourish, author Martin E. P. Seligman suggests keeping a gratitude journal or the Three Blessings Journal. At the end of every day write down three things that went well and why they went well.

When I worked at the Apple Store for a summer in 2010, we were trained to ask customers open-ended probing questions. It gets at the heart of why a customer is shopping and how best to meet their needs. This Forbes article paints a clear picture:

Probe politely to understand all the customer’s needs. This simply means to ask a series of closed and open-ended question so you can match the customer with the right product, not the most expensive product. In the Apple Store, a closed-ended question elicits a simple yes or no such as, “Will this be your first Mac?” An open-ended question is more general and gives the sales associate (specialist) more information to guide the conversation. For example, “What will you be using the iPad for?”

Asking why probes further and gives clarity. That’s why we do it in the gratitude journal. I’m thankful for my brother. Why? He is always there to talk with me when life seems overwhelming. Even further…Why? It’s great to have someone to talk to when you feel alone in your experience.

Finding What Challenges You

In an interview, Neil deGrasse Tyson talks about science boosting the economy. He goes on to say, most companies and politicians don’t have the tolerance for the long term view.

You don’t motivate a group of kids, saying “Who wants to be a mechanical engineer and help improve flight efficiency by 15% compared to the airplane your father flew?”

But instead, ask “Who wants to be an engineer and help develop airfoils to help fly in the atmosphere of Mars?” With the latter, you get the best students in the class.

Flow is the intersection of what you are good at and what challenges you— where difficulty and competency meet.

When your competency exceeds the difficulty of a task, you are bored. And when the difficulty exceeds your competency, you are anxious. That was my problem: I was bored.

— Jeff Goins, The Art of Work

There are times where the day job requires me to do the mundane. That’s fine. We can’t always have constant excitement. It’s called work for a reason.

For inspiration, this is one of the reasons that I have side projects. To keep pushing my limits. It allows me to play. To find out how to make user interfaces for VR, tinker with implementing the Acelerated Mobile Pages Project on content, create a landing page for Snapchat, write books, and so much more.

These all funnel back into the collective of who I am. When you hire me, you get a wide variety of experiences. All of which have added something to my career over the years.

Brilliant Iteration

The wonderful thing about design concepts and patterns is that they can be reused. Whenever you hit on a core idea, it can be expanded to many different applications.

Recently, Apple has introduced Force Touch or haptic feedback into their products.

On the iPhone, as you press harder, you get a slight buzz on your finger and then a contextual menu pops open for a given app. As well as a feature called “peek and pop” that allows, on a harder press, the app to render a bubble with a contextual preview.

On the Mac, when you “click” something, the trackpad feels as if you are pushing it down, but it’s not moving. The click sound is coming from the speakers. It is tricking your brain into thinking that there was a click.

Do it tired. Do it anyway.

One of the stories that really stuck out at me in the book Flourish, by Martin E. P. Seligman, was that of how snipers are trained by the government.

It can take about twenty-four hours for a sniper to get into position. And then it can take another thirty-six hours to get off the shot. This means that snipers often haven’t slept for two days before they shoot. They’re dead tired.

Instead of medication to keep them awake, he goes on to say,

…you keep them up for three days and have them practice shooting when they are dead tired. That is, you teach snipers to deal with the negative state they’re in: to function well even in the presence of fatigue.

When you are feeling tired, push ahead. Do it anyway. Do it tired.

You may be surprised to realize that this too is temporary. It ebbs and flows. Don’t give in.