Deidre Wong


Work





2019
Brand


2018
UI/UX



Personal projects


2017
UI/UX

2016
 Brand




Other




Contact


︎

︎

︎


About


︎

︎︎︎




Pricing estimation tools 


In alignment with Chainstack’s commitment to provide Web3 infrastructure services at highly competitive and transparent prices, pricing pages and calculation tools were designed to allow users to easily compare plans, check pricing particulars, and estimate their final bill based on node usage volumes and utilised services. Three types of cost estimation tools were created to assist users in selecting the most suitable plan according to their needs.



Usage cost calculator



This tool was created to enable users to estimate their usage cost and narrow down suitable plans.




Competitor pricing comparison tool



This tool was created to allow potential customers to compare prices against the competing services.

First iteration: Floating widget calculator


It started with a simple widget with only 2 variables:

  1. Slider allowed users to indicate request volume, with the total cost reflected in real-time.
  2. Users can easily switch between different competitor companies for easy comparison.





Second iteration: Full web section with additional variables 


For the second iteration, the Product Marketing team wanted to allow potential customers to specify node types and request methods for more accurate pricing predictions. 

The following functionalities were added in:
  1. Allow users to indicate node type (Full or Archive)
  2. Enable users to select and input popular request methods

As the additonal variables would not fit into a widget, the calculator tool was expanded into a dedicated web section.

The redesign allowed for a more comprehensive and user-friendly experience, enabling users to conveniently input and manipulate all necessary variables to obtain accurate an calculation. 

This was the final layout chose for this feature. 





Other iterations: compact layout, centered layout, layout with 2 competitors



Compact layout


Centered layout




Layout with 2 competitors










Cost estimate calculator



A bill calculator lets users obtain a detailed estimate on their final monthly or annual bill based on usage patterns, products and services used.

Playable prototype available on request.









Pricing page



The second most visited page on the website, the pricing page yielded better conversion results when providing a holistic overview of platform features such as supported chains, key information on hosting options, and API add-ons .


The aim


Allow users to easily compare plans and make a plan selection.

The pricing page also contains information on products and services add-ons.

First iteration


The first iteration of the pricing page was introduced at a time when there were only 4 supported chains. 
 
As the number of public chains grew, the layout was intentionally retained as it effectively  grouped and displayed included chains and available node types by plan. 

As the number of supported public chains increased to 26, impacting the length and legibility of the first iteration design.






Updated design


The pricing page is redesigned with the following objectives:

  1. Simpler summary of plan features
  2. Moving away from characterising each plan based on protocols supported, and breaking down available features by protocol.
  3. Moving away from the image of being only a node provider, and presenting Chainstack as a company providing complete Web3 infrastructure services by giving emphasis on new products and services.

A new layout is introduced, giving way to cleaner look with less information.