A Simple Hack to Use AI to Improve Website Design
Can you AI help you with website design? If so, how can we get AI platforms like ChatGPT to have a look at our website designs and give us constructive feedback and novel suggestions for improvements.
Many of us see AI as a tool for answering questions or solving straightforward problems, but it can also act as your personal design assistant. I want to walk you through how I use AI to get fresh insights into design side elements of our business, in this case on Wealthy Affiliate’s interface and layout.
Step 1: Introducing AI to Your Design Challenge
AI tools like ChatGPT can provide perspective that you might not have considered when improving your website’s design. Here’s how I approached it:
- Scenario: I took a screenshot of the Wealthy Affiliate interface (back office and menu structure) and uploaded it to ChatGPT.
- Prompt: I asked the AI to act as an expert website designer and UX specialist, providing solutions for a better interface that’s more intuitive for our users.
Here’s what I typed:
"You are an expert website designer and UX specialist. I want you to help me come up with solutions for a better interface design and one that is much more understandable to our end users. I am the owner of Wealthy Affiliate, and this is the current interface in the back office and menu structure."
Step 2: Reviewing AI Feedback
The AI delivered detailed suggestions based on the interface I shared. Here are some key takeaways from this.
- Prioritize Clarity in the Menu:
The AI noted that the menu structure could feel overwhelming due to the variety of icons and labels in close proximity. It suggested grouping menu options into collapsible sections (e.g., "Training," "Community," "Tools") to streamline navigation. - Streamline the Dashboard:
The AI observed that the dashboard presents too much information at once, potentially overwhelming users. It recommended: - Adding quick-access cards (e.g., "Continue Learning" or "Your Next Action").
- Moving elements like "Recent Questions" and "Live Chat" into dedicated community tabs to reduce clutter.
- Simplify Visual Design:
Clean, minimalist designs with less clutter were recommended to make the interface more intuitive. - Introduce Activity Analytics:
The AI suggested integrating analytics that allow users to track progress, which could motivate them to engage more with the platform.
Step 3: Digging Deeper on Suggested Improvements
One of the best aspects of using AI is the ability to probe further.
For example, I asked:
"How would you appropriately group the current menus within Wealthy Affiliate in a way that would make sense to the end user?"
The AI responded with a detailed architecture for menu grouping, suggesting categories like:
- Training: Core lessons, advanced classes, tutorials.
- Community: Live chat, forums, success stories.
- Tools: Keyword research, content templates, website builders.
This kind of iterative dialogue allowed me to refine and explore ideas that I might not have thought of on my own.
Step 4: Testing and Implementing AI-Driven Ideas
Once I had these suggestions, I began thinking about how to test and implement them:
- Sketch New Layouts: AI can analyze even hand-drawn sketches of potential designs and provide feedback.
- Iterate on Concepts: Ask follow-up questions to refine ideas and gain insights into coding, layout, or usability.
- Prototype Changes: Using tools like Figma or Adobe XD, I could translate these ideas into prototypes for user testing.
Why Use AI for Design?
AI acts like an extra set of eyes (or an unbiased consultant) that can help you, where you can get quick "design audits".
- Spot areas of improvement that you might miss.
- Generate new ideas for organizing or presenting content.
- Offer detailed suggestions for layout, usability, and functionality.
Even if the AI’s feedback isn’t always perfect, it often sparks new ideas and provides a fresh perspective that can lead to innovative solutions.
Have you used AI tools for website design or other creative projects? If so, I’d love to hear about your experiences. Drop your thoughts in the comments below, and let’s discuss how AI can help us all create better, more user-friendly designs. Looking forward to your feedback!
Recent Comments
29
Another advantage I found is that ChatGPT's generated HTML code is better organized into sections and not all on one line like Blogger that you have to first sort out before you can adapt it. :-O I once asked ChatGPT to create me a table to display a picture on one side and text on the other. I tried it first myself and made a mess-up as the text block was not the right size. After copying and pasting the code provided the results were perfect! AND I could change minor details without accidentally deleting part of the code!
AI can certainly help us with much much more than just content ideas and creation Kyle!!
Appreciate you sharing your prompts here..... I will give them a try (tailored to my needs obviously) in the the coming days!!
Enjoy the rest of your week buddy! :-)
👍👍
Thanks Kyle!
After watching this, I gave it a try on my website and it gave me a lot of suggestions. I've been using GPT for sometime now and it's has been my friend for almost everything I do but not for website design. Now I can use it for website design also.
Thanks again Kyle, appreciate your continuous support.
Polenia
That is absolutely amazing, Kyle. I use Chat GPT and also Co-Pilot. Do you feel it is worth upgrading to the $20.00 level? At this time, I am just a free member. If you could let me know your feelings on this I would appreciate it.
Or, anyone else that reads this can certainly give their opinion about upgrading.
Thank you, Kyle.
Mike
If you have the budget for it, yes. It is markedly better using the Plus version (as you are getting the latest models, including the deep thinking models), you can create customGPT's, personalize your GPT account, and also perform real time web searches and generate images.
So if it is within your budget, I would go for it. :)
See more comments
Hi Kyle:
I like what you have done in this "A Simple Hack to Use AI to Improve Website Design" session. That's one of the ways I utilize ChatGPT, not just for business but in other areas.
For example, I would take a picture of an object, upload it for ChatGPT to tell me about it. I use the information it provides in my creative content, if that's the purpose I'm using it for. Otherwise, it's useful information I didn't have before.
I've found what you've said in the following quote to be true: "Even if the AI’s feedback isn’t always perfect, it often sparks new ideas and provides a fresh perspective that can lead to innovative solutions."
Thank you for sharing!
Veron