Ethicon · Johnson & Johnson

An 18-month responsive-web evolution restructuring Ethicon.com around the surgical procedure, not the product SKU.

Responsive Web/ Pharma/ B2B eCommerce/ Information Architecture/ Content Strategy
Details

The page is the procedure. Not the product.

Ethicon is a Johnson & Johnson subsidiary and one of the largest medical-device manufacturers in the world. In 2016 Ethicon was shifting customer engagement from product-led selling to procedural selling: meeting surgeons and procurement teams at the level of the surgical procedure rather than the SKU. Ethicon.com had been built around the product taxonomy. The new strategy needed a site built around the customer's decision journey.

Atmosphere Proximity led the Ethicon.com Evolution program over an 18-month engagement. As Director of User Experience, I led the UX strategy, information architecture, content strategy, and the underlying behavioral framework that organized the redesign. The framework I built for the engagement, the Wayfinding Framework, combines two information-retrieval models from cognitive science and library science. It became the operating logic for the site and, later, for the broader Ethicon Product Resource Center.

18mo
Engagement
Dec 2016 launch. Multiple WIP iterations and creative-redesign rounds.
2
Retrieval models
Classic (task) + Berry Picking (exploratory), held simultaneously on every page.
4
Global instances
US content enrichment plus Latin America, EMEA, and APAC instances.
1
Custom framework
The Wayfinding Framework. Built for the engagement, persisted across every version.

Goals

Outcomes the program had to make possible against Ethicon Global's top-level digital objectives.
  • Shift customer engagement from product-led to procedural-led.
  • Restructure information architecture for Ethicon.com and the future Ethicon Product Resource Center (EPRC).
  • Deepen online engagement with core clinical audiences: surgeons and procurement teams.
  • Strengthen Ethicon's positioning as the digital innovation leader in surgical solutions.
  • Enrich and strategically focus field-rep conversations with customers.
  • Realign site search, navigation, and taxonomies to support both exploratory and task-oriented user behavior.

Framework

A blend of cognitive science, human-computer interaction, information retrieval, and library science, adapted for clinical B2B eCommerce.

The redesign was anchored in a framework I developed for the engagement, the Wayfinding Framework. It combines two information-retrieval models from the research literature, both grounded in how people actually search through complex information spaces.

The Classic model

Task-oriented retrieval. The user has an information need, formulates it as a query, the system returns a set of relevant objects, the user judges what's useful. Affordances that serve this mode: CTAs, search, utility navigation (my profile, my orders), product specifications, structured data.

The Berry Picking model Bates, 1989

Exploratory retrieval. The user's information need is not satisfied by a single final retrieved set, but by a series of selections and discoveries along an ever-modifying search path. The pattern is a random walk of unpredictable steps toward a general goal, often across multiple sessions. Affordances that serve this mode: main navigation as mental-model scaffolding, content cross-linking, product recommendations, landing pages with overview content.

Diagram of the Classic information-retrieval model: user has an information need, formulates it as a query, the system returns relevant objects, the user judges relevance.
Figure 01 · The Classic modelTask-oriented retrieval. Linear flow from need to query to result.
Diagram of the Berry Picking information-retrieval model showing a random-walk pattern of selections and discoveries across an ever-modifying search path.
Figure 02 · The Berry Picking modelExploratory retrieval. A random walk of selections across an ever-modifying search path.

The Wayfinding Framework holds that every page in a complex B2B eCommerce site must accommodate both modes simultaneously. Clinical audiences move between task and exploration within a single session and across multiple visits. Treating those as separate audiences, or building separate pages for each, leaves the page broken for whoever isn't being served at the moment.

A competitive analysis across the surgical-device category positioned the work in context: GE Healthcare was leading on digital content innovation; Medtronic was underinvesting in public-web presence; the strongest comparators outside healthcare were using gamified interfaces and segmented content to establish thought leadership. The framework let Ethicon play category-leadership rather than parity.

Every page accommodates both modes. Task and exploration. Because clinical users move between them within a single session. Wayfinding Framework · operating principle
Wayfinding · two modes, one page

Two retrieval paths, the same page anatomy. Task affordances above the fold. Exploration affordances below.

CLASSIC · TASK linear · single query BERRY PICKING · EXPLORE random walk · ever-modifying path ONE PAGE · TWO MODES HELD SIMULTANEOUSLY need query result set judge relevance v1 v2 v3 vN ABOVE THE FOLD · TASK CTA search my orders profile product specs — the fold — BELOW THE FOLD · EXPLORATION main navigation · mental-model scaffold cross-links · overview content · recommendations PAGE ANATOMY · WAYFINDING FRAMEWORK · ETHICON.COM EVOLUTION 2016–2018
Classic model · task path · query → result Berry Picking · exploratory path · random walk across visits
Diagram · Wayfinding Framework · Bates 1989, Berrypicking model · adapted for Ethicon.com B2B eCommerce

Solution

The final design organized every visitor pathway around the surgical procedure, not the product SKU.

Every IA, navigation, content, and interaction decision in the redesign was driven by the framework. The page anatomy became the operating contract: task affordances above the fold, exploratory affordances below, both modes available on every page.

Decision i

One navigation system across all pages

Primary, secondary, and utility navigation rendered consistently on every template, to build a stable mental model users could carry across sessions.

Decision ii

Procedure-led main navigation

Specialty-specific content surfaced under "Procedures" in main navigation, encouraging clinical audiences to view Ethicon's leadership at the procedural level rather than the product level.

Decision iii

Restructured taxonomies

Main navigation (faceted) and page-level taxonomies (hierarchical) re-architected based on element traits, intent signals, and implicit relationships, to support task completion across both modes.

Decision iv

Faceted site-wide search

Search redesigned to yield a faceted results page that aligned user needs with organizational goals. Filtering became part of the discovery surface, not a separate page state.

Decision v

Reciprocal page-level hierarchies

Page anatomy designed to support both modes of the Wayfinding Framework on every template. Task affordances above the fold. Exploratory affordances below. Page-level hierarchy reciprocated main navigation.

Decision vi

Procedure landing page as template

One canonical procedure landing page became the model for the rest of the site. Content organized around the surgical procedure, with the two-mode anatomy applied at scale.

Customer journey stages

Awareness, Consideration, Trial, Repeat Usage, Loyalty. The Berry Picking exploratory mode dominates Awareness and Consideration. The Classic task-oriented mode dominates Trial and Repeat Usage. The framework wasn't an abstract academic exercise. It was a structural match for where users actually were in the surgical decision journey.

Use-case diagram showing the Wayfinding Framework applied: a single page anatomy serving task-oriented and exploratory mindsets simultaneously, with affordances assigned to each mode.
Figure 03 · Wayfinding Framework · use caseThe framework as it operates inside a single page. Task affordances and exploratory affordances coexisting in one anatomy, each addressed to the mindset most likely to use it.
Sample procedure landing page from the Ethicon.com Evolution redesign, showing content organized around a surgical procedure with affordances supporting both retrieval modes from the Wayfinding Framework.
Figure 04 · Procedure landing pageThe canonical example. A page organized around the surgical procedure, with affordances for both retrieval modes built into the anatomy.

Outcomes

What the framework let the program do, then and after.
  • An 18-month engagement structured across multiple WIP iterations, formal deliverable milestones, and creative-redesign rounds. The Wayfinding Framework persisted across every version as the operating logic.
  • The site repositioned as a central hub for product information and surgical thought leadership across global markets, with US content enrichment and instances launched in Latin America, EMEA, and APAC.
  • The Wayfinding Framework extended beyond Ethicon.com to become the operating logic for the broader Ethicon Product Resource Center (EPRC), applied across the full product portfolio.
  • Alignment with Ethicon Global's three top-level digital objectives: enrich field-rep conversations, deepen digital engagement, and position Ethicon as innovation leader in surgical solutions.

Talk to Ben about your work

Information-architecture problems usually live underneath the brief.

What looks like a content problem or a navigation problem often turns out to be a retrieval-model problem. Different users move through the same page in different modes, and the page has to hold them both. If that's where you are, the conversation starts here.