top of page
Decorative
PROJECT REPORT:

Revitalizing a website design for a modern brand and streamlined information architecture experience.

ABSTRACT

The project was driven by the necessity to migrate content from an existing series of Life Sciences websites to an enhanced and unified website experience. Throughout the integration of a revitalized, modern brand, the site now exudes a more professional and impactful identity within the Life Sciences industry. Additionally, the objective was to establish an efficient and user-friendly site structure that facilitates seamless navigation of the company’s extensive product and service information.

About the Company.

This life sciences investment company (referred to as “LSC” in this project report) is a renowned industry leader which operates in the realms of genomics, cryogenic storage, automation, and informatics. LSC is committed to accelerating the market entry of groundbreaking breakthroughs and transformative therapies for life sciences organizations worldwide.

*Note: due to proprietary information, images have been replaced with similar instances, and any identifying content has been replaced with lorem ipsum text

Goals & Pain Points.

Primary Goals:
  • Improve Information and Site Architecture

  • Apply a new rebranded print-based identity to a digital platform

  • Migrate content from multiple sites and subdomains

  • Highlight case studies, research and development, and thought leadership

  • Language translations

 

Pain Points:
  • Because of the high information volume, the current mega menu design is overwhelming and difficult to navigate

  • Services and Products are differentiated from each other, but the distinction is unclear

  • Inconsistent branding experience across multiple sites and subdomains

  • Outdated brand identity with miscellaneous applications of the new print-based identity

Project Challenges.

Due to the extensive number of pages and inconsistent category designs across subdomains, the implementation of page template types became crucial for expediting improvements. Additionally, since the designs initially utilized lorem ipsum placeholder text during content migration, meticulous attention to detail was necessary to anticipate and address potential character count and content discrepancies. This was prominently highlighted when passing designs off to the development team - as content was still being strategized during the entire process.

The transition of LSC's new brand, primarily designed for print applications, posed certain challenges for the functional website design. Some elements, such as off-set text styles, required customized coding for each language and instance, potentially impacting on-screen character display depending on the count. Furthermore, the color palettes employed were not compliant with ADA accessibility standards.

Decorative

Approach / Methodologies.

UX Improvements:

Traditionally, our company does not often estimate for user testing, and this project fits within that traditionality. Due to this lack of first-hand information and testing, I approached from a “best practices” methodology. Gleaning insight from audience and user behavior audits into the site, as well as combing through LSC’s own repository of analytics, we were able to create a more succinct site design.

Improved information was
imperative to enhance the overall information cognition. Managing multiple sites with overlapping content, themes, and frameworks posed a challenge, requiring the consolidation of page types to a manageable number. Additionally, to mitigate cognitive overload, it was crucial to incorporate non-text elements that alleviate the burden on verbal cognition.

 

User Interface Design:

LSC’s print rebrand (not previously introduced into the digital setting) carried a few notable aesthetic requirements:

  • fluid line assets symbolic of the connectedness of LSC’s life science product and services working together,

  • Limited, muted color palette with reduced color variations

  • A block sectioning/grid approach to layout design


LSC sought to showcase its own leadership by highlighting case studies, research and development, and thought leadership. The website's overall design aimed to evoke a sense of research and scientific expertise. This was achieved through text styles inspired by research journals, emphasizing precise element and layout alignments to enhance the grid-like structure, and drawing attention to dynamic and fluid photography.

Special emphasis was placed on Product Detail pages, which contained extensive content. The priority was to enable users to find information easily and quickly. To address the issue of lengthy paragraphs, the content was divided into two columns: the heading on the left and the rest of the information on the right. This division allowed for effective grouping of information and created an "outline" appearance, enabling users to quickly navigate through available categories without distractions from the content within each section.

Wireframes.

Low-fidelity
Low-fidelity wireframe of Webdesign Project
High-fidelity
High-fidelity wireframe of Webdesign Project
Decorative

Deliverables.

LINKS

Icons:

 

Images:

bottom of page