2

I am trying to create a user interface that will let a customer and service operator debate and decide on the price of a transaction.

Initially, the program sets a preset value. This is the average price of the transaction.

The customer receives this price on the mobile app client and the service operator receives this price on their own client. If either party do not like the price then they can dispute it, and can recommend a price within a given range. The prices are sent back and forth until both parties agree.

I am having some real difficulty visualising this process as a UI - would anyone be able to give some help?

So far I've created the booking app client user interface, wherein the service operator can see their price, the customer's price and the final price that is settled on. I don't think it is a very clear/nice way of showing things, as there seems to be a disconnect between the bargaining process and whether or not the service operator decides to accept/reject the booking.

enter image description here

How would I better display this exchange between the two parties?

Improve this question
1

Why not make it a little more friendly and fun in terms of the UI? Add a face to the transaction so the users can see who's asking for what.

Also be careful with your buttons. How they are displayed now makes them look equally important and harder to distinguish between two really important actions at a glance. I suggest:

mockup

download bmml source – Wireframes created with Balsamiq Mockups

When the user accept, they get a confirmation. If the user says "I want to barter," they get to input a number they believe to be more fair. And the electrician will get the same card looking style.

Mind you, this is a very simple solution to what could be a little more complicated. Especially if you're tying all of this to a service, make sure the service (and it's details) are in the process so they know which one is for which ever service.

UPDATE FOR WHAT THE OP ASKED FOR

Why not break the form up into different steps to make it a little more easier to follow?

mockup

download bmml source

I would suggest that each field be designed a little different, like the "what day and time are you leaving?" should be more visually geared towards a calendar and time selector. This was for the sake of showing something quickly. Make it multi-stepped and make it visually interesting, so they can follow with ease.

Improve this answer
5
  • Thanks, this is a great idea. The problem is I have very limited real estate. Let's say if the item being bartered is a taxi ride. The form would look something like this imgur.com/s7XL26C, would it be reasonable to include the bartering system around the "Your Price" section? What do you think? – methuselah Feb 11 '15 at 14:17
  • Can I ask why you have such limited real estate? – Majo0od Feb 11 '15 at 14:28
  • I wanted to combine the bargaining feature with the job details screen in the UI – methuselah Feb 11 '15 at 14:51
  • I see. Why not break the form up in different steps? – Majo0od Feb 11 '15 at 14:53
  • I can do that, but what would best link the two different steps? Here is a shot of the details screen: imgur.com/CEPFRRz. How would I link the service operator to the screen where they need to barter from here? So far on this screen, I only have the details of the job booked. Btw this is not a "job booking" screen, its more of a "job records" screen. – methuselah Feb 11 '15 at 15:06

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.