AdTech-focused Blog for Freestar

Project Overview

A leader in AdTech and monetization strategy, Freestar was looking to update their website to better showcase their talents and put more emphasis on their blog. I was contracted to bring their website redesign to life with a functional, fully responsive WordPress build that could be handed off for the team to manage on their own.

Some of the highlights of this project included:

• Collaborating with Freestar's in-house designer to implement their designs and prototypes into functional HTML, CSS, and JavaScript
• Building a custom WordPress theme and integrating templates with the CMS
• Leveraging custom post types and the Advanced Custom Fields plugin to extend the site's capabilities beyond basic blog posts
• Implementing features such as the scrolling interactions for the homepage, calculated reading time on blog posts, and an infinite scroll effect with lazy loaded content for the blog
• Extensively testing the responsiveness of the site against a suite of browsers and devices
• Ensuring code was well commented to make it easier for the team to make any future changes
• Packaging up all necessary assets for hand-off, along with documentation on how to get everything set up

Development

Completed designs for both desktop and mobile were provided to me, along with several Invision prototypes to help me understand the desired interaction patterns since I was working remotely from their in-house designer, Aaron Shoemaker, at the time.

My role as front-end developer was to code static HTML, CSS, and JavaScript based on those designs, and then integrate that into a custom WordPress theme that could later be handed off to the client. The site was built in WordPress to allow Freestar's quickly growing team the ability to change and add to the site without the need for a developer.

Some of the key features included:

• Interactive scroll features on the homepage to bring focus to each individual section's content while it was in view
• A revamped blog with lazy loaded infinite scroll effects, a robust tagging system, and custom content styles
• Estimated reading time for each blog post, which was calculated with PHP based on the word count of the post
• Use of custom post types and the Advanced Custom Fields plugin to make it easy for the team to know exactly where the content they want to update is

Client Hand-off

Since I was a contractor for this project, I needed to ensure a smooth hand-off of the completed build to the client. This meant:

• Ensuring that everything had been fully tested across a suite of different browsers and devices
• Organizing the CSS in an understandable way and making use of the BEM naming convention for clearer names
• Writing clean, well-commented code
• Providing all the needed files, assets, plugins, and exported content

Additionally, I wrote up a checklist and instructions for activating the theme, turning on the correct plugins, and getting started since they would be handling that aspect on their own server.

Outcome

The team at Freestar was able to take the packaged build and get everything up and running with ease. They continued to use the theme I built for several years, while adding content and making modifications on their own as their business continued to grow.