I'm working on a checkout process for a translation service company.

The user originally has one English document that they want to translate into two (or more different languages). However, they are price sensitive, so they wants to choose the different translation quality for each language.

I came up with this solution: enter image description here

However, I'm not a big fan of sliders since they require quite some mental work from the user.

Do you guys have any idea how I could make this selection more straight-forward?

Any idea is welcomed!

  • @musefan, Amazing! That was my second choice, but I imagined having the final price + price per word in each square. In my case, the screen would be too crowded with all the prices, and it would be hard to swallow. But in your case, it looks excellent! I didn't think I could still have the final price in the last column. What I like in your case is also that price of each type is visible all the time. In that case, the user can compare the prices, which makes his decision easier. *Different rates are because of a different kind of translation. The first type is machine translation, the second
    – Jaka Smid
    Mar 31, 2021 at 11:16
  • I like your solutions so far, though I wonder how many languages you will support at a maximum since this could cause your slider thumbs to be at a greater distance from the column header. Maybe you can include 'Type n" inside the thumb somehow? Apr 1, 2021 at 16:53
  • This looks like a plea for us to do your work for you, not any Question; certainly not multiple selection or SE User Experience. I'm sorry to be the one to say so, and little of what you Posted works in English. "I'm doing the checkout process for a translation service company" isn't incomprehensible. So what? Your example does not work in place of "The user has an English document which he wants to translate into two or more other languages…" If you do not you see the difference, please say why. How does price affecting translation quality affect language? Apr 1, 2021 at 22:31

3 Answers 3


I actually think your slider idea is not that bad and might be interesting.

Depending on how effortless the implementation has to be, it can also be a simple dropdown in the end:

enter image description here


Ok, in response to your comment. How about adding a button with an overlay that explains it all in detail. In comparison to a tooltip, this would work well on mobile as well!

I just added a random graphic there, but it could show the 4 types in a cool way that makes it clear where the differences are.

enter image description here enter image description here

  • Wow, that is also an AMAZING idea, however...
    – Jaka Smid
    Apr 1, 2021 at 6:58
  • Wow, that is an AMAZING idea, however... I forgot to mention, that I was planning to explain on mouse hover what each translation type actually is - they are quite complicated to explain therefore is a lot of text and I don't know yet how I would explain each translation type in the dropdown. Maybe with a dropdown tooltip, but they are not so common and I think there won't be enough space to explain what it means.
    – Jaka Smid
    Apr 1, 2021 at 7:07
  • 1
    @JakaSmid I updated my answer, maybe that's an option for you.
    – Big_Chair
    Apr 1, 2021 at 9:16

If you want to avoid the sliders, you can just opt for a very simple grid of checkboxes/radio buttons.

Something like this:

enter image description here

This makes it very easy for the user to understand exactly which options they are selecting for each language. I suggest adding some additional styling to the selected options to ensure they stand out from the non-selected options.

You could make an argument that there is repeated text in each box (via the "types"), although I don't think there is enough repeated text for this to cause a problem for the user. However, if you prefer you could move the "types" labels to be column headers, similar to what you have done with them in your example.

  • 5
    Given that they said "I'm doing the checkout process for a translation service company", I don't think OP gets to decide on the rates and pricing. Either way, there is a lot of difference in possible translation quality even with 100% standard spelling and grammar. I imagine cheaper options would result in more straight-forward translations, that may have awkward sentence structures and read less naturally, for example. The most expensive options might include additional content editing and generally more time taken by the translator to fine-tune everything.
    – Jasmijn
    Mar 31, 2021 at 21:05
  • 4
    take an example: the La Disparition novel contains no E in the original French and the translated English version. Other translations follow the same restriction which costs obviously more money. The cheapest solution is to translate just literally. Many books with good puns also need much more time to translate
    – phuclv
    Apr 1, 2021 at 3:07
  • @Jasmijn: I understand how different service levels could be done, it is more I don't understand the use-cases of the customers. I am struggling to think of an example (other than personal use) where you would want to compromise on the quality and accuracy.
    – musefan
    Apr 1, 2021 at 15:05
  • "If you want to avoid the sliders" — which you should, musefan's answer here is the best option.
    – minseong
    Apr 1, 2021 at 20:38

I think nobody will use calculator to select right price for translation to achieve total acceptable order amount. The first step is set all languages to maximal price and watching if final cost is acceptable. If not - the next step is lowering price of the most unimportant language. And so on. So we need to provide ability to easyly relocate languages between prices (or your translation Types). This couls be done by grouping translations by Type.

Initial grouping:

*Total: 30.00

Language Type 5
German 0.10
Chinese 0.20
Type 4
Type 3
Type 4
Type 1

Relocate one language to reduce total cost:

*Total: 25.00

Language Type 5
German 0.10
Type 4
Chinese 0.15
Type 3
Type 4
Type 1

And so on. You may add much more elements to improve usability, e.g. theoretical total cost for every Type to give user estimations for better choices (see below), or add group relocations, etc. Or even automatically group languages for user according his desired final budget.

*Total: 25.00

Language Type 5 (max 30.00)
German 0.10
Type 4 (max 23.00)
Chinese 0.15
Type 3 (max 20.00)
Type 4 (max 15.00)
Type 1 (max 7.00)

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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