ANMEDIO
18 января, 16:30
3080
0

DIЧ № 27: о навигации, динамических лого и городской айдентике

Самый дизайнерский дайджест на Cossa вернулся. Второй сезон.

Зеркала — Northern Ground

Сайт digital-студии Northern Ground из США. Ребята ежегодно выкатывают по свежему сайту. В этот раз получился строгий, но вместе с тем креативный монохром.

Надвое

Для небольших сайтов-портфолио, диджитал-агентств или дизайн-студий, где есть только «Работы» и «О нас», отлично подойдёт горизонтальное разделение сайта.

На каждой странице есть два поля. Верхнее отведено кейсам, а нижнее — проекту и команде. Здорово реализована как вертикальная, так и горизонтальная навигация.

Упразднение лишнего клика

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

Для путешествия по проекту не надо ничего кликать. Хочешь поменять страницы, нажми ← или →, хочешь почитать текст, наведи на нужную половину и скролль. Свежее, но интуитивно понятное и простое взаимодействие.

Стань перформанс-маркетологом за 19 недель!

Перформанс-маркетинг — это комплексный маркетинг в диджитал-среде. Знакомые каждому маркетологу понятия тут приобретают новый потенциал, ведь в диджитал можно измерить буквально каждое движение!

Научиться перформанс-маркетингу — значит научиться мыслить точно измеряемыми категориями. Освоить инструменты, усиливающие вашу интуицию чёткими цифрами. Изучить тонкости оперативной аналитики.

Хотите успеха в интернет-продвижении — без перформанс-маркетинга вам не обойтись. Для его изучения Cossa рекомендует онлайн-курс курс Перформанс-маркетолог.

Старт занятий уже в ближайшее время!

Реклама

«Интересная навигация. Хороший пример стилистики, крутая смесь резких и плавных анимаций. В наше время никого уже не удивишь мелкими интерфейсными анимациями: это делают на автомате. Зато их отсутствие наоборот воспринимается как крутой ход, чтобы добавить сайту резкости и строгости», — Денис Сафонов, Creative Frontend Developer в Red Collar.

Резиновая карусель — Analytica Projects

Analytica Projects занимается контролем качества пищевых продуктов. Сайт разработан Twenty two degrees в коллаборации с Рубеном Санчезом и Вицентом Люцендо (Ruben Sanchez & Vicente Lucendo).

Тянучий случай

Лендинг, иначе говоря — некий последовательный сторителлинг, можно и нужно подавать «вкусно». Так, чтобы пользователь захотел изучить его от и до, а не закрыть на втором слайде.

Это пример отличного отзывчивого WebGL-сайта. В зависимости от скорости скролла сайт с разной степенью искажения имитирует растягивание по цилиндру в 3D-пространстве. Игровой эффект плюс продуманные детали — пример того, что даже одна страница может быть приятной и запоминающейся.

Индикатор прокрутки

Никто не любит чувствовать себя потерянным и глупым. Если в дизайн не вписывается стандартный индикатор скролла страницы, то обязательно придумайте свой. Главное — обозначить, где именно находится человек и сколько ему осталось до конца страницы.

Двигаться по сайту можно двумя способами: скроллить или зажать мышкой и провести по кругу в верхнем правом углу. Секторы круга отражают местоположение на странице: авторы разделили его по цветам, как и фоновый текст на самом лендинге.

Как создают звуки

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

Бехансы

Адаптивная мякота — Carus

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

Carus производит мягкие напольные покрытия. Новый фирменный стиль подчёркивает переход компании из среднего в премиум-класс и акцент на B2B-сегменте. Логотип динамичный, каждая форма передаёт суть продукта: тут стоит кровать или шкаф, там покрытия нет, здесь будет не прямо-, а многоугольник. Ребята красиво развили эту идею в каталогах продукции: даже наслоение интерьерных фотографий напоминает логотип.

Вишни и слова — Fundão

Если вы создаёте айдентику для чего-то исторически значимого — города, госучреждения, многолетнего регулярного события, — обязательно сохраняйте наиболее узнаваемые символы. Если рубанёте с плеча, то обесцените труд других людей и серьёзно затормозите рост бренда.

Айдентика для Португальского городка Fundão. Два смысла в одном символе: это и вишнёвый плод (главный символ города), и кавычки для цитаты известного местного поэта Эужениу де Андраде, которому регион отчасти обязан своей популярностью. Кроме того, в кавычки можно заключать любые слова, благодаря чему сам город становится говорящим.

«Хорошо, что так обыграли вишни и кавычки, сделали просто, минималистично и со вкусом. Но для городской айдентики этого всё же мало. Хорошо было бы сделать ещё и фирменный паттерн, он отлично подойдёт для фона городской среды и увеличит узнаваемость стиля. А сами кавычки использовать более широким образом: например, пустить в качестве пинов на городских картах», — Денис Ломов, креативный директор Red Collar.

Перевод digital-годноты от DEADSIGN

Почему важно делать скетчи до варфреймов? Автор статьи убеждён, что мало просто придумать идею и функции приложения. Важно понять, что именно увидит пользователь на экране — и только затем интегрировать новые функции. О разнице между скетчем и варфреймом, почему скетчи помогают в общении с клиентом, и как они вообще между собой связаны. Налетай!

Мнение редакции может не совпадать с мнением автора. Ваши статьи присылайте нам на 42@cossa.ru. А наши требования к ним — вот тут.

✉️ Самое интересное шлём по почте, не чаще двух раз в неделю.

Комментарии:

Ответить?
Реклама

Чем живёт digital.
Главное — в рассылке:




Вход на cossa.ru

Уже есть аккаунт?
Выбирай любой вариант входа:
Facebook Twitter Vkontakte

Используйте свой аккаунт в социальной сети Facebook или Twitter, чтобы пользоваться сайтом

Не забудьте написать email на странице своего профиля для управления рассылкой