Using illustration

We use illustrations to enhance our storytelling and create a bridge between our product language and lifestyle-focused imagery.

A series of 4 mobile screens with form sheets containing illustrations from the motors category.

When to use illustration

Illustration works well in representing broad categories, abstract ideas, or complex processes that may be challenging to convey through photography or iconography alone. Illustration can also add a touch of whimsy and color to capture attention and evoke emotion. It's most effective when balancing realism and creative expression and most often used for education, celebration, null states, and categories. Use illustrations sparingly in the product experience to avoid dilution and overshadowing of content. All illustrations must undergo mandatory review by the OX team during office hours to ensure optimal use.

Areas of use

Onboarding

Welcome users and introduce them to new features and concepts.

Celebration

Congratulate users on their wins and evoke positive emotions along their journey.

Null states

Indicate empty states and evoke a sense of delight during system errors.

Categories

To visually represent areas of our product that can be navigated or selected.

Education & onboarding

Illustration works well in representing broad categories, abstract ideas, or complex processes that may be challenging to convey through photography or iconography alone. Illustration can also add a touch of whimsy and color to capture attention and evoke emotion. It's most effective when balancing realism and creative expression and most often used for education, celebration, null states, and categories.

A half sheet on the eBay mobile app with the top half showcasing an illustration of a lamp, shoe, baseball cards and sparkles. The bottom half contains text in black and a CTA in blue against a white background.

Half sheet

A full sheet on the eBay mobile app with the top half showcasing an illustration of a lamp, shoe, baseball cards and sparkles. The bottom half contains text in black and a CTA in blue against a white background.

Full sheet

A half sheet on the eBay mobile app with the top half showcasing three eBay cardboard shipping boxes with an orange and black lamp standing in front of them, all illustrated on a green background. The bottom half contains a walkthrough process with text in black and grey against a white background.

Half sheet

A full sheet on the eBay mobile app with the top half showcasing three eBay cardboard shipping boxes with an orange and black lamp standing in front of them, all illustrated on a green background. The bottom half contains a walkthrough process with text in black and grey against a white background.

Full sheet

Celebration

Illustrations are a wonderful way to celebrate user wins and deliver personalized moments of surprise and delight. We can introduce celebratory moments when they accomplish goals, or to build anticipation for a product that is about to arrive.

Mobile and Desktop Seller pages are shown. On mobile, a full sheet is displayed with a You’ve leveled up! message. An illustration of green handheld gaming device with grey buttons sits on a neutral grey background. The screen on the gaming device shows three copper coins with the word ‘YAY’ written in white on top of the coins, all on a blue background.  
On desktop, a modal is shown with the same illustration.
A half sheet on the eBay mobile app with the top half showcasing an illustration the earth against a lime background. A black location icon sits on the map with a brown eBay shipping cardboard box rotating around the globe. The box is followed by a black dotted line to signify the movement of the box. The bottom half contains text in black and a CTA in blue against a white background.

Half sheet

A full sheet on the eBay mobile app with the top half showcasing an illustration the earth against a lime background. A black location icon sits on the map with a brown eBay shipping cardboard box rotating around the globe. The box is followed by a black dotted line to signify the movement of the box. The bottom half contains text in black and a CTA in blue against a white background.

Full sheet

Null states

Illustrations can add inspiration to empty product areas or evoke a more positive reaction when something goes wrong. Avoid leaving users with a dead end by including a call-to-action. For example, refreshing the page if there was an error or adding favorites to a collection if they haven't yet.

Categories

Illustrations visually indicate categories that a user can navigate to or select. This helps with easy identification, which allows users to quickly take action, whether that's exploring, saving, or adding personalized information.

Three smartphone screens show app pages with colored category illustrations: The first screen shows interests: Sneakers, Electronics, Home goods, and Sports. The second screen shows categories: Home Decor, Books, and Tech. The third screen shows sizes: Clothing, Shoes, and Accessories.

Resources