The idea is to sort products not by one parameter (like price or release date) but by two - which creates an x/y chart. The product info is displayed dynamically - by default only the image is show. On hover, more info is displayed in a tooltip. And when you click "details", all data is shown.
This way, 300 products easily fit on the screen.
You need to watch it on a monitor to see the chart interface. On mobile, I just display a normal list.
Nice idea. I worked for a while on a "computer blue book", e.g. to answer the question how much a laptop of given specs should cost.
For something like laptops, I recommend providing the option to look at a CPU benchmark score. A list a CPU models isn't super helpful, and even then a "intel i5" can mean something very different depending on the generation.
To me there seems to be a vast overemphasis on screen specs (7 spec lines)
I wonder if you can help the user move between a 'must have' filter (like on the left) and a looser 'pefer' filter, like choosing an area of the chart (like Select in paint apps.) Maybe it could be as simple as changing the checkmark/slider options to have 3 values: null, must, prefer. For example, check a few CPUs as your required spec, but also a few others as the prefered.
Like/dislike might be a better description. Then make the chart show color or size to indicate the preferences.
Good idea, but wow, the popup mechanism is obnoxious. It needs to be off to the side in a fixed location that doesn't obscure what you're looking at, or make you chase the 'Hide' button with your mouse.
Hmm... the way I use it is that when I put the mouse on an item, that is the one I am looking at. So it is fine that some others are hidden. And when I want to see all items again, I move the mouse into an empty area (usually right next to the item I just looked at) so the popup goes away.
Also, I usually use the filters first. Say for laptops, I set the screen size to >=12inch and the weight to <=3pounds. So there ain't that many items left on the screen.
Assumptions about how users will interact with your UX always end up badly.
I saw the "big grid" and was curious, so I hovered on the icons, moving along a line, just to get an idea of what the thing does. Doing that, I kept accidentally moving the mouse pointer off-axis so it went into the popup, and was "stuck" there, until I dragged it outside the popup again, and promptly lost track of what I had already glanced at.
This makes sense. One suggestion would be to add a "Click to hold" button, which will push the dialog pop-up into a corner, maybe in a condensed view, and allow you to select more items. Then you can do a selective comparison of multiple items at once.
"Click to hold" isn't a good name for the feature, but hopefully the idea makes sense.
I did, it just seems to highlight the items in the view? I was hoping to see all of the dialog boxes at once, somewhere. I'm using a laptop FYI so have plenty of screen real estate for that
Great website, the monitor section does not easily cover the use case of macOS users. We want Retina grade displays (5K at 27-inches, 6K at 32-inches). I don't think you even have Apple's monitors?
Yes, product selection is not perfect yet. I originally set out to display the 300 most relevant products in each category. It is probably better to have a larger set of products in each category.
I will tackle that. Not sure yet how hard / easy it will be. Because more than 300 items on the screen initially might make them too small. And adding more as one uses the filters might be confusing.
I like your project. If I may suggest a feature, DPI option in the side panel would be valuable to me. I won't consider any products that have a screen with less than 220 DPI (e.g. laptops, tablets, monitors etc).
All categories with screens (laptops, tablets, phones, monitors) have the option to switch the axis to "pixels per inch". Hover one of the axis arrows with the mouse to select it.
https://www.productchart.com
The idea is to sort products not by one parameter (like price or release date) but by two - which creates an x/y chart. The product info is displayed dynamically - by default only the image is show. On hover, more info is displayed in a tooltip. And when you click "details", all data is shown.
This way, 300 products easily fit on the screen.
You need to watch it on a monitor to see the chart interface. On mobile, I just display a normal list.