Best way for a user to specify budget/price range?

Question

When designing for a shopping service, the user should be able to specify what they're willing to spend on an item.

Problems:

• There's no automated way to know what price range on the item, so the entry is essentially free form.
• Users are bad at estimating prices: numerical input doesn't work
• Using a slider to classify user priority (e.g. economy, value, performance) leaves too much to interpretation
• Price ranges may not be granular enough for some users

How would you solve this UX issue?

Answer 1

By shopping service, I am assuming that you mean a service where the user will enter a product, certain specifications and a price, and then your team will go out and source the product for them.

I think in your case, entering a maximum price they are willing to pay would be the best. Everyone would like to get the cheapest price for a given item (provided we are comparing the exact same item/service), so there isn't much sense in having a minimum price. However, you can improve this by searching Google Shopping and Amazon and perhaps even a few major online stores/retailers in the region you are targetting this service.

This should allow you to provide the user with a general idea of how much the item typically costs, allowing them to entering an appropriate range for the price.

A possible interface could look like this:

^{download bmml source – Wireframes created with Balsamiq Mockups}

Given this, you have hinted to the user how much the item typically costs, and allowed them to enter a reasonable value for your service to work with. You can also build an algorithm to reject unreasonable maximum prices. For example, if the user asks you to source him a Ferrari which typically sells for $500,000, but provides a maximum price of $1, your system can automatically reject that immediately.

If you are not comfortable providing a list of products from third parties like amazon, you can aggregate the prices and process them using an algorithm to result in something like this:

^{download bmml source}