I'm designing the UX of 3 different services. Service1 consists of face to face lessons while Service2 is an online program (they aren't equivalent), therefore, both will never be selected. Inside Service1 the user can choose a different amount of classes per month and inside Service2, the user can pick a program duration between one month upto 3 months. Service3 offers another kind of course that can be paired with both of them or by itself.
- Service 1: single month subscription with a slider that shows the price per lesson.
- Service 2: subscription that ranges from 1 to 3 months, includes a dropdown select with pricing of this service by itself and pricing of this service + service 3.
- Service 3: single month subscription.
I'm finding difficult to give the best UX because of the possibility to pick single month subscriptions with upto 3 month subscriptions and that I want the discount applied to be visible when these services are paired.
- If user wants service 1 + 3: clicks buy both in service 1 + 3 buy buttons = both are per month subscriptions.
If user wants service 2 + 3:
Selecting multiple months from service 2 and the single month subscription from service 3 = problem. What I've tried:
- Idea A: user selects service 2 +3 from the dropdown in service2 without clicking on service3, the sum of both services, their duration and discount appears in each option from the dropdown.
- Idea B: user selects the duration of service2 and also clicks on service3, (service1+3 work currently like this). The problem with this one is that service3 by itself is only offered as a month subscription, so picking several months of service2 wont by at sync with service3.
Sorry if this gets confusing and thank you for your help.
EDIT: updated details thanks to geostocker