The AI Playground Part 2 - 10 more ways to get hands on experience

🧠 Knowledge Series #61: Do live interview prep, identify compliance risks, build productivity apps with Grok, Perplexity, Replit, Deepseek and more

🔒The Knowledge Series is available for paid subscribers. Get full ongoing access to 60+ explainers and tutorials to grow your technical knowledge at work. New guides added every month.

---

Hi everyone 👋, it’s been a few months since the last AI Playground which went on to become one of your favorite DoP posts ever. Since then, AI tools have shipped even more new features and capabilities.

The idea behind these special Knowledge Series tutorials is simple: to bring you up to speed with the latest AI advances by giving you some practical, real-world examples that you can try out yourself. Reading about the latest developments in AI is one thing, but getting your hands dirty and building something is quite another.

To keep this as relevant and practically applicable as possible, most of these examples focus on things you can do and build with AI at work, with a few extras thrown into the mix as well. From prepping for a live interview with Google Gemini, to staying CCPA / GDPR compliant using reasoning models, these practical examples designed specifically for product teams should help you both keep up to date - and get ahead at work.

Coming up in this new AI playground, learn how to use AI to:

1. Transform your voice

2. Create an information architecture diagram with Grok 3

3. Build a simple project management app

4. Write a customer needs report with Perplexity Deep Research

5. Identify CCPA / GDPR compliance risks in your user journeys with Deepseek

6. Build a customer service AI agent in Replit

7. Create reports and data visualisations without using SQL, Google Sheets or Excel

8. Create high quality visuals with professional grade Midjourney prompts

9. Automatically enrich your product FAQs

10. Practice a live job interview with Gemini Live voice mode

---

The Knowledge Series

1. Transform your voice

First up, something that on first glance seems a little left field compared to the other examples that we’ll cover. If you don’t like listening to your voice back on any recordings that you have to do at work (think product demos, meetings or anything else where your voice is recorded), it’s now very simple to just change it.

Here’s a snippet of my voice taken from a recent YouTube video:

And here’s the transformed version of it using a pre-built voice from ElevenLabs’ library called Glinda (there’s probably a copyright infringement pending from Wicked’s producers but we’ll ignore that for now):

The result is both impressive and fairly terrifying. Sure, voice changing has been around for a while but it’s the simplicity and the scale of voices on offer that is impressive here; Glinda is one of hundreds of different pre-built voices that ElevenLabs now has in its library and you’re able to transform your voice into any of the available voices on offer.

How this might be helpful at work

While it’s helpful to just use this as an example that helps you to keep up with the current capabilities of generative AI, this might also be helpful for different types of product-related work.

You might want to create rich sets of user personas to bring your product to life in marketing videos or you may want to switch up the tone of voices to cater to different users during a user research session. Product demos and sales materials may also benefit from tailored voices, not to mention the various ways they could be used in marketing campaigns tailored to different user groups.

2. Create an information architecture diagram and pricing table with Grok 3

xAI unveiled Grok 3 last week and if you haven’t managed to play around with it just yet, it’s definitely worth a try. Whatever your thoughts about the company’s polarising owner, Grok is an AI product that’s essential to know about, especially since it beats other chatbots on existing benchmarks (for now) and overall is lightning fast which makes it feel a lot better than other tools.

I recently took it for a ride and found its ability to crawl websites to be particularly powerful. For product teams, one area this capability can be super helpful is in information architecture design.

Information architecture and navigation

Let’s imagine you’re currently working on a project to optimize your product’s navigation after customer feedback and declining conversion rates led you to conclude that the navigation was in need of a refresh.

You can Ask Grok to visit a website, create a copy of its navigation architecture and then transform that into a clickable diagram to use in UX discussions.

Here’s the prompt we can use to get started:

I'd like you to visit a website and create an information architecture diagram based on its sitemap. Does this sound ok to you?

Grok then lets you tell it which website to focus on. In this example we’re using the Shopify website. Here’s the result it gives us:

Using this as our starting point, we can ask Grok to transform this plain text version of Shopify’s information architecture into a clickable prototype version that would be a lot easier to work with in stakeholder discussions.

Here’s the prompt I used for this:

Generate an interactive taxonomy tree visualizer of this website's information architecture. Design it horizontally and allow me to click each of the parent pages to expand the child pages. Color code it in a way that makes sense. Use CSS, JS, and HTML. In a single HTML file.

It’s important to ask Grok to combine everything (CSS, JS and HTML) into a single HTML file or else it will create these separately.

The result is a clickable, color-coded version of Shopify’s navigation / information architecture that you can then use for further analysis.

As well as using Grok for transforming Shopify’s information architecture into a clickable prototype, you can also paste the original plain text result into Miro and use Miro’s AI features to transform this into a tree diagram which is also helpful. Here’s an example of this:

Pricing strategy and table optimization

Using the same rich text output that we started with for the information architecture diagram, we can ask Grok to dive deeper into Shopify’s offerings to help us with another use case: pricing strategies and packaging.

If you’ve ever worked on crafting a pricing strategy you’ll know that a critical part of that discussion lies not only in the pricing but in how those prices are displayed back to users in pricing tables.

We can ask¹ Grok to help us optimize our pricing strategy and tables. First, we ask Grok to build a pricing table based on what it already knows:

based on what you know about shopify's product offerings, create a pricing table that clearly explains each product

In the response, Grok creates a table of all of the prices on offer. And with this, we can ask Grok how it thinks we should change this to optimize our pricing strategy and maximise revenues:

imagine you're looking for ways to simplify this pricing table and maximise the amount of revenue generated for each one. how could we do it?

Grok suggests a whole bunch of ways we can optimize our pricing tables, including suggestions to streamline plan names, de-couple add ons, reduce feature overload by trimming down the number of key differentiators and anchoring the pricing with more expensive tiers.

Armed with Grok’s suggestions, we can ask Grok to bring this to life by turning it into a clickable prototype that we can use to articulate the different versions to stakeholders:

design the pricing table in html, css, JS. create 2 versions: 1. Version 1 is the original 2. Version 2 is the amended, simplified version. combine everything into 1 single html file with html, css and js all saved together

The end result is a clickable prototype that lets us toggle between the two versions.

3. Build a simple project management app

Text-to-code tools are booming at the moment. And for non-engineering members of product teams this means it’s simpler than ever to build basic prototypes. In this example, we’ll build a project management board that helps us keep track of our progress as you might do in Notion, Jira or Trello.

Here’s the finished result that we’ll build in just a few minutes:

For this prototype, we’re going to use Loveable. Loveable comes with a natural language chat interface that allows us to build simple apps from scratch without ever needing to code.

We’re going to start with a simple prompt: