Expandable card #1129
-
|
We're moving the Pricing page to paste and the layout uses cards. Here is the collection. Wanted to get general feedback that there is no issue with this approach? Screen.Recording.2021-01-25.at.3.53.34.PM.mov |
Beta Was this translation helpful? Give feedback.
Replies: 4 comments 6 replies
-
Beta Was this translation helpful? Give feedback.
-
|
Hi Jo, for this current iteration, the ask was to just move from PHP to Paste - we did not have the bandwidth to do a full overhaul. For the moment, the page will have the same products it does currently. |
Beta Was this translation helpful? Give feedback.
-
|
Hi @PoojMenon Can I start by asking; Why do you feel it's necessary to partially collapse the content, over showing all the text by default or implementing a fully collapsible Disclosure? |
Beta Was this translation helpful? Give feedback.
-
|
Hi @PoojMenon , following up here for documentation purposes, what did you decide to go with? |
Beta Was this translation helpful? Give feedback.
-
|
Sorry for the delay - I seem to have missed the original notification. The reason for this approach was to avoid cards of different sizes on the page. I also didn't want to increase the size of all the cards to accommodate the one card that has lengthier text. This is what it currently looks like: |
Beta Was this translation helpful? Give feedback.
-
|
Hey @PoojMenon - I'm not sure what degree of change is in scope for this work, but could you consider updating the page to follow some of the design patterns on the new Explore Products page in Console.zen?
Or, at a minimum, perhaps you can pull some of these shorter product descriptions into this pricing page to eliminate the issue entirely. There is definitely some copy clutter that could be trimmed down here (for example, the Programmable Chat description opens with, "Twilio Programmable Chat allows you to embed..." while the Client description just starts with "Embed..."). More concise, consistent product descriptions will improve the usability of this page, too. |
Beta Was this translation helpful? Give feedback.
-
|
And one unrelated piece of feedback: since you're doing a full-page overhaul, I'd recommend moving this to the Default theme in Paste rather than using the legacy Console theme, if possible. |
Beta Was this translation helpful? Give feedback.
-
|
Hi Katie, thanks for this feedback. Reducing the copy clutter was definitely something I was hoping to do. Unfortunately, when I picked this up last quarter, the ask was just to take the existing page which was in PHP and translate it to Paste. The degree of change thats possible now would be fairly small. We do plan on revisiting the page in the future, so I will keep your comments in mind. All the Billing pages are currently using the console theme, but we're in discussions with the engineers to update to the the default theme in the very near future. |
Beta Was this translation helpful? Give feedback.
-
|
Gotcha. If this is definitely the route y'all need to go, you can accomplish the desired functionality with the Disclosure primitive. One thing to consider is that it'd likely be more expensive to implement that functionality than it would be to copy over the product descriptions from the Explore Products page and keep these as static cards. I'd recommend that approach if at all possible, as it removes the unneeded complexity of the "show all" disclosure, and I would imagine the cards changing height could create some funky implications to the rest of the page layout. |
Beta Was this translation helpful? Give feedback.
-
|
Thanks Katie. I'll discuss these options with the engineering team. |
Beta Was this translation helpful? Give feedback.
Hey @PoojMenon - I'm not sure what degree of change is in scope for this work, but could you consider updating the page to follow some of the design patterns on the new Explore Products page in Console.zen?
Or, at a minimum, perhaps you can pull some of these shorter product descriptions into this pricing page to eliminate the issue entirely. There is definitely some copy clutter that could be trimmed down here (for example, the Programmable Chat description opens with, "Twilio Programmable Chat allows you to embed..." while the Client description just starts with "Embed..."). More concise, consistent product descriptions will improve the usability of this page, too.