Pricing / Subscription Page

User Experience / User Interface / Marketing

se-laptop-inapp.png

Task

Create a pricing page for the SE marketing site to provide insight on the different plans. In addition, create an in-app experience that has a similar interaction as the marketing site.

Company

Ship Engine is a powerful API for shipping and logistics. They current market to developers to provide some of the best integrations for shipping rates.


Wireframing

Understanding that a similar UI had to be present for both the marketing site and in app was important for this project. I also worked to create responsiveness and how the site would respond on screen sizes even down to mobile screens.

I worked with the Marketing Team to write copy and the CEO and stakeholders to ensure we were providing an adequate experience.

Examples from desktop to mobile


Marketing Site

The marketing site was a ton of fun to add color and tighten up the design. Working closely with a copywriter definitely helped to ensure consistency across different pricing plans. Here are a few examples of where we landed in terms of UI and the responsiveness of the design.

 
 
se-laptop-marketing.jpg
 
 

In App Pricing Subscription

The experience within the web app had to match the experience on the marketing site, so it felt familiar to the user. It looked like this:

  1. Navigate to Account Settings and view your current plan

  2. Confirm upgrade

  3. Enter billing information if it wasn’t already on file

  4. If user upgrades to an Enterprise Plan, they must send a note about the company in order get a sales representative to reach out to provide a quote.