Enhancing Helix Brand with Modular Web Components & Interactive Experiences

As a design team, my design director and I conducted several discovery workshops with the Helix teams and engaged in asynchronous collaboration through shared documents. This allowed us to identify opportunities and outline all necessary content components and features required for a comprehensive system for Helix.com. The shared documents included details about the target audience, brand guidelines, and the elements of the brand that we were and weren't allowed to update.
‍
We also documented asynchronous content audit questions and held discussions to clarify each page's purpose, its impact on the audience/user, evaluate its current performance. Also, envision the ideal outcome with unlimited resources since this was a 9 weeks sprint project.

How might we explore the primary forms at the center of the Helix brand through patterns and human connections?

Helix's mission is to empower every person to improve their life with DNA, and after reviewing the helix brand documents we learned the significance of four DNA blocks and the relationship with Helix's offerings and uniqueness. We hit the ground running with diverse visual approaches using the four shapes for brand elements, including colors and typefaces.

The initial explorations involved forms, patterns, humanistic images, and typography strategically combined to convey the powerful Helix brand. The exploration also included crafting the home page layout with core design elements and establishing a set of core components outlined during our initial meetings. Although these directions weren't approved by the client, they aided us in reaching the final designs after multiple iterations.

After initially receiving approval from the Helix marketing and product teams, our presented different visual directions faced pushback upon review by Helix's C-level. We then refined the designs based on feedback, ultimately arriving at the approved final design. The final approved design was based on the concept of positioning Helix as a leading technology company driving transformation within the healthcare ecosystem

Expanding on the direction set by the approved homepage designs, we presented one cornerstone page per week for feedback and approval by Helix. The cornerstone pages included the components with search filter, infographics, embedded videos and blog contents.
‍
The Aleph engineers built out modular page views and components for use within a CMS platform (Sanity), and demonstrated progress with weekly releases. We worked closely with the engineers to ensure that requirements are clearly defined and that we have what we need to move on towards a successful launch.

The design process picked up speed as we find repeatable patterns and components from earlier design approvals and feedback. The engineers built modular components for efficient workflow within a CMS platform.  

In the previous design, all resources were buried under the Company link, making them difficult to find. We ensured that resources could be accessed from multiple pathways through a mega menu.

The second challenge arose when Helix's in-house product team made design system changes close to the launch date, while we were aligning with their system. This highlighted the dynamic nature of a product team's design system, prompting the realization that a distinct system should have been established for the marketing website. However, a positive outcome was Aleph's provision of a new CMS, enabling clients to adapt content and design elements more flexibly as circumstances evolve.

At times the client raised concerns about our brand uplift, leading to pushbacks. During a pivotal discovery design sprint, we addressed the question, "What could potentially cause this project to fail?" The client mentioned that disapproval from C-level executives could be a significant obstacle. To mitigate this risk, we proactively involved the C-level executive of Helix in a broader design review, a step we should have insisted on earlier in the approval process.