Shape

Buy

All three shape categories are used within Buy, but square elements are the most commonly used. From the Tab to planes to composition, square elements work best to create harmony across our many surfaces.

Consistent shape builds recognition and trust

The squared Tab anchors the page, which drives layout on our webpages. It creates a natural frame for navigation and main content on the page. Consistency in this structure creates a recognizable pattern across the user’s experiences which builds trust with our customer.

Shape helps organize content

Square planes establish hierarchy and organize content. Each plane should contain one type of content (examples: text, customer photo, customer file). Multiple planes together form a module. For more, see Layout and Planes.

Shape drives clear action

In combination with color, shape helps reveal possible paths for our customer. As the customer moves down the purchase funnel, the experience becomes closer to Use in look and feel. Using square shapes and planes allows the user to focus on the specific task at hand, while continuing to maintain brand cohesion.

Non-square shapes

Within Buy, we rarely use non-square shapes. When we do, they are primarily used in the form of our Global Icons and small UI elements to draw focus and attention. We most frequently use them in conjunction with Customer Content and Product Visuals.

Don'ts

Don’t use navigational patterns besides DWG Universal Navigation

Don't use rounded corners on form fields, buttons or notification bars