Wolf X Machina

Back to blog

My foray into marketing myself

Posted in Announcements on December 17, 2018

As primarily a front-end developer, most of my job is taking other people's work and assembling it and sometimes refining it to make it a bit better. For my own business, it was time for me branch out a bit and try my hand at marketing my services on my website. If you're looking to improve your marketing campaigns, I hope my attempt can help give you a starting point. The finished landing pages are at the bottom!

Here are the steps I took to create three landing pages for my marketing campaign:

1. Writing out the idea

I spent perhaps the most time simply thinking about and then writing out the entire idea. I started out by asking myself "Who am I trying to attract and how will I try to appeal to them?" Then I worked on telling a story with the page. I started with an introduction, moved to a value proposition, services, testimonial, and a call to action. I put in a couple of sections at the bottom to redirect users who were on the wrong page to their respective page, but also posts from my blog. I even came up with the URLs at this point. I wrote a document using Basecamp 3 and revised it many times to make sure that what I planned to build would be complete. I wanted to make sure the idea I had was worth developing before I tried to make it real. I reviewed this idea over and over to make sure it was something I got excited about and during those reviews I refined it so I had a solid plan to follow through with.

2. Copywriting

Definitely the hard part. Before even getting into the design phase, I spent a lot of time writing out the content for each section. Each edit, trying to make it both concise and convey a lot of important information. Even today, I still think I could make this better but I'm content with what I have now. Because I had laid out a "story" in mind, it made it easier to write copy. I started with a beginning, a middle, and an end. Knowing that I was creating three different landing pages for three different audiences also helped. Because each page has a different audience, I don't have to write to appeal to a lot of people - I can write to speak directly to an audience that will know what I'm talking about.

3. Sketching the page layout

Once I had the idea and the (rough) words in place, I took a thick black Sharpie and a couple sheets of blank paper and I sketched out the layout. This was a really fun process because it's very creative but with guidelines. Luckily for me, I already have a header and footer already in place so I only needed to focus on the content. As I sketched, I focused mostly on telling the story to the audience and trying to design for how I want them to experience the landing page. When it came to sketching out the content, I just made squiggle marks that indicated a piece of the content from the copywriting section would go there. If there were times where it felt like I needed content but didn't write copy for it, I would put in the squiggle mark anyway and then go back and update my copy to reflect that. Because the sketch and the copywriting feed each other in a way. Once I finished sketching everything out, I reviewed it to make sure that I was happy with the flow of the page. One of the most important things in this phase was that I was creating a very enticing call to action. So I decided that a form would do best.

4. Designing and prototyping the wireframe

Now that I had a sketch ready, I went into my website and started fleshing out the wireframe using HTML and CSS. Instead of using lorem ipsum, I used my copy that I wrote. I intially looked into hiring a designer to design the page but I wanted to do the design myself so I opted for that. If you're not a designer, or don't have experience in design, I would highly recommend employing a designer for the job. This will help immensely. 

In the beginning of prototyping, it was tempting to try out layouts and different copy but I kept telling myself to stick with my copy and my sketch because it was faster to build something that I planned and then to refine it. So that's what I did. I built the prototype according to my copy and my sketch. I even made it mobile-friendly so I knew exactly how the experience would be for all types of users.

5. Making the prototype real

Development time! This is the step that I'm usually hired for so I had a blast doing this. I took my prototypes and I created the real content sections in 2SXC. I made a snazzy call to action form with Action Forms and tested it as a user and refined the emails that get sent out. I put in meta page titles and page descriptions. (Apparently keywords are no longer necessary). I optimized my images.

6. Revising the content and reviewing

Once I had that in place, I started to refine. I found that there were countless ways I could improve both the content and the layout so I made many revisions to constantly tighten things up until I was happy with it. I changed wording on some things. On other things I completely re-wrote entire sections. I cropped screenshots and photos. I even had a graphic designer create custom icons for me to add to my brand's visual identity and to make it just that much more interesting.

7. Launching and marketing

Before I marketed the pages, I quietly published them on my own website and had colleagues and friends review what I made. I got some really insightful advice and I took the good advice and made minor adjustments. It was important to me to only present a near-completed page because I wanted people only to evaluate a fully realized concept, not just an idea. I asked a marketing colleague of mine and she gave me some wonderful advice for marketing that I'm looking forward to trying. Specifically, blogging about tangentially related things and then inserting a link to the respective landing page.

Without further ado, here are the finalized pages:

  1. Web development for designers
  2. User interface development for programmers
  3. DNN development for people who manage DNN websites

I hope that my experience was insightful for you! If there's any way that I can help you, please feel free to send me an e-mail at aaron.lopez@wolfxmachina.com.

Happy marketing!

Aaron Lopez

Aaron Lopez

Founder & Lead Developer at Wolf X Machina

Wolf X Machina

Next Level Interface Development for the DNN CMS

DNN themes, module design, and more from Wolf X Machina.

Learn More