Новости

Я использовал POE для воспроизведения небольшой игры, сложность: ноль|свежий тест AI.

2024-07-16

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina


Автор|Соль и перец Нефритовый кролик
Электронная почта |[email protected]

Когда вышел Claude 3.5 Sonnet, обновилась и функция демонстрации Артефактов. На тот момент я был шокирован эффектом демонстрации.

Что касается артефактов, они позволяют пользователям создавать и ссылаться на большое количество независимого контента в разговорах.

Когда мы спросили Клода о «Фрагменты кода, текстовые документы или дизайны веб-сайтов» и другой контент, Артефакты появляются в специальном окне, отображаемом рядом с диалогом. Если результат неудовлетворительный, мы можем немедленно изменить, повторить и улучшить творение Клода.


На рисунке показан эффект HTML, созданный Preview посредством диалога с Claude 3.5 Sonnet в Poe. Адрес диалога: https://poe.com/s/YEms220OFPLfoZhPKfLI

Теперь ожидание наконец пришлоPoe официально обновил функцию предварительного просмотра., эффект аналогичен демонстрации артефактов в реальном времени, а также поддерживает создание в реальном времени трех моделей: Claude 3.5 Sonnet, ChatGPT-4o и Gemini 1.5 Pro.


На рисунке слева показаны обновления Сонета и Артефактов Клода 3.5, а на рисунке справа — предварительный просмотр По.

Прерывая предложение, вот краткое объяснение.Что такое По?

Poe — это платформа искусственного интеллекта, запущенная Quora, североамериканским «Zhihu» (сообществом вопросов и ответов), в конце 2022 года. Через нее пользователи могут общаться с различными моделями искусственного интеллекта, включая такие известные модели, как ChatGPT и Claude. Первоначальная цель разработки Poe — предоставить разнообразную платформу для чата, позволяющую пользователям выбирать наиболее подходящую из множества моделей искусственного интеллекта для взаимодействия. Будь то задавание вопросов, просьба о помощи в программировании или непринужденное общение, Poe может удовлетворить это. . Когда Poe обновил функцию предварительного просмотра демо, я был так счастлив!


Сказав так много, мне не терпится рассмотреть несколько практических случаев.


1

Сценарий 1. Создайте красивую веб-страницу игры.

В Интернете мы часто видим различные сайты по сбору инструментов. Если бы существовал инструмент, который мог бы помочь нам легко создать собственный веб-сайт с коллекцией визуальных изображений, разве это не сэкономило бы много времени на программирование? Недавно я обнаружил игровой сайт. Каждый раз, когда я нажимаю на него, у меня возникает ощущение, что я открываю слепой ящик. На нем собраны различные игры, инструменты и сетевые эксперименты. Это просто идеальная коллекция игровых инструментов.

Мне просто интересно: Могу ли я использовать функцию предварительного просмотра Poe?Создайте живую демонстрационную страницу, подобную этой или даже создать веб-сайт с коллекцией инструментов? Чтобы проверить эту идею, я решил сначала создать статическую страницу. Это основной первый шаг!

Я использую Poe напрямую, чтобы поговорить с Сонетом Клода 3.5. То, что началось как чисто текстовый вопрос, породило текст и решения;


Позже я добавил: «Предварительный просмотр отображения непосредственно в разделе «Предварительный просмотр».», эффект в реальном времени был сразу же очевиден, и эффект был действительно хорош.

Совет: https://toms.toys/ Посетите эту страницу, создайте руководство по игре и отобразите его прямо в окне предварительного просмотра.


После его создания я попытался нажать на красные слова, но обнаружил, что щелчок не перемещается, поэтому сгенерированная веб-страница была статической, но выглядела на 80% похожей. Цвет логотипа в основном совпадал с цветом. другие индексные поля также были очень четкими, по крайней мере, они имели оттенок оригинальной версии Son.


Запись разговора: https://poe.com/s/Pe9cXFpmFHQqPAZhZOgU

Теперь, имея этот фундамент, я уже могу самостоятельно создать эксклюзивный веб-сайт с инструментами. Представьте себе, что на индивидуальном веб-сайте собраны всевозможные практические инструменты, и вы можете использовать их одним щелчком мыши в любое время и в любом месте. Это действительно удобно и круто!

1

Сценарий 2. Демонстрация анализа финансового отчета NVIDIA за 2024 год.

Раньше многие результаты финансовых отчетов анализа ИИ представляли собой текст. Теперь мы пытаемся использовать диаграммы, чтобы продемонстрировать эффект.

Подсказочные слова:

Можете ли вы проанализировать информацию? https://investor.nvidia.com/news/press-release-details/2024/NVIDIA-Announces-Financial-Results-for-Fourth-Quarter-and-Fiscal-2024/ и превратите ее в удобную интерактивную демонстрацию, чтобы помочь я понимаю это

Первоначально Poe's Preview использовал простую интерактивную демонстрацию основных финансовых показателей NVIDIA. Нажимая разные кнопки, вы можете просматривать графики выручки, прибыли и прибыли на акцию. Это довольно мощный инструмент, ничуть не уступающий Artifacts.

Оптимизированная профессиональная версия находится здесь. Она не только сравнивает различные показатели, но и предоставляет комплексный обзор финансового состояния NVIDIA, включая представление данных и профессиональный анализ. Общий эффект неплох, просто посмотрите на картинку.

Запись разговора: https://poe.com/s/NaFg8czE3NKSDu1vehH1

1

Сценарий 3: Изготовление карточек химических знаний

Я помню, что один из случаев веб-приложения, созданный официальным аккаунтом По,Карты знанийКарточки:

https://poe.com/s/HDAXQjBX9qmsInjjgV4X, почему бы не использовать это в качестве прототипа для создания карточки знаний по химии?


Изготовление карт также очень простое. После нескольких основных итераций проявятся эффекты. Основные итерации и модификации следующие:

  • Основная текстовая информация:На лицевой стороне карточек изображены понятия, а на оборотной стороне – пояснения к этим понятиям.

  • Слово:Предыдущий и последующий текст различаются по размеру, цвету фона и т. д.

  • тон:Общий цветовой тон — цвет Морана, который выглядит более комфортно.

Диалог с эффектом карты: https://poe.com/s/1TgDhUkoKmhjMq75yXhF

Внимательные друзья видят, что помимо перелистывания и взаимодействия я еще добавилИдентификатор пользователя, в режиме реального времени,Повышена уникальность и актуальность карты.


1

Сцена 4: Имитация анимации круговорота воды

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

Подсказочные слова:

Используйте React, чтобы анимировать циркуляцию воды. Чтобы усложнить задачу, добавьте смайлы или SVG.

Мне нужен компонент React для процесса водного цикла. Слева — анимация, показывающая четыре стадии испарения, конденсации, осаждения и сбора, справа — соответствующее текстовое описание; Используйте Web Speech API, чтобы добавить функцию автоматического воспроизведения речи, чтобы речевое содержимое соответствовало тексту. Анимировано с использованием SVG, каждый этап длится 8 секунд. Общий дизайн должен быть кратким, ясным и легким для понимания. Убедитесь, что анимация более плавная, а текст компактный.И просмотрите изображение прямо в разделе «Предварительный просмотр».

Процесс диалога: https://poe.com/s/OujTxBMnSknxHaqmBhXs

Не толькоАвтоматическая демонстрация анимации, рядом сКраткое описание процесса круговорота воды. , очень четко и отчетливо. Когда преподаватели преподают сложные концепции, они могут легко и интуитивно создавать презентации во время подготовки учебных материалов. Это экономия времени и труда для учителей!

1

Сценарий 5. Создайте собственный веб-сайт с инструментами декомпрессии.

Я просматривал веб-сайт два дня назад и нашел интересный веб-сайт. Этот веб-сайт отображает эффекты мыши в стиле 90-х годов. Он предназначен для отображения этого ностальгического эффекта мыши. Он показывает серию эффектов мыши, реализованных с помощью JavaScript, которые могут следовать за движением мыши или прикосновением пальца. Вы можете щелкнуть в любом месте, чтобы переключить различные эффекты, например эффекты радуги и т. д. Затем попробуйте использовать функцию предварительного просмотра Poe.

Подсказочные слова:

Создайте артефакт декомпрессии, это информация:

https://cursoreffects.com/

https://github.com/tholman/cursor-effects

Первый раз простой стиль:


Стиль первой версии был слишком простым, поэтому я попросил Клода 3.5 Sonnet украсить его.Были добавлены зеленые кнопки и белый фон, а количество эффектов мыши увеличено с 4 до 11.


Но в это время я обнаружил, что «текст» и «эффекты курсора» занимают весь экран, и я не могу лучше видеть эффект щелчков мыши. Продолжайте подстраиваться и скажите Клоду 3.5 Сонет:Освободите среднее пространство, продолжая улучшать визуальный эффект., существуют следующие 2 различных стиля эффектов.

Мы обнаружим, что цвет этой версии используетградиент цвета, в то же время очень освежающе; среднее положение также освобождается, и общий эффект довольно хороший.


эффект розового градиента


Эффект синего градиента

На самом деле, описанный выше эффект вполне удовлетворительный, но мне хочется, чтобы вся страница была более лаконичной. Если присмотреться, то обнаружим:

  • На всей странице много текста, а две строчки мелких символов посередине имеют перекрывающиеся значения, одно из которых можно удалить;

  • Приведенный ниже псевдоним со спецэффектами курсора занимает слишком много места и привлекает слишком много внимания. Его можно превратить в кнопку, которая меняется при нажатии игроком.

Затем я продолжил говорить Claude 3.5 Sonnet, что он должен быть кратким и ясным. Конечный эффект заключается в следующем: цвет относительно светлый, а контент, отображаемый на всей странице, относительно полный, без ненужного контента.


После окончательной оптимизации шрифт был заменен на более подходящий. Весь цвет фона был случайным образом градиентным, что было очень интересно.

Самодельный инструмент декомпрессии: https://poe.com/s/xPxoi0qCl4JVsXw3GxqV.

1

наконец

Будь то По или Клод, появление Preview/Artifacts делает экрантекст, кодвизуализировать,Этот шаг становится проще и легче реализовать.


  • Для разработчиков Artifacts может генерировать и исправлять код, сокращая время ручного написания кода;

  • Для совместной работы в команде возможность просматривать, редактировать и создавать контент в режиме реального времени на одной платформе значительно снижает потери при передаче информации.

  • Преподаватели могут использовать Claude 3.5 Sonnet для создания обучающего контента и презентаций, чтобы упростить производственный процесс. Студентам будет проще получить доступ к учебным ресурсам и использовать демонстрации в реальном времени, чтобы повысить свой интерес к обучению.

Будь то разработчики, коллективная работа или преподаватели, эффективность повседневной работы и жизни значительно повысилась. В жизни много таких сцен...


После того, как я закончил создание инструмента распаковки, я напрямую поделился самодельным инструментом распаковки со своим другом-программистом. Это был разговор с ним.


Он сказал: «Чтобы написать такой код, потребуется день», но сегодня я потратил на него максимум полчаса (PS: Code Novice). Разве это не начало своего рода проникновения ИИ в дома. из простых людей?

Мы с нетерпением ждем, когда в будущем все больше искусственного интеллекта будет проникать в дома обычных людей и во всеобщее видение.

Использованная литература:

  1. Официальный сайт По: https://poe.com/

  2. Введение в обновление Сонета Клода 3.5:

    https://www.anthropic.com/news/claude-3-5-sonnet

  3. Исходный артефакт декомпрессии: https://cursoreffects.com/

  4. Станция сбора и агрегирования кейсов Claude Artifacts Showcase:

    https://claudeartifacts.com/?category=Все

Poe официально создал ссылку на веб-приложение:

  1. Интерактивная презентация: https://poe.com/s/NlX2WRElDUvtuuMSFrZq

  2. Карточки знаний. Карточки: https://poe.com/s/HDAXQjBX9qmsInjjgV4X.

  3. Электронная драм-машина Drum Machine: https://poe.com/s/G4HshkCQCaXVfg0ndPZK

  4. Большой цветной коллайдер: https://poe.com/s/neKbyqEJYUtiRjeC6b5f