Optimizely Homepage Design
The C2 Group supported Optimizely in implementing a new design system concentrated on creating a seamless customer journey. Optimizely can now create consistent and cohesive experiences using components, UI Interactions, and visual styles designed by C2.
The Challenge
During the creation of a revamped user experience for their website, the Optimizely team initiated a project to streamline the customer journey through a cohesive design system. While significant progress had been made in implementing the new system, lingering challenges were blocking its effectiveness. Optimizely partnered with C2 to address these challenges, focusing on the Optimizley.com homepage.
A primary obstacle was the disorganization inherent in the design system itself. Despite efforts to modernize and streamline the user experience, the lack of clear documentation and consistency between "new" and "old" designs posed a significant challenge. This lack of cohesion not only hindered the efficiency of content creation but also affected user confidence in the platform.
Although the Optimizely homepage showcased a refreshed aesthetic, many aspects of the marketing-specific content sections remained outdated. A thorough audit of the CMS architecture by C2 revealed a cluttered page landscape, with similarly named blocks lacking descriptive information, leading to confusion among editors. Moreover, while the updated visual design system introduced container blocks to facilitate the reuse of design patterns, there were concerns regarding the system's features overwhelming content writers and impeding their ability to collaborate with editors efficiently.
Due to the changes implemented, Optimizely now benefits from a streamlined design system that facilitates the creation of new marketing and product feature pages with ease. The changes expedited content creation and more clearly communicated Optimizely's brand image as a leader in delivering seamless digital experiences.
Due to the changes implemented, Optimizely now benefits from a streamlined design system that facilitates the creation of new marketing and product feature pages with ease. The changes expedited content creation and more clearly communicated Optimizely's brand image as a leader in delivering seamless digital experiences.
Due to the changes implemented, Optimizely now benefits from a streamlined design system that facilitates the creation of new marketing and product feature pages with ease. The changes expedited content creation and more clearly communicated Optimizely's brand image as a leader in delivering seamless digital experiences.
Solution
C2’s UX team implemented a solution grounded in innovative design and advanced technology. Central to the solution was recognizing the need for a design system that effectively supported both user experience and development efficiency. The C2 UX team worked alongside Optimizely to align the design system's templates and components with the established content strategy, enhancing the overall usability of the system. The team also introduced a dynamic dark mode feature to the homepage, designed to enhance user comfort and reduce eye strain during extended browsing sessions. By transitioning to a dark color scheme, Optimizely's interface gained a modern aesthetic that prioritizes user accessibility.
C2 emphasized crafting scannable and concise content, while establishing a coherent visual hierarchy. This approach enabled seamless navigation for users, facilitating a memorable first impression to the website. To enhance user engagement, UI interactions were integrated throughout the homepage. The incorporation of scroll based effects and curated animations transformed static elements into immersive experiences. By strategically animating content introductions, website visitors could avoid the distraction of visual clutter, prompting deeper exploration.
The Results
By implementing these design components, C2 successfully laid the groundwork for a seamless digital journey. The optimized design system empowers a more efficient development process, prioritizes user experience, and cultivates a sense of brand consistency for Optimizely and their website visitors.
