Улучшение эстетики фронтенда
Инструкции
Избегайте посредственной «неряшливой» эстетики, созданной с помощью ИИ, и создавайте удивительно уникальный пользовательский интерфейс.
## Пять основных измерений
**1. Типографика**
- ❌ Запрещены: шрифты Inter, Roboto, Arial, системные шрифты.
- ✅ Выберите: Уникальные, запоминающиеся шрифты
- ✅ Комбинация: шрифт Showcase + основной шрифт, высокий контраст
- ✅ Советы: Чрезвычайно высокий контраст толщины шрифта (100 против 900), большой диапазон размеров шрифта (в 3 раза и более)
**2. Цвет и тема**
- ✅ Поддерживайте единый эстетический стиль, используя переменные CSS.
- ✅ Доминирующий цвет + яркий акцентный цвет
- ❌ Избегайте: Фиолетовый градиент + белый фон
- ✅ Источники вдохновения: темы IDE, культурная эстетика
**3. Движение**
- ✅ CSS-анимации имеют приоритет (HTML)
- ✅ Библиотека анимаций
- ✅ Ориентация на высокую эффективность: тщательно продуманная загрузка страницы > Разрозненные микро-взаимодействия
- ✅ Триггер прокрутки, сюрприз при наведении курсора
**4. Пространственная планировка**
- ✅ Асимметричный, перекрывающийся, диагональный поток
- ✅ Нарушайте сетку, смело используйте пустое пространство ИЛИ используйте контролируемую плотность
**5. Предыстория**
- ✅ Создание атмосферы и глубины
- ✅ Градиентная сетка, шум, геометрические узоры
- ✅ Многослойная прозрачность, эффектные тени, декоративные рамки
## Ключевые принципы
- Каждый проект должен быть уникальным, чтобы избежать повторяющейся сходимости.
- Достижение эстетического видения, соответствующего сложности.
Чрезвычайная сложность требует тщательного проектирования, в то время как минимализм требует сдержанности и точности.
— Освободитесь от традиционного мышления и сделайте по-настоящему уникальный выбор.
⚡ Краткое изложение в одну строку
Уникальный шрифт + смелая цветовая гамма + тщательная анимация + инновационная компоновка + атмосферный фон = незабываемый дизайн интерфейса
Отклонено: Inter/Roboto, фиолетовый градиент, белый фон, монотонный макет
📋 Краткий контрольный список
Размеры и элементы контроля
Следует ли избегать шрифтов Inter/Roboto? Существуют ли какие-либо уникальные цветовые сочетания?
Выдержана ли единая цветовая гамма? Следует ли избегать фиолетовых градиентов?
Имеет ли анимация тщательно продуманный эффект загрузки?
Отличается ли планировка от традиционной сетки?
Создаёт ли фон глубину и атмосферу?
Описание
Рекомендовано
nene@YouMind
Почему нам нравится этот скилл
Надоел однообразный дизайн «AI slop»? Этот навык поможет вам выйти из посредственности с помощью уникальной типографики, смелых цветов, изящной анимации, инновационного пространственного макета и глубокого фона, создавая впечатляющий интерфейс. Он предоставляет практическое руководство по эстетике, чтобы ваша работа выделялась среди множества сайтов и достигала визуального прорыва.
Уникальный характер шрифта Темная киберпанк-эстетика Асимметричный динамический макет Тщательно продуманная анимация загрузки Создание погружающей атмосферы
Похожие скиллы
Посмотреть все
СлайдыБрутализм для разработчиков
Преобразуйте ваш тематический контент, статьи, знания, ретроспективы проектов, учебные материалы или обзоры инструментов в набор горизонтальных Slides в стиле «Брутализм для разработчиков». Общий стиль сочетает в себе дизайн нового брутализма, верстку независимых журналов и эстетику терминала разработчика: кремовый фон, толстые черные рамки, жесткие тени, контрастные цветовые блоки, сверхжирные заголовки, моноширинные шрифты, модульная компоновка веб/терминал/карточки, создавая сильное ощущение технического контента. Этот навык сначала извлекает структуру контента, затем определяет ключевую идею для каждого Slides, автоматически генерируя заголовки, пояснения, модули знаний, выводы и подходящие визуальные компоненты. Он особенно подходит для представлений AI-инструментов, практических работ с Agent, разбора open-source проектов, организации учебных материалов, обобщения методологий, описания функций продуктов и технических ретроспектив. Конечный результат — горизонтальные Slides в формате 16:9 с единым визуальным стилем, четким чтением, достаточным пространством и ярко выраженным стилем, создающим впечатление «как будто автор open-source проекта делится техническими знаниями, а независимый дизайнерский журнал рассказывает историю» — высокий уровень выразительности.
ИзображениеПлакат в ханьском стиле
Визуальная система, основанная на ханьских каменных рельефах: геометрические силуэтные фигуры × классические фоновые цвета × асимметричная редакторская верстка. Подходит для афиш мероприятий, анонсов стримов, обложек подкастов и т.д. Просто укажите тему, а он превратит современный контент в эстетику двухтысячелетней давности.
ПисатьDan Koe: заголовки для мини-IP
Генерирует 7 заголовков для вашего контента, каждый из которых представляет одну из ключевых стилевых особенностей Dan Koe, обеспечивая разнообразие и выбор. Это мастер создания заголовков, разбирающийся в психологии вирусного распространения и эстетике контента Dan Koe. Создан для креаторов, строителей личных брендов и цифровых кочевников, чтобы превратить скучные темы в привлекательные заголовки с оттенком «лидера мнений». 🌟 Ключевые возможности Глубокий анализ контента: автоматически извлекает ключевые болевые точки, портрет аудитории и ценностное предложение из фрагментов ключевых слов или многостраничных скриптов. Семь золотых измерений: строго следуя визуальной логике Dan Koe, генерирует 7 совершенно разных углов обзора за один раз.
Улучшение эстетики фронтенда
Инструкции
Избегайте посредственной «неряшливой» эстетики, созданной с помощью ИИ, и создавайте удивительно уникальный пользовательский интерфейс.
## Пять основных измерений
**1. Типографика**
- ❌ Запрещены: шрифты Inter, Roboto, Arial, системные шрифты.
- ✅ Выберите: Уникальные, запоминающиеся шрифты
- ✅ Комбинация: шрифт Showcase + основной шрифт, высокий контраст
- ✅ Советы: Чрезвычайно высокий контраст толщины шрифта (100 против 900), большой диапазон размеров шрифта (в 3 раза и более)
**2. Цвет и тема**
- ✅ Поддерживайте единый эстетический стиль, используя переменные CSS.
- ✅ Доминирующий цвет + яркий акцентный цвет
- ❌ Избегайте: Фиолетовый градиент + белый фон
- ✅ Источники вдохновения: темы IDE, культурная эстетика
**3. Движение**
- ✅ CSS-анимации имеют приоритет (HTML)
- ✅ Библиотека анимаций
- ✅ Ориентация на высокую эффективность: тщательно продуманная загрузка страницы > Разрозненные микро-взаимодействия
- ✅ Триггер прокрутки, сюрприз при наведении курсора
**4. Пространственная планировка**
- ✅ Асимметричный, перекрывающийся, диагональный поток
- ✅ Нарушайте сетку, смело используйте пустое пространство ИЛИ используйте контролируемую плотность
**5. Предыстория**
- ✅ Создание атмосферы и глубины
- ✅ Градиентная сетка, шум, геометрические узоры
- ✅ Многослойная прозрачность, эффектные тени, декоративные рамки
## Ключевые принципы
- Каждый проект должен быть уникальным, чтобы избежать повторяющейся сходимости.
- Достижение эстетического видения, соответствующего сложности.
Чрезвычайная сложность требует тщательного проектирования, в то время как минимализм требует сдержанности и точности.
— Освободитесь от традиционного мышления и сделайте по-настоящему уникальный выбор.
⚡ Краткое изложение в одну строку
Уникальный шрифт + смелая цветовая гамма + тщательная анимация + инновационная компоновка + атмосферный фон = незабываемый дизайн интерфейса
Отклонено: Inter/Roboto, фиолетовый градиент, белый фон, монотонный макет
📋 Краткий контрольный список
Размеры и элементы контроля
Следует ли избегать шрифтов Inter/Roboto? Существуют ли какие-либо уникальные цветовые сочетания?
Выдержана ли единая цветовая гамма? Следует ли избегать фиолетовых градиентов?
Имеет ли анимация тщательно продуманный эффект загрузки?
Отличается ли планировка от традиционной сетки?
Создаёт ли фон глубину и атмосферу?
Описание
Рекомендовано
nene@YouMind
Почему нам нравится этот скилл
Надоел однообразный дизайн «AI slop»? Этот навык поможет вам выйти из посредственности с помощью уникальной типографики, смелых цветов, изящной анимации, инновационного пространственного макета и глубокого фона, создавая впечатляющий интерфейс. Он предоставляет практическое руководство по эстетике, чтобы ваша работа выделялась среди множества сайтов и достигала визуального прорыва.
Уникальный характер шрифта Темная киберпанк-эстетика Асимметричный динамический макет Тщательно продуманная анимация загрузки Создание погружающей атмосферы
Похожие скиллы
Посмотреть всеСлайдыБрутализм для разработчиков
Преобразуйте ваш тематический контент, статьи, знания, ретроспективы проектов, учебные материалы или обзоры инструментов в набор горизонтальных Slides в стиле «Брутализм для разработчиков». Общий стиль сочетает в себе дизайн нового брутализма, верстку независимых журналов и эстетику терминала разработчика: кремовый фон, толстые черные рамки, жесткие тени, контрастные цветовые блоки, сверхжирные заголовки, моноширинные шрифты, модульная компоновка веб/терминал/карточки, создавая сильное ощущение технического контента. Этот навык сначала извлекает структуру контента, затем определяет ключевую идею для каждого Slides, автоматически генерируя заголовки, пояснения, модули знаний, выводы и подходящие визуальные компоненты. Он особенно подходит для представлений AI-инструментов, практических работ с Agent, разбора open-source проектов, организации учебных материалов, обобщения методологий, описания функций продуктов и технических ретроспектив. Конечный результат — горизонтальные Slides в формате 16:9 с единым визуальным стилем, четким чтением, достаточным пространством и ярко выраженным стилем, создающим впечатление «как будто автор open-source проекта делится техническими знаниями, а независимый дизайнерский журнал рассказывает историю» — высокий уровень выразительности.
ИзображениеПлакат в ханьском стиле
Визуальная система, основанная на ханьских каменных рельефах: геометрические силуэтные фигуры × классические фоновые цвета × асимметричная редакторская верстка. Подходит для афиш мероприятий, анонсов стримов, обложек подкастов и т.д. Просто укажите тему, а он превратит современный контент в эстетику двухтысячелетней давности.
ПисатьDan Koe: заголовки для мини-IP
Генерирует 7 заголовков для вашего контента, каждый из которых представляет одну из ключевых стилевых особенностей Dan Koe, обеспечивая разнообразие и выбор. Это мастер создания заголовков, разбирающийся в психологии вирусного распространения и эстетике контента Dan Koe. Создан для креаторов, строителей личных брендов и цифровых кочевников, чтобы превратить скучные темы в привлекательные заголовки с оттенком «лидера мнений». 🌟 Ключевые возможности Глубокий анализ контента: автоматически извлекает ключевые болевые точки, портрет аудитории и ценностное предложение из фрагментов ключевых слов или многостраничных скриптов. Семь золотых измерений: строго следуя визуальной логике Dan Koe, генерирует 7 совершенно разных углов обзора за один раз.
Найди свой следующий любимый скилл
Изучи больше отобранных AI-скиллов для исследований, творчества и повседневной работы.