All Digital

Бранд идентичност

Бранд идентичност и дизайн системи

Последователен визуален език - типография, цвят, отстояния, движение и компоненти - дефиниран като система и доставен вътре в реалния продукт, за да се държи заедно и на двадесетата страница.

Започни проектВсички услуги

Какви проблеми решава

  • Всяка страница е проектирана отделно, така че сайтът има четири вида бутони и три нюанса на основния цвят.
  • Брандът съществува като файл с лого и нищо друго, така че всяка нова страница е нов набор решения.
  • Идентичността изглежда добре в презентация и се разпада в момента, в който срещне реални дължини на текста.
  • Нова секция отнема дни, защото няма какво да се преизползва.
  • Правилата са PDF, който за последно е бил верен преди две години.

За кого е

Бизнеси, които стартират нещо ново или освежават идентичност, която вече не отговаря на амбицията им - и които имат нужда тя да работи в код, на реални екрани, не само в презентация.

Какво включва

Визуална система

Типографска скала, роли на цветовете, отстояния и правила за подредба, дефинирани като система, с проверен контраст, за да е палитрата използваема, а не само красива.

Език на движението

Последователни времена, забавяния и поведение при взаимодействие, с дефиниран път за намалено движение от самото начало, а не добавен после.

Библиотека от компоненти

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

Приложена, не само описана

Идентичността се прилага върху реални екрани с реално съдържание - точно там, където системите, съществуващи само като мостри, обикновено се провалят.

Какво получавате

  • Дефинирана типографска скала, цветова система и скала на отстоянията
  • Роли на цветовете с проверен контраст за текст, повърхности и състояния
  • Библиотека от компоненти в код, ползвана от живия сайт или продукт
  • Правила за движение и взаимодействие, включително поведение при намалено движение
  • Правила за употреба на логото и файлове във форматите, които уебът реално иска
  • Системата, приложена върху реални страници, а не изолирани макети

Как работим

  1. 01

    Посока

    Изследваме и уточняваме визуалната посока рано, срещу реално съдържание.

  2. 02

    Система

    Типография, цвят, отстояния, движение и компоненти, дефинирани като свързан набор.

  3. 03

    Прилагане

    Идентичността се прилага върху реални екрани, а не върху презентационни табла.

  4. 04

    Пускане

    Доставя се като преизползваеми, документирани компоненти вътре в продукта.

Скорост, достъпност и търсене

Контраст, който покрива изискванията

Цветовите двойки се проверяват спрямо изискванията за контраст, преди да влязат в системата, а не след като одит ги посочи.

Движение, което може да се изключи

Всяка анимация има дефинирано поведение при намалено движение, за да остане интерфейсът използваем за хора, които имат нужда от неподвижност.

Последователност без тежест

Общият набор компоненти означава по-малко еднократен CSS на страница, което пречи на стиловете да растат по-бързо от сайта.

С какво го изграждаме

  • Дизайн променливи в Tailwind CSS
  • Библиотека от React компоненти
  • Библиотека за анимация
  • Процес за SVG активи
  • Проверка на контраст и достъпност

Интеграции

  • Съществуващи бранд правила
  • Предаване от дизайн инструменти
  • Модели на съдържание в headless CMS
  • Документация на компонентите

Цена и срок

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

Какво определя цената

  • Дали това е нова идентичност, или разширение на съществуваща
  • Колко компонента и състояния изисква продуктът
  • Дали дизайнът на движението е в обхвата
  • Колко повърхности трябва да покрие системата - сайт, приложение, печат
  • Дали дизайнът на лого е включен, или вече съществува

Какво определя срока

  • Колко бързо се уточнява посоката - най-променливият етап
  • Дали има реално съдържание, срещу което да се проектира
  • Брой компоненти, нужни преди пускането
  • Колко души преглеждат всеки кръг

Свързани проекти

Често задавани въпроси

Не. Логото е малка част. Това, което реално определя дали един бранд се държи заедно, е системата около него - типография, роли на цветовете, отстояния, състояния и компоненти - и точно нея изграждаме.

Да, и често това е по-добрата стойност. Можем да систематизираме съществуващото за уеб, без да изхвърляме разпознаваемостта, която вече сте изградили.

Да, в един екип. Затова идентичността оцелява при контакт с реален код - човекът, който проектира компонента, работи с човека, който го изгражда, както при Avangard Parts.

Библиотека от компоненти в код, използвана от живия продукт, плюс дефинициите зад нея. Не PDF, който описва система, която никой не може да приложи.

Готов да започнем?

Разкажи ни за проекта си и ще върнем ясен и честен план.

Започни проект