Particle is what I named the theme that I created for my site's refresh. The name randomly popped in my head very early on in my redesign process and I decided to go with it. No hidden meaning or anything like that.
I haven’t historically named a new design of my own, but doing so helped me detach the project from my own identity in a way. Thinking of “your personal website” can be so daunting since it’s tied up in your ego and insecurities, but thinking of “A theme name” and designing for that, provides a good distance to make good progress.
Designing a website for yourself is hard. There are typically no constraints and no deadlines and that’s a recipe for disaster from the very beginning.
That’s why when I started this particular blog 3 years ago, I installed the default version of Ghost and just started writing.
I needed to remove the excuse of perfectionism from my pool of reasons why I hadn’t started writing.
After some time had passed, I customized the default Ghost theme, Casper, with a few of my own tweaks, but it was all made of hacks on top of the default code base. That always bothered me.
With this new version of the site, I decided to rewrite a new theme completely from scratch. Very early on I called it Particle and the name kinda stuck.
Earlier on I created a few designs in Sketch when the urge to redesign would strike, but produced nothing that I loved.
Then just a few weeks ago, after doing a solid two or three days of nothing but writing. I got really engulfed into iA Writer’s font, Nitti. This led me to digging deep into ia.net and then eventually to the Nitti font’s website.
I got really into the idea of using a Grotesque sans-serif for body copy, even though I know for longer form writing it’s often better to use serifed fonts for readability’s sake.
I explored using FF Basic Gothic from Typekit for a while and then my studio mate, Mattox Shuler, told me about Work Sans.
I went back and forth between Basic Gothic and Work Sans and ultimately went with the latter. *It’s got a slightly quirky personality with nice readability in body copy. Plus I’m a sucker for a big fat heavy weight—the one I’m using for the headings.
*Update: I changed my mind and starting using Georgia. Coincidentally my home state, and a nice readable serif that's stood the test of time.
I almost didn't use Work Sans, because there's no true italics. I don't want the browser faux-italicizing the nice typeface, so for all instances of <em> I'm using a system font stack that defaults to...
em { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif; }
...a technique I stole from Medium.
I also used Mattox’s new monospace font Native, as the small helper text sprinkled throughout the site.
Dealing with lots of typography elements like headings, paragraphs, blockquotes, and more is slow-going in design software, so I decided to jump straight into the browser and design with Sass for this next iteration.
Tweaking font families, sizes, weights, and styles is much more efficient in the browser than any other method.
Because of this, I began the new design by starting with the navigation. I tweaked and tweaked until it was working good across all sizes.
Then I jumped into the post detail view and styled as any elements as I could that I new would be in past or future posts.
Every other page beyond the post detail, is a slight variation of the same basic layout, so only minimal markup and style updates were necessary.
I finished most of the front-end code in just a few days. Funny how quickly you can power through work when you’re really into it.
Then I had to make a few more adjustments once I started chopping up the new code into a theme.
Integrating with Ghost
This is the first development project I’ve tackled where I integrated the custom front-end code with the CMS all by myself.
It was a pretty smooth process overall and super fun. You’re supposed to have fun, right!?
MDS Monday Mailer
Another thing I’ve been meaning to do is publish, publish, publish. I’ve given a half-assed attempt in the past with moderate success, but I’ve always wanted to do more.
So when I put this new version of the site together, I decided to commit publicly to producing new content every week and distribute through my email list.
The truth is…
No one cares about me wanting to publish more and committing to sending something new every Monday, relatively speaking, and I totally respect that.
However, it’s still a pretty strong motivator to tell people you’re going to do something. At my core, I’m a very loyal person, so if I feel like I’m going to let someone down and it’s my fault, I will go great lengths to ensure that it doesn’t happen.
I also built the site with that sole purpose in mind. The form to sign up is on every page. That’s the goal, get people to sign up and deliver my very best for that audience.
It’s one of the most rewarding things for me to receive an email from someone whose letting me know how much I was able to help them along their path. Seriously, I can’t get enough of that.
So, if you want in on the Monday goodness, scroll down and get on the list.
If email lists aren’t your thing, but you still wanna chat or get some questions answered or something like that, please hit me up. I’d be happy to help!