📦

animate

Name: animate
Author: emilkowalski

Ревизия содержимого r1 Безопасно ⚙️ Внешние команды🌐 Доступ к сети

Build Purposeful Interface Animations

Interface motion often feels slow, distracting, or inaccessible when timing and tools are chosen without a clear process. This skill produces focused implementations with proven animation recipes.

Поддерживает: Claude Codex Code(CC)

🥉 77 Бронза

Установить с помощью моего Агента

Скопируйте этот запрос в своего Агента. Он содержит каноническую страницу Skill и манифест.

Запрос агента

Review the Skillstore skill "animate" from https://skillstore.io/skills/emilkowalski-animate.md and its manifest at https://skillstore.io/api/skills/emilkowalski-animate/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.

Ваш Агент по-прежнему должен показать план и запросить все подтверждения, требуемые политикой безопасности.

Ресурсы для AI-агентов

Используйте эти ссылки, когда AI-агенту, crawler или script нужен чистый контекст вместо полной страницы.

Markdown-детали GET /skills/emilkowalski-animate.md Подписанный manifest GET /api/skills/emilkowalski-animate/manifest Подписанный lockfile GET /api/skills/emilkowalski-animate/lockfile

Протестировать

Использование «animate». Add animation when a settings popover opens and closes.

Ожидаемый результат:

A 200 millisecond opacity and scale transition uses the existing ease-out token, trigger-based origin, symmetric exit, and reduced-motion fallback.

Использование «animate». Animate a command palette opened hundreds of times each day.

Ожидаемый результат:

No animation is added because the interaction is frequent and keyboard initiated. The palette changes state immediately.

Использование «animate». Create drag-to-dismiss motion for a mobile sheet.

Ожидаемый результат:

The sheet tracks direct transforms, uses velocity and distance thresholds, captures the pointer, resists over-drag, and settles with a spring.

Аудит безопасности

Безопасно

v1 • 08.08.2026 Открыть версионный отчет

All 47 static findings are false positives caused by Markdown backticks, code fences, animation syntax, ordinary prose, and documentation links. The reviewed files contain no command execution, reconnaissance, network requests, data exfiltration, or prompt-injection attempt.

Просканировано файлов

525

Проанализировано строк

Пункты проверки

Ложные срабатывания проигнорированы

Факторы риска

Последний завершенный статический и семантический аудит не обнаружил подтвержденных проблем безопасности. Это не доказывает отсутствие побочных эффектов у навыка.

Аудитор:: codex

Поделиться и цитировать этот отчет

Делитесь версионным отчетом об оценке, нейтральным значком, встраиваемой карточкой и цитатами. Skillstore публикует доказательства, не решая, безопасен ли этот Skill.

Открыть версионный отчет

Копировать ссылку на отчёт

https://skillstore.io/skills/emilkowalski-animate/audits/1?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

Значок Markdown

[![Skillstore security assessment](https://skillstore.io/badges/skills/emilkowalski-animate/security.svg)](https://skillstore.io/skills/emilkowalski-animate?utm_source=security_passport_badge)

Значок HTML

<a href="https://skillstore.io/skills/emilkowalski-animate?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/emilkowalski-animate/security.svg" alt="Skillstore security assessment" loading="lazy"></a>

Встраиваемая карточка

<iframe src="https://skillstore.io/embed/skills/emilkowalski-animate.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>

Академические ссылки (APA · BibTeX · CFF)

Цитата APA

emilkowalski. (2026). animate security audit report (audit version 1) [Author version unspecified]. Skillstore. https://skillstore.io/skills/emilkowalski-animate/audits/1

Цитата BibTeX

@techreport{emilkowalski-emilkowalski-animate-2026,
  author = {emilkowalski},
  title = {animate security audit report (audit version 1)},
  institution = {Skillstore},
  year = {2026},
  number = {1},
  url = {https://skillstore.io/skills/emilkowalski-animate/audits/1},
  note = {Author version unspecified}
}

CITATION.cff

cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "animate security audit report (audit version 1)"
version: "unspecified"
type: report
authors:
  - name: "emilkowalski"
date-released: "2026-08-08"
url: "https://skillstore.io/skills/emilkowalski-animate/audits/1"
identifiers:
  - type: other
    value: "skillstore:emilkowalski-animate:audit:1"
    description: "Skillstore immutable audit report identifier"

Сравнить варианты

2 устанавливаемых вариантов

Навык каждого автора остаётся отдельным устанавливаемым вариантом. Рекомендуемый вариант ранжируется по данным Skillstore.

Почему этот вариант первый

Самая высокая оценка Skillstore

Автор / источник Оценка Skillstore Достоверность доказательств Использование в Skillstore Обновлено

pbakaus Рекомендуется

pbakaus-animate

Оценка Skillstore 78

Достоверность доказательств Высокий

Использование в Skillstore 20

Обновлено

2026-09-09

emilkowalski Текущий

emilkowalski-animate

Оценка Skillstore 77

Достоверность доказательств Средний

Использование в Skillstore 2

Обновлено

2026-09-09

Оценка Skillstore

Почему такая оценка Достоверность доказательств: Средний

Архитектура

Сопровождаемость

Контент

Сообщество

Соответствие спецификации

Что вы можете построить

Add Responsive Product Motion

Create subtle feedback, entrances, and state transitions that keep daily workflows responsive.

Translate Motion Specs

Convert interaction intent into implementation choices with explicit properties, curves, durations, and accessibility behavior.

Prototype Gesture Interactions

Build interruptible drag, dismissal, drawer, and spring behavior from practical recipes.

Попробуйте эти промпты

Animate a Simple State Change

Add appropriate motion to this button state change. Choose the tool, properties, easing, duration, and reduced-motion behavior.

Build a Component Entrance

Implement the entrance and exit motion for this popover. Preserve accessibility and existing design tokens. Explain the animation gate result briefly.

Create an Interruptible Gesture

Build drag-to-dismiss behavior for this panel. Include velocity handling, pointer capture, boundary damping, multi-touch protection, and reduced motion.

Design a Motion System Extension

Add motion to this workflow without creating parallel tokens. Select the cheapest suitable tools and implement every accepted transition with accessibility variants.

Лучшие практики

State the animation purpose before selecting tools, timing, or visual properties.
Reuse existing motion tokens and prefer transform and opacity for smooth rendering.
Test interruption, reduced motion, touch behavior, and perceived timing on real devices.

Избегать

Do not animate frequent keyboard actions or functional data without a clear user benefit.
Do not install a motion library when a CSS transition meets the requirements.
Do not ship broad transition declarations, ungated hover motion, or missing reduced-motion behavior.

Часто задаваемые вопросы

Does this skill decide when motion is unnecessary?

Yes. It can reject animation for frequent actions, keyboard workflows, or motion without a clear purpose.

Which animation tools can it use?

It can choose CSS transitions, CSS animations, the Web Animations API, or Motion.

Does it support reduced-motion preferences?

Yes. Each implementation should include a gentler variant that removes unnecessary movement while preserving useful state feedback.

Can it build accessible dropdowns or dialogs from scratch?

No. It recommends an appropriate component library when focus management and interaction semantics are required.

Can it review existing animations?

This skill focuses on construction. A dedicated review or codebase audit skill is more suitable for existing motion.

Will every animation be fully tuned from code alone?

No. Crossfades, spring response, and gesture feel may require playback, device testing, and human evaluation.

Сведения для разработчиков

Автор

emilkowalski

Лицензия

MIT

Ревизия Skillstore

Примечание о версии

Автор не указал версию.

Репозиторий

https://github.com/emilkowalski/skills/tree/de33dbed000212b54400a33767d1e4d03654db2a/skills/animate

Ссылка

17e49992c9f55842f934ecec5719e4745ba7b95a

Актуальность поддержки

09.08.2026

Использование

0 загрузок · 0 просмотров

Структура файлов

📄 RECIPES.md

Улучшайте UX с помощью дизайн-рекомендаций на основе исследований

от shubhamsaboo

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

Дизайн и креатив Просмотр

animate

Установить с помощью моего Агента

Ресурсы для AI-агентов

Протестировать

Аудит безопасности

Факторы риска

Копировать ссылку на отчёт

Значок Markdown

Значок HTML

Встраиваемая карточка

Цитата APA

Цитата BibTeX

CITATION.cff

Сравнить варианты

Оценка Skillstore

Что вы можете построить

Add Responsive Product Motion

Translate Motion Specs

Prototype Gesture Interactions

Попробуйте эти промпты

Лучшие практики

Избегать

Часто задаваемые вопросы

Сведения для разработчиков

Больше от emilkowalski

apple-design

pick-ui-library

find-animation-opportunities

mobile-native

emil-design-eng

review-animations

Связанные навыки

design-lint

brag

ui-styling

web-accessibility

frontend-design

ux-designer