Элементы дизайна

Обзор

"Flare" в графическом логотипе "Cloud" является главным элементов системы дизайна. Использование вспышки ("flare") укрепляет бренд, делая его большим и объемным. Его форма имеет элегантный и зрелый поток, который передает корпоративному миру нашу уверенность и простоту.

Дуги вспышки ("flare")
Элементы дизайна - Дуги вспышки - Позитивные дуги вспышки - Изображение

Позитивные дуги вспышки ("flare")
Вспышка ('flare") может быть визуально деконструирована на четыре дуги. Эти дуги являются основополагающими элементами визуальной системы.

Они обрезаются в макете и накладываются друг на друга, создавая точки перехода между дугами.
В рамках макета мы никогда не показываем полную вспышку ("flare"). Существует ограничение на две дуги одной вспышки ("flare"), которые могут быть видимы.

Элементы дизайна - Дуги вспышки - Негативные дуги вспышки - Изображение

Негативные дуги вспышки ("flare")
Вспышку ("flare") можно рассматривать как в негативной, так и позитивной форме. Обе перспективы имеют свои преимущества.

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

Одиночное размещение
Элементы дизайна - Одиночный - Одна вспышка - Изображение

Одиночная вспышка ("flare")
Это самая базовая версия системы дизайна. Показано здесь с переходом в цвет бренда. Он также может быть выполнен в ровных тонах.

Элементы дизайна - Одиночный - Позиционирование вспышки - Изображение

Позиционирование вспышки ("flare")
Позиционирование отдельной дуги вспышки ("flare") является очень гибким. Дуга может находиться в любом углу любого прямоугольного формата.

Множественное размещение
Элементы дизайна - Множественный - Две вспышки - Изображение

Двойная вспышка ("flare")
Размер добавляется путем наложения двух или более вспышек ("flare"). Это еще больше подтверждает широкий спектр возможностей и предложений Cloudflare.

Элементы дизайна - Множественный - Три вспышки - Изображение

Тройная вспышка ("flare")
Пересечения представляют наш многогранный подход к решению сложностей в разнообразной глобальной экосистеме (согласованным образом).

Библиотека
Обзор

Эта библиотека состоит из готовых изображений вспышки ("flare"), которые можно использовать различными способами с широким спектром ресурсов. Не все ситуации одинаковы, поэтому размещение и обрезка паттернов могут различаться в зависимости от ресурса и позволяет нам сохранять бренд актуальным. Результат получается строгим, дерзким и пробуждает любопытство.

Элементы дизайна - Библиотека - Multi-flare 01 - Изображение

Multi-flare 01

Элементы дизайна - Библиотека - Multi-flare 03 - Изображение

Multi-flare 03

Элементы дизайна - Библиотека - Multi-flare 05 - Изображение

Multi-flare 05

Элементы дизайна - Библиотека - Multi-flare 02 - Изображение

Multi-flare 02

Элементы дизайна - Библиотека - Multi-flare 04 - Изображение

Multi-flare 04

Элементы дизайна - Библиотека - Multi-flare 06 - Изображение

Multi-flare 06

Обрезка
Обзор

Изображения Multi-Flare обеспечивают гибкость и разнообразие при создании динамических композиций всех форм и размеров. Можно использовать целиком, без полей, обрезать (см. примеры), повернуть на 180°. Заменяйте изображение бренда на градиент, соответствующий бренду для:

  • Сценарии, приводящие к непригодным для использования обрезкам

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

  • Варианты дизайна, требующие более минимальных/менее отвлекающих факторов представления бренда (например, тонкая переходная граница, проходящая по краю рамки)

Элементы дизайна - Обрезка - Прямоугольник - Изображение
Элементы дизайна - Обрезка - Прямоугольник - Справа - Изображение

Прямоугольник
Изображения Multi-flare обеспечивают гибкость и разнообразие для создания динамических композиций всех форм и размеров. Можно использовать целиком, поворачивать, без полей, обрезать, как показано в данных примерах.

Элементы дизайна - Обрезка - Квадрат - Два столбца - Слева - Изображение
Элементы дизайна - Обрезка - Квадрат - Два столбца - Справа - Изображение

Квадрат
Не обрезайте изображение чрезмерно. Слишком узкая обрезка может привести к потере четкости в частях, такой как сглаживание оранжевого тонового диапазона и распознавание формы дуг вспышки ("flare"), а также ограничение динамического потока.

Элементы дизайна - Обрезка - Вертикальный - Слева - Изображение
Элементы дизайна - Обрезка - Вертикальный - Справа - Изображение

Вертикаль
Убедитесь, что обрезанное изображение содержит хотя бы одно пересечение перекрывающихся вспышек ("flare"). Чтобы избежать чрезмерной обрезки, используйте как минимум 20 % изображения в любом направлении по осям X и Y.

Дизайнерские обновления
Элементы дизайна - Дизайнерские обновления - Переход и штрих - Изображение

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

Элементы дизайна - Дизайнерские обновления - Плоская структура и штрих - Изображение

Плоская структура и штрих
Используется штрих вспышки ("flare") и белая вспышка ("flare") на фоне с переходом, с несколькими вспышками.

Элементы дизайна - Дизайнерские обновления - Переход, штрих и негатив - Изображение

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

Элементы дизайна - Дизайнерские обновления - Плоская структура, штрих и негатив - Изображение

Плоская структура, штрих и негатив
Используется штрих вспышки ("flare") и белая вспышка ("flare") на фоне с переходом, с несколькими вспышками.

Приложения
Примеры переходов

Мы увеличиваем формат и делаем шрифт более жирным для более крупных форматов, таких как рекламные щиты и обложки презентаций. Большие размеры дают нам платформу, чтобы показать, насколько динамичными, выразительными и объемными мы можем быть. Мы создаем щедрое пустое пространство, которое позволяет выделиться цветным переходам вспышки ("flare").

Элементы дизайна - Приложения - Слева - Изображение
Элементы дизайна - Приложения - Справа - Изображение
Элементы дизайна - Приложения - Три столбца - Слева - Изображение
Рекомендации по использованию бренда - Элементы дизайна - Приложения - Три столбца - Центр - Изображение
Элементы дизайна - Приложения - Три столбца - Справа - Изображение
Элементы дизайна - Приложения - Два столбца ниже - Слева - Изображение
Элементы дизайна - Приложения - Два столбца ниже - Справа - Изображение
Примеры плоской структуры

Мы используем однородный цвет (2D) только для небольших форматов, таких как цифровые баннеры. Такой подход позволяет сохранить простоту и четкость с более глубоким диапазоном контента.

Элементы дизайна - Примеры плоской структуры - Слева - Изображение
Элементы дизайна - Примеры плоской структуры - Справа - Изображение

Нужны визуальные ресурсы?

Загрузите креативные ресурсы, включая логотипы, фотографии, фоны, баннеры, видео и иллюстрации.