Allow apinf.io user to see pricing information

[bajiat]

User story

As a business owner, I need to communicate the price for API calls over a period to API owners so that they can easily understand the price and quickly judge whether they want to use APInf or not.

Depends on selection made for #2642.

Goal

• API consumer can see that calling APIs is free and can find a clear call to action: e.g. browse APIs.
• API owners can see the free tier and paid tier and can find a clear call to action: e.g. add API.
• Pricing information is only shown on apinf.io. Refer to #2642 for more information on options.

Wireframes

Pricing option appears in front page in between Latest APIs section and Contact form section. Pricing section can be enabled to appear in front page via settings. The free and paid schemes appear in the pricing section. Schemes can be customized from pricing module under settings. For Free scheme, the CTA is Browse APIs (to hook newcomers in APInf to look through the catalog page. when they wish to bookmark or get API key, we prompt them to register/sign in. For paid scheme, the CTA is to sign up to add API.

[Nazarah]

interested.

[Nazarah]

@bajiat apart from estimated API call amount, what are the possible fields that should be included in the price calculator?

[Nazarah]

@bajiat Does pricing need to be in the front page? I am looking at this example here which navigates users to a separate pricing page where all pricing offers are explained in details with a calculator to sum up the cost as per your need. Since we are allowing customer to plan their pricing scheme, I recommend to have something similar. We can always have a placeholder in front page container which would hook user to navigate towards this pricing page.

A similar pricing design is also in Heroku, where they have an interactive cost calculator hosted in a separate page than frontpage.

I'd like to go with the above approach. Since calculation needs extra effort, it should be hosted in a dedicated place, so front page content doesn't create distraction for the customer.

I also suggest to make a separate task to create a price table settings UI and related functionality. the tasks for configuring the price via a separate UI and showing the final schemes in frontpage should be different.

[Nazarah]

I have a few questions that need answer:

1. Do you want the pricing option to be in platform front page (apinf.io) or in apinf's organization website (apinf.org)
2. Although we would have cost calculator to customize enterprise (organization scheme), do you want to add a monthly and yearly payment system? In this way, with the yearly scheme chosen, you can offer some discount in the overall price
3. do you want to keep in trial period in enterprise and dedicated price schemes?
4. Usually one of the pricing schemes are recommended for new customers based on what other customers have chosen or as part of company's promotion (e.g. great value, most popular, etc.). Do you want any option like this?

[bajiat]

Let's opt for the simplest possible solution to show a pricing table without calculators (free tier and price per calls when free tier is exceeded), but the pricing needs to be configurable so that it can be left out in deployments where it should not be included.

[bajiat]

Is it enough if branding has a field for custom HTML for now for us to be able to show pricing information on the front page? Other deployments could use it for other purposes (e.g. their news on front page).

[bajiat]

@Nazarah Please create an issue for the wireframe so that you can close it when the wireframe has been added to the main issue. I will move this issue back to the Planning column.

[Nazarah]

On it.