GPT-4: Every Product Manager’s New Co-pilot in UX Design

Florian Knauseder
Bootcamp
Published in
3 min readSep 28, 2023

--

Just three days ago, OpenAI rolled out an intriguing feature for GPT-4, enabling image uploads within prompts. As you can guess, the tech world was buzzing. Twitter was ablaze (and hey, Elon, I’m with the crowd that’s not quite on board with calling it ‘X’ yet) with people showcasing this feature’s potential.

I watched in awe as McKay Wringley transformed a whiteboard sketch into a functioning application and coded an entire SaaS dashboard in seconds. Curious? Check out the demonstrations here: https://x.com/mckaywrigley/status/1707047423863136687?s=20.

Naturally, my inner Product Manager kicked in, pondering over how this GPT-4 enhancement could be a game-changer for my role. I found myself gravitating towards its potential in evaluating the UI of apps and landing pages. I delved into the landing pages of notable apps such as Uber, Airbnb, and Booking.com. In the end, I was drawn to Canva’s landing page because it was easy to understand and had lots of diverse sections. However, the choice of landing page or app section might be less pivotal; I believe the insights GPT-4 provides would be consistently insightful across different platforms.

Step-by-Step: My Experience with GPT-4

1. Capturing the Website in a single Screenshot

I have to admit, I ran into a small hickup here. I had no idea how to take scrolling screenshots of an entire page with all its elements above and beyond the fold. MacOS doesn’t offer this feature out of the box. My rescue? A handy app named “Shottr”. It’s free and super user-friendly.

Canva Landing Page

2. Engaging ChatGPT with the Image

Having secured the screenshot, I proceeded to upload it to ChatGPT via GPT-4. A heads up for enthusiasts: this feature, at the moment, seems accessible to paid members and might require some location tweaking (a U.S. VPN did the trick for me).

3. Crafting the Prompt

With the image in place, it was time to guide ChatGPT. My prompt was straightforward:

GPT4 prompt to analyse the UX/UI of Canvas Landing Page

“You are an expert in Product Management and UX/UI Design. Help me analyse the following landing page from Canva. Break down each section, give feedback on the areas that you see as well done and provide critical feedback. Now take a deep breath and start.”

4. Decoding the Feedback

ChatGPT’s comprehension was, to put it mildly, astounding. It didn’t just grasp the landing page’s essence but offered pointed feedback on each segment, from what shone to what could shine brighter.

5. Unpacking Conversion Insights

My engagement with this virtual ‘Senior AI UX Designer’ was just warming up. I probed deeper, asking about the landing page’s primary conversion goal and strategies to bolster it.

ChatGPT initially dished out generic improvements, somewhat reminiscent of conventional ‘best practice’ guides. Not settling, I nudged for specifics.

The outcome? Profoundly insightful.

The AI didn’t merely pitch an idea. It detailed the reasoning, the implementation strategy, and even emphasized prototyping, user testing, and A/B analysis for measured results.

A Glimpse into Tomorrow

Reflecting on this experience, I’m left contemplating. If ChatGPT couples its insightful feedback with its coding abilities, could it soon offer ready-to-integrate code for proposed UI enhancements? Imagine the possibilities: tweaks and changes, all at the simple act of copy-pasting!

Indeed, we’re navigating exciting waters in tech and product management.

--

--

PM with a Finance background, built an M&A marketplace for SMBs. Now venturing into freelancing. Finds balance on surfboards & snowy slopes.