Off-Topic • Re: Tips: LiveCode and AI Chatbots

TIP 2: Prototyping Layouts using AI Chatbots

In both Claude and ChatGPT Plus AI's I have found that it is quite easy to prompt the AI to layout a UI for you. Here is a prompt and response from Claude for an old game I used to play on a teletype machine at university in the 70's which I remember as "Galaxy" but is more commonly called "Star Trek" or "Super Star Trek".

<Me: Suggest a color scheme for the UI for this game that would have a retro look.>

<Claude: Here is one suggestion for a retro color scheme for the Super Star Trek game UI:

- Background color:
- Dark blue (#000033) to look like space

- Button colors:
- Navigation/commands - orange (#FF950E)
- Other buttons - light gray (#D9D9D9) with dark gray (#A9A9A9) borders

- Status bars:
- Background: black (#000000)
- Foreground (level): green (#00FF00)

- Sector map:
- Empty sector - light gray (#D9D9D9)
- Enterprise sector - yellow (#FFFF00)
- Klingon sector - red (#FF0000)
- Star sector - white (#FFFFFF)
- Starbase sector - light blue (#00FFFF)

- Text:
- Headers/titles - yellow (#FFFF00)
- Messages - white (#FFFFFF)

- Borders:
- Buttons - dark gray (#A9A9A9)
- Message box - light gray (#D9D9D9)

This uses a limited color palette with bright primary colors on dark backgrounds to create a retro sci-fi feel. The dark blue background represents space, while the bright colors stand out on top of it. >

Additionally the AI can suggest positions and size of the UI elements for a given screen size. You can even ask for a LiveCode script to generate the layout if you want, which is kind of cool. For me I use it to iterate through concepts relatively quickly. Hope this gives you some ideas.

Happy Coding,

Mike

Statistics: Posted by Hutchboy — Thu Sep 14, 2023 2:52 pm

---