Today we’ll address one common question we receive from our clients regarding how to use a creative designer to redesign clear, concise and attractive price list that converts. Let us guide with some real examples on how to design price list.

How-to-design-a-price-list

The above example raises some issues on the price list table.

  • The font and style of the price table visually not attractive and hard to read.
  • This price table providing 8 different options to choose from. We make users confused by providing more than three options. Users now prefer to exit from the landing page rather than participating.
  • Short form of the text is a conversion killer. As a website owner we can understand the term “TBC” but for a new user “TBC” means nothing. The better approach is to write the full form of the abbreviation.
  • When a user lands on a page like price table we expect user should get all information about the package they want and take next logical step in the form of ordering the service or request for a quote. But the above example contains no clear call-to-action and no guidance to its user about the next logical step.
  • Placing multiple call-to-actions on a product or service price listing page is a conversion rate killer. Like on the above example, the website owner placed a pop-up chat of “Ask us anything” is not recommended by conversion rate optimisation experts.
  • The pricing table must look compact, easy to read, compatible to smart-phon- iPad type devices. Whereas, on the above example, the overall look of the table is scattered and confusing. No clear direction for users.
  • The trust factor is missing from the example price table. The website owner not able to display the credibility of the website and their services. To convince users one should place trust icons, testimonials etc.

To develop and design price list that converts more, we recommend to follow these steps:

Step 1:  Analyze existing price list visitors

– Check your Google analytics report about the price list page performance. You can review the “in page analytics” to users the click and mouse movement behaviour. Alternatively, you can install Crazyegg heat map analysis tool to get an advanced view. This information will help to design price list that is user-friendly.

Step 2: Develop a hypothesis for price list page

– Once you have the data about the landing page you can now create hypothesis document. This hypothesis document contains the changes need to implement on the page with clear reasoning.

For example, you found that the bounce rate is more than 80% on the page and users are not scrolling down the page. This means, the content that is displaying on the fist fold of the landing page is not effective enough to engage users. So, you need to first work on the first fold of the website.

Step 3: Create price list wireframe

– Once you have your hypothesis ready then it’s time to create a wireframe for the landing page. This wireframe will contain the structure of the revised landing page. You can use Balsamiq wireframe development software to sketch your findings.

wireframe-example-of-price-list-by-web3solution

Step 4: UI/UX design price list

– Once you have the wireframe ready then using professional creative UI/UX designer you should design the landing page. The designer will deliver you the final mock-up in a Photoshop (PSD) format.

Remember, your marketing expenses ultimatum goal is to convince users to visit this pricing table page and place an order. So, don’t compromise with the quality of this landing page. Hire experienced professional designers who can charge you high but you need a high converting price listing landing page.

Step 5: Implement price list design

– Once you have the design ready with professional developer convert the PSD to HTML and then integrate on the website. Make sure your landing page loading time is less than 3 seconds; the landing page is responsive in nature and profound from the security aspect.

Few good examples of pricing tables:

pricing-table-good-example-by-web3solution

 

pricing-table-from-crazyegg-good-example-by-web3solution

Step 6: Keep testing

Once you implemented the new design test how users are considering the new landing page. To monitor effectively, you can use Google analytics or Crazyegg. Also, to keep on testing new elements for A/n testing you can use the platform like VWO. Remember, nothing is perfect and we always have a room for improvement. So, keep on testing and design price list.

Conclusion

When you’re redesigning a landing page stop using your guts feeling. Use analytical data to understand what your users are thinking about your landing page and then make a plan about redesigning your landing page.

Don’t have time to implement? We’ll do it for you. Seriously!

Contact us Now !