A bold rebrand for a dynamic marketing agency
In 2018, I had the privilege of entering into a creative partnership with a full-service marketing agency in Chicago’s trendy Bucktown neighborhood. With two accomplished women CEOs at the helm, NiKnack Marketing provides clients with marketing, branding and event management services. This is one of the initial projects I took on after joining the team.
Giving the brand a modern look and feel
I refreshed the agency’s logo, streamlining the design elements to modernize the look and feel while maintaining the company’s brand recognition. I removed the gradients, refined the curves of the logomark, and replaced the type with a bold geometric font that would be used for the website redesign.
A High-level Competitive Analysis
Prior to wireframe development, I presented a conceptual document, revealing 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, in order to get buy-in 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, in order to expand the purview of possibilities and think bigger.
Architecting a user-friendly experience
After agreeing on the creative direction, I began working on the clickable wireframes to effectively organize the site content, define the functionality of the components and optimize the flow. I’m not a mobile first UX person–I’m what I like to call, a “mobile simultaneously” designer. When working on a responsive project I often wireframe desktop interfaces at the same time as mobile–this ensures that each component is properly optimized for the respective devices, while maintaining the intended user experience.
Designing the user interface
Once the wireframes were approved, the next step was the visual design. Leveraging Sketch, InVision and Principle, I created a distinct design system comprised of unique UI elements that, together, formed a bold and exciting new look. I included ample whitespace and used bold headlines with short, succinct copy blocks to create a visual hierarchy while increasing scannability. I also introduced fun infographics and micro-interactions to make the content more dynamic and easier to consume. To see the end results, view the prototype here or use the button below to view the live site.
Defining the site functionality
Finally, to conclude the project, I created a detailed functional specifications document to help guide the development team in maintaining the creative vision while providing guidance around reusable components that would help them to develop scalable snippets of code to expedite the build process.