In the Coupang product detail page design of the PPZ pet harness traction suit, we organized the content around the wearing steps and accessories system. Through sky blue and lime green, bold short titles, and rounded corner description cards, product identification, partial descriptions, and scene information are arranged at different levels, allowing readers to continue to understand the product in a clear sequence.

Design challenge: Separate different reading tasks

This set of product detail pages should not only retain the appearance recognition of the PPZ pet harness traction suit, but also accommodate different themes such as wearing steps and accessory systems. Instead of letting each picture carry all the information repeatedly, we separated the whole, parts and scenes, and controlled the distance between titles, pictures and descriptions.

Our design strategy

We use sky blue and lime green, bold short titles, and rounded corner description cards to establish a continuous visual language so that the subject can be clearly identified from the background. The title uses an obvious font size and weight hierarchy, and the supplementary description is relegated to the next level to avoid decoration, photos and text competing for attention at the same time.

In terms of content organization, we divide chapters according to the themes of real works: use larger pictures to establish overall relationships, use parts and diagrams to explain details, and then use bounded text areas or lists to organize supplementary information. Long pages create pauses through color blocks, cards, and white space between groups, and chapter switches can also be identified during continuous reading.

Scene opening: Let the dog and the chest and back become the subject at the same time

We used a sky blue background to set off the dog and a blue chest and back, and the titles were arranged along the central axis. The white space above and below separates the theme, main body and supplementary text, and focuses the attention on the relationship between wearing and wearing.

How-to tutorial: Use color blocks to distinguish consecutive steps

We use blue and green backgrounds to divide the wearing and adjustment content, and the photos and subtitles are expanded in the same direction. The segmented colors form chapter reminders so that long pictures still have a clear reading path.

Structural theme: Preserving connections in seated photos

We kept the connection between the side of the dog and the chest and back visible, with a short title above to establish the theme. The light blue background creates a clear contrast with the bold text, so the product will not be covered by the text.

Compare information: Use big arrows to orient your reading

We arrange the two organizations with themes side by side, and the blue arrow below collects the information. Figures are layered with titles, and comparative content is organized through alignment.

Close-up of webbing: hand showing surface morphology

We complement the material theme with a close-up of hands and webbing, keeping the background light. A small amount of text distraction allows woven textures and curved forms to take center stage.

Walking Situation: Establishing the Ratio Between Character and Pet

We put the character’s legs, dog and leash on the same screen, and the blue-green background color continues from the previous article. The traction rope retains a traceable path in the picture, and the scene forms a direct relationship with the product.

Collar module: rounded corner cards organize attachment information

We put the collar in the white picture area, use a short list on the right, a green frame and a blue title to establish hierarchy. Pictures and text are separated, and accessories are no longer mixed in the main product description.

Tow rope module: follows the unified structure of the accessory card

We continue with white, rounded-corner containers, with product on one side and instructions focused on the other. The same font size and margins connect the attachment series to facilitate horizontal comparison.

Connecting accessories: keeping the fastener profile intact

We separate the double-ended fastener accessories into separate cards, with arrows and short titles to prompt chapters. Complete product pictures and concise text occupy separate spaces to give a clear ending to the accessories theme.

Deliver and design value

Through this version of the product detail page, we establish a continuous reading path around the wearing steps and accessories system. Sky blue and lime green, bold short titles, and rounded corner description cards connect different chapters. Image scale, text level, and white space work together to prioritize, allowing product overviews and local descriptions to complement each other.

Develop a clear Coupang visual expression for your product

You can provide us with product links, existing materials, and key points that need clarification. We will combine the product structure, style and usage scenarios to plan the appropriate picture group or product detail page content and layout.