In 2018, I had the privilege of entering into a creative partnership with NiKnack Marketing, a full-service marketing agency in Chicago’s trendy Bucktown neighborhood. With two accomplished woman CEOs at the helm, the agency provides clients with marketing, branding and event management services. This website redesign was one of the first projects I took on.
Prior to wireframe development, I presented a high-level creative vision and strategic direction for the website redesign. The document formalized my ideas of how the site could look, feel, and function prior to any heavy design lifting. Specific concepts were broken down by category and supported by best-in-class examples (both inside and outside of the industry) to expand the client’s purview of possibilities.
After the design strategy was approved, I created wireframes to organize the content and define the functionality of the components. Desktop and mobile wireframes were created simultaneously to ensure each component would be properly optimized for the respective device.
A vertical “snap scroll” was used on the homepage. As the visitor moves down the page, each screen snaps into the viewport, telling a compelling brand story as each section builds upon one another.
Prominent use of custom icons and data visualizations would be used throughout the page to not only support the text, but to make the content more visually appealing and easier to consume.
Each component would be designed to create a congruous and scalable design system that maintains brand consistency throughout the site experience and makes development more efficient.
A hyper-visual, aesthetically appealing, non-linear layout would be used to showcase just the right amount of work in order to entice visitors to engage.
Meaningful reasons to believe would be backed by quantifiable data points to support the results that the agency has delivered.
Bold headlines and short copy blocks would be used to create a visual hierarchy that defines the page structure, helping visitors to better scan and absorb content.
While website form best practices recommend keeping forms short and simple (often relegated to one column and one page/screen), we opted to extend the contact form into three screens.
On the first screen, visitors select the reason for their inquiry. Using logical sequencing, we send users to the appropriate form (general inquiry, quote request or make an appointment).
This approach enables the agency to determine what percentage of the form users are just casually browsing, which are at the top of the acquisition funnel, and which are ready to convert.
To complement the new site, I refined the existing logo. Extraneous gradients were removed and a bold san-serif font was introduced. The result was a clean, modern logo that feels new, yet maintains the brand equity and identifiability.