The main task of a Theme Wrangler is to create themes for WordPress.com. Thomas Guillot tells us a bit more about himself and what he does.
Hi Thomas, can you tell us about how and when did you become a “Theme Wrangler”?
After I graduated from University in 2012, I got a job at a web agency in London. I was working on WordPress Premium Themes for ThemeForest. The company switched goals and I ended up doing more custom themes for clients which I found too restrictive and less enjoyable.
Creating themes for the millions of users at WordPress.com was appealing so I applied to Automattic. My official first day was 24th June 2013, and now here I am, four years later!
That’s a long time making themes! Have you seen any changes?
With the way we build themes, my answer is going to be very short and simple: No. We’re still doing the same things, HTML, CSS, PHP, JS.
Having said that, the type of themes we create on WordPress.com has changed over the years. Our focus is now to create fewer and simpler themes: fewer theme options, no overly complicated home page setup, just easy to use, out-of-the-box themes. We are receiving positive reactions from our users and from our Happiness Engineers.
I also want to mention the rise of page builders. It is currently having a certain impact and, I’m pretty certain the way we are creating themes will soon change with the rise of Gutenberg. It’s exciting!
There are many Theme Wranglers at Automattic, do you share the same code base when creating a theme? What about consistency?
We all start a new theme using Underscores as a base. There might be some slight differences with the code since Underscores is an open-source project and is always being updated on GitHub but we all share a fairly similar base.
We have been working hard on providing consistency for our users. Now, all our recent themes must follow the guidelines we have established. It’s still not perfect, but we are working on it. There’s a great article written by one of my colleagues, Laurel Fulford, that I would invite you to read.
Tell me a bit more about your process. How do you create a theme and what are the stages?
Everyone’s process is different so I can only speak for myself here. I will start with a very basic benchmarking for the type of theme I’m going to work on. I will get inspiration here and there, looking at various websites and then start to create a rough mockup using pen and paper.
Once I have a general idea, I will then work on two very important steps: typography and vertical rhythm.
In the past, I used Google Fonts for all my typography choices. I spent days trying to find the perfect font combination. I am now using system fonts as much as possible to improve the speed and performance of my themes. WordPress.com users can choose a custom font via an option in the Customiser if they want to.
The vertical rhythm defines the grid of a theme so I tend to spend a lot of time working on it. These are two great articles on the subject:
- Why is Vertical Rhythm an Important Typography Practice?
- Were We Wrong About Vertical Rhythm All Along?
My custom spreadsheet
To define the vertical rhythm I use a custom spreadsheet. I like having full control of these numbers but I know there are some tools out there, like Gridlover or with SASS, to help you achieve that.
Once the typography and vertical rhythm are defined, I will then start to select the colours. I tend to use Dribbble for inspiration about colour combinations. I also double-check the contrast ratio against WebAIM Color Contrast Checker.
When I’m happy with the typography, the vertical rhythm, and the colours, I can start building my theme directly in the browser.
I always develop the theme on my local environment – I use Laravel Valet – before moving it to WordPress.com where I can finalise it.
The theme will then be “broken” – thoroughly tested – by someone from the team to find the last remaining bugs. I will do some user testing if I am introducing a new feature or targeting a new type of user. I will write the documentation which will then get reviewed. I can then finally launch the theme.
Do you have any websites or tools that you would recommend for inspiration?
First of all, I use a Chrome extension called Panda where I have a full-screen Dribbble view on a new tab. I can spend quite some time scrolling down.
I regularly check FWA and Awwwards.
Also, I have a bunch of sites that I follow, either on Twitter or via RSS Feed: Smashing Magazine, Sidebar, Web Designer News, Codrops.
And more recently, I have discovered Font inspiration which I absolutely love and I can highly recommend it for any lettering, type, and font aficionados.
Photo: Matthew Henry – Burst
AUTOMATTIC DESIGN (FLOW RIP) 