In my latest screenshare, I demo how to leverage GPT-4's image input capabilities to create a complete set of Storybook components.
For the first step, I use GPT-4 to translate the image into a detailed text description of the components, caching the results to allow users the option to select a different model for story generation if desired. For the example image, I used a screenshot from a free Webflow template design.
The second step involves generating multiple stories using Bootstrap 5 markup and integrating them into a page component for demonstration purposes. After some prompt tweaking, I was impressed with how well Gemini's API produced components that looked pretty decent without errors. Check it out!
Links:
DrupalX Project Github: https://github.com/drupalninja/drupal...
DrupalX Drupal.org Project: https://www.drupal.org/project/drupalx
DrupalX Gitbook Documentation: https://drupalninja.gitbook.io/drupalx
DrupalX Storybook: https://drupalx.netlify.app
DrupalX Demo: https://drupalx-demo.netlify.app