Displaying logos without "guiding" UX

Question

In many ways this question is a sequel to many of the others

Header/Footer Icon usabilityhttps://ux.stackexchange.com/questions/107505/reducing-button-clutter-and-improving-ux

I have asked on this forum. Consider the image shown below

The actual retailer logos shown here are only by way of illustration.

One of the capabilities in my application is to display a list of retailer who currently have offers. In this list I would like to use retailer logos since users tend to associate strongly with logos for their preferred brands.

However, this results in a problem - the list layout with the dropdown button on the right hand side of each item is, in my view, easy to scan and the dropdown button strongly suggests that clicking on the logo will reveal further information. BUT the list layout devalues square logos in favor of linear (i.e. with a more pronounced horizontal dimention) ones. You will see what I mean in the image below - it looks like I am emphasizing Supervalu to the detriment of Hannaford and Shoprite.

Forcing the logos down to an "icon" would have the opposite effect - it would devalue the "linear" logos and make them appear "less important/interesting".

I have considered using tiled images and allowing them to keep their natural dimensions - though this is not strictly true since I would still be limiting the width of each tile. Even if there were a way not to do this I feel that tiles loose the clarity, interactivity and scannability provided by a list. They do not trigger

• If I scroll down I might see my favorite retailer, "zzzzOOOM" OR
• "Superbucks"? Let me click on that arrow and see what these guys do

apart from which I feel that a list should appear as a list rather than attempting to disguise itself as a tile, a cloud or anything else since any disguise is bound to devalue its utility.

These are my initial thoughts and I might well be wrong - I am not really a UX guy - so I am hoping that I will get some useful insights from others here.

Answer 1

It seems like the most common approach is to use tiling, potentially with the inclusion of other information that might be relevant on the top level (to avoid an unnecessary click through to the dropdown).

Here are a few examples of different approaches that may work for you:

ethn.io: scroll down to the "Customers" section of the homepage. They use equally-sized circles with extra information to display differently sized logos with equal prominence.

groupon: They use plaintext for the names of companies to avoid the issue altogether.

Stack Overflow Talent: They take a hybrid approach which I think might be particularly suited to your use case - the logo on top of a stock image, along with a plaintext descriptor below.