draw a ui

рисовать

Это приложение, которое использует API TLDRAW и GPT-4-Vision для генерации HTML на основе каркаса, которую вы рисуете.

В настоящее время я работаю над размещенной версией Draw-A-UI. Вы можете присоединиться к списку ожидания на Draw- UI.com. Ядро его всегда будет открытым исходным кодом и доступно здесь.

Это работает, просто взяв текущий Canvas SVG, преобразовав его в PNG и отправив этот PNG в GPT-4-Vision с инструкциями, чтобы вернуть один файл HTML с Tailwind.

Отказ от ответственности: это демонстрация и не предназначена для использования в производстве. У него нет аути, поэтому вы будете разорваться, если вы развернете его.

Начиная

Это приложение Next.js. Чтобы начать запустить следующие команды в корневом каталоге проекта. Вам понадобится ключ API OpenAI с доступом к API GPT-4 Vision.

Обратите внимание, что это использует Next.js 14 и требует версии node более 18,17. Прочитайте больше здесь.

 echo " OPENAI_API_KEY=sk-your-key " > .env.local
npm install
npm run dev

Откройте http: // localhost: 3000 с вашим браузером, чтобы увидеть результат.