PROJECT OVERVIEW

The Oncolytic Frontier

This concept focus on a vertical long-scroll experience, drawing inspiration from the themes of curiosity and deep exploration. Utilizing a 3D environment or visual assets, it immerses users in a spatial journey, encouraging them to delve further into the content. The design builds anticipation as users navigate deeper, creating a sense of discovery—what lies at the bottom?

PROJECT OVERVIEW

Final Delivery

To communicate the feeling of going deeper and discovering more than what is on the surface, we wanted to create the aesthetic of the light going through darkness by using rays and gradients. The light symbolizes discovery and the rays symbolize discovery breaking through what might be now part of the past. We studied identifiable sonogram result visuals to bring a clinical look and feel to the website. The typography in the webpage will be organized by lines and spaced out to mimic the aesthetic of a test result. We will use the sonogram scales and highlight feature to track the user down the page and highlight content on graphs or images.

IDEATE

Low Fidelity Wireframes

Our design adopts a mobile-first approach, ensuring a seamless experience on both mobile and desktop platforms without compromising functionality. Users will engage through scroll-driven interactivity, where actions are intuitively triggered by vertical scrolling. Additionally, the experience is enhanced with layered micro-interactions and motion, adding depth and fluidity to the user journey, creating a captivating and immersive environment.

DESIGN

Layout Design

To bring our vision to life we want to create a look and feel that communicates the feeling of going deeper and discovering more than what is on the surface. To achieve this we studies the aesthetic of light and darkness combined with identifiable sonogram visuals.

DESIGN

Design System

EVALUATION

The Final Verdict

What we did well

The design mirrors the core campaign concept, using repetitive visual elements to create a sense of rhythm and brand echo. We utilized a long-form scrolling journey to reinforce the "dive and discover" content strategy.

  • Atmospheric UI: Blended elegant gradients with a refined dark mode to enhance the immersive, premium feel of the interface.
  • Fluid Units: Replaced traditional pixels with rem and percentages to achieve a seamless, full-bleed responsive design.
  • Story-Driven UX: Leveraged a one-page scroll experience to guide users through a seamless discovery process.
  • Anchor Navigation: Integrated section anchor points to provide intuitive jumping and improved wayfinding across long-form content.

What we learned

We shifted from static layouts to a fluid, code-conscious workflow to ensure the platform was both visually immersive and technically optimized for any screen size.

  • Cross-Platform Parity: Maintained consistent interaction models across both mobile and desktop to ensure a unified brand feel.
  • Engineering Handoff: Supplied functional code snippets for sophisticated interactions to ensure high-fidelity implementation during development.