I have no idea what size the tires on my car are. But I do know the make, model (and year) of my car. I'd rather enter these details into the size, and the site could tell me what tyre size is recommended, and as part of that do a search for the prices.
I do know it exists, though. I used to work for a major American tire manufacturer and maintained a couple of versions of their tire selector application. They would send over a huge file (I think a spreadsheet) with a combination of every year/make/model/trim and its associated OEM tire sizes. I think we also sent over a list of our tires (models and sizes) and they would include that in the db for us. I believe it was left to us to import and normalize it, which was kind of a pain in its own right.
2.) Not UI feedback, but the data seems pretty sparse. Getting not found on relatively common sizes.
3.) I'd wager the average person has no idea about width, profile and size. You really need a way to search by make/model/year for something like this or at least a quick guide on how to read the sidewall to get the information.
4.) I'd be more interested in the type of tire (all-season, snow, sport) than the make or source website at the second step.
5.) Tires are probably not the best thing to sell via a minimally visual site. There's a reason sites like tirerack have gone to the trouble to provide tools to simulate what tire/wheel combos will look like on a specific make/model/year/color of car.
People care about what their vehicles look like, right down to the tires.
Also, it'd be nice if the text were centered vertically. Since your "li"s are all a fixed height you can do this easily without relying on table hacks or css3 by simply setting the padding-top to 20px and adjusting height accordingly. (Box-align will eventually support this, but you still can't count on people having compatible browsers so for a simple layout like this one padding should do just fine).
Interesting. I found it very clear/easy. I read this text as soon as the page loaded: "Please enter your tyre dimensions by clicking on the boxes below. e.g 205/45 17"; so I just clicked the boxes according to my own car tire's dimensions.
I probably have a disorder. I should get help.
It's a bit like going into a restaurant and seeing the waiter not wash their hands after using the bathroom.
When I visited your page, between the horrid spelling and lack of images, I had no clue what the hell your site was supposed to do.
Also, physician, heal thyself: you've spelled 'tire' as 'tier' in your first sentence.
Maybe a "most searched" sizes could beat this.
Images, just like any other UI paradigm, have their appropriate and inappropriate uses. Producing a UI with no images, and shining the spotlight on that fact, is just the same as saying "Look at this UI with no buttons!", which is silly if buttons might be appropriate, just as images could be appropriate in this case.
At that point you could get rid of Find Best Price for Tyres completely (as the system would know there are results at that point and display them for me) (or keep it just in case).
EDIT: You could also grey out the Find Best Price for Tyres until at least one selection is made since people may want to look for 205mm in 1 or more sizes.
As a user, once I have gone to the trouble of looking up my tyre size and entering two of the three parameters, having the site go non-interactive while options are filtered is not helpful, it is annoyingly bad design.
It is bad because instead of being done with my task in another second or two, I am given the new task of interpreting the changed state.
In particular with this site, the presentation and options are such that the filtering is useless. It there were 100 wheel diameters, then filtering might have some justification. But as a user, I want the path that gets me to the results as quickly as possible in real time.
#) You shouldn't output the SQL error messages to the user.
#) The purchase column shouldn't have a sort icon if it isn't sortable.
#) IMHO the back button doesn't add any value since it just duplicates browser functionality.
Another little nitpick: The sort icon on the page is a image ;-)
In the results page you may want to hide the table header's sorting buttons from the "Purchase column" and call the "back" button something like "New search" (this last point is quite debatable of course).
About the UI, it looks good overall (caveat: I have a bias toward non-distracting UIs). I don't really see the need for images.
1. Care to post a default so it's possible to explore? Couldn't figure out a working combination. 2. When you hit an error, would be helpful if you kept the previous selection prefilled (either via AJAX request or passing along the previous selection in the URL).
I found it intuitive and easy to use. The interface reflects the the data domain it represents rather than glomming the data onto a generic shopping solution.
<script src="/css/tyrejs.js" type="text/javascript"></script>
* The nav text is too small to read comfortably.
* For the nav in the top right: why is it in that spot? It doesn't line up with other content, so it looks out of place.
* TyreSum.beta – my first thought was: 'there is a .beta TLD?' This is confusing.
* The logotype doesn't need an underline when you mouse over it.
* 'We compare so you don't have to' – you have used periods throughout your whole site... but not to end your slogan?
* Why are the buttons shiny? Then, why aren't they shiny when you click on them? Why is the gradient on the properties-of-tyres buttons is different from the submit button's gradient?
* Why do the buttons have squared corners when the container and the submit button have rounded ones? (Or, why do the other things have rounded corners?)
* Why are the buttons all square, when the text takes up less than half of their height? Since they are, why is the text (very tight!) at the top?
* 'Width', 'Profile', and 'Size' look awkwardly narrow centred on the wide rows of buttons. You could make them look chunkier, or move them to the left of the rows, or something. It would also be nice to see more padding between them and the rows above. The padding on the page is not very consistent all-around.
* For example… the padding on the container is awkward. There is a bunch of whitespace on the left and right, and an awkward mismatch of whitespace size on top and bottom.
* The container has a shadow but nothing else does; except for the gradients on the buttons, if you see that as a shadow – in which case this is doubly awkward because the shadows are running in different directions.
* Why is the container 940px wide? Since the contents don't seem to fill it horizontally, it could be narrower. This would be good because it would work better on smaller screens – especially mobile devices.
* On the search page:
* It's a little strange that 'make and cheapest model' contains links, and 'website' doesn't. I couldn't guess where those links were going to take me.
* You have a 'price' column, and then a 'purchase' column, where each button has the price on it. The 'price' column could go. (You have to be able to sort based on the purchase column, then, though.)
* Why are the contents of some columns centred while others are left aligned?
* Why are the website names a different size and font weight, and why are they all in caps?
* As others mentioned, you don't need the back buttons.
* 'Showing…' doesn't line up with anything.
* I don't have a suggestion here per se, but it takes several clicks to get from stating a size to buying a tyre. To me, the information hierarchy was not obvious. After I got past the search page, I was confused each time I saw another link. I couldn't predict where any of those would take me. Eventually I figured it out, but it would be good if I didn't have to.
* Write good, semantic HTML, and validate it. You are using a bunch of deprecated elements (like <center>) where you should be using CSS instead, for example. http://validator.w3.org/check?uri=http%3A%2F%2Fwww.tyresum.c...
Hope that helps. Basically, I think their are two main points. The first is about implementation: you should try to follow coding best practices, like using semantic HTML and sanitizing your SQL. The second, which relates to design, is that every aspect of your design should have a 'why.' If someone asks (or, hopefully, you ask yourself) 'why is this here? why is this this colour? why is this this size?' etc. you should have a rock-solid answer. If the user finds themselves wondering those things, it probably means it needs work; likewise if you don't have an answer.
You don't offer filtering by (or at least display in the table of) the speed and load rating - these are critical to legal tyres, and could invalidate insurance if found to be incorrect.
You don't filter / display EU tyre labelling - not sure what your legal obligation is, but it would be useful to be able to set a minimum economy / grip or maximum noise rating, or sort results by those.
You only display brand, not model - most premium brands have several models in each size, for example Continental EcoContact, PremiumContact, SportContact - I may only be interested in one of those.
Otherwise, good job!
.
2. 'Size not found, please try again'
This not found message is small and displays in the wrong place. When you click the calculate/search button, your gaze is down at the bottom, and the error appears at the top of the page, out of sight.
Perhaps animate the color of the button, during search going purple say, then when the result is in ( none: red, some: green )
.
3. Please number the search parameters. You need all 3 to have values. Make them bigger too, they get lost.
.
4. 'We compare so you don't have to'... I'd put that as 'Save time comparing tyre prices with our simple wizard'
.
5. Include a working example with some actual results as a link. Chose a common car. Ford Fiesta 2009 165 x 30 x 13 ==> 40 comparisons
* If there are instructions, that's usually a red flag to me that I've done something poorly in the UI design. I agree with one of the previous commenters that you should do a make/model search instead.
* I'm not quite sure what to do with the filter field on the results page. It's just a blank text field. Does it filter by keyword?
Add a list of the "Most Popular" 5 tires sizes so that these first-time users can still use the site and understand what it does. Then when they actually need to shop, hopefully they'll give you another go.
