Как работает вдохновение

Коллекция годных примеров интерактивной анимации элементов сайта

На сайте Web Interactions Gallery собраны хорошие примеры реализации переходов между страницами, индикаторов загрузки, появления секций и меню сайта. Сейчас в коллекции порядка 120 примеров, они разбиты на типы и сопровождаются коротким видео

webinteractions.gallery

#awd_web #awd_site #awd_collection #awd_ui

Минутка блокнота:

Вечеринка на разворот блокнота от иллюстратора Mattias Adolfsson

Минутка обложки:

Хороший арт-дирекшен это еще и удерживать динамику обложки во времени, чтобы постоянно вызывать интерес читателя, увлекать, создавать более глуокую историю жизни героев обложек. Буквально неделю назад героиня обложки шла вправо, а на этой неделе уже едет влево. Журнал о динамичной городской жизни.

Постер дизайнера Niklaus Troxler для джазового концерта. Вчера опубликовал. Ему кстати 77 лет.

Минутка природы:

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

👁🦵🏻⛳️

Герхард Глюк.
Воскресная прогулка.
(Sonntagsspaziergang)

Минутка истории:

Первый звонок по мобильному телефону был сделан в мае 1973 года. Мартин Купер, используя прототип Motorola DynaTAC, позвонил с улиц Нью-Йорка в Bell Labs в Нью-Джерси. Высота устройства составляла 23 см, время работы в режиме разговора — 35 минут, а подзарядка занимала 10 часов.

Минутка мема:

Хорош ночью правки вносить

#цитата_дня

Мы рано перестаем удивляться, рано утрачиваем способность, которая побуждает интересоваться вещами, не затрагивающими непосредственно нашего существования... Вода была бы, без сомнения, самым удивительным веществом в природе, а Луна — наиболее поразительным зрелищем на небе, если бы то и другое не попадалось на глаза слишком часто

Яков Перельман, статья «Что такое занимательная наука»

Доброе утро!

StudioFeixen — как обычно, упражняются в кинетической типографике

Позавтракали?

Дизайнер Roger Kilimanjaro отрендерил.

Дизайнер samdape экспериментирует с почтовыми марками в интерфейсе.

Минутка интерактивной мебели:

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

Что сегодня собралось в мини-подборке по лучшим интерфейсным паттернам и практикам:
 
1. NN/g: Принципы работы трёх видов калькуляторов: конвертеры, предположения и рекомендации.
И советы по их дизайну.
 
2. Karri Saarinen: Редизайн сервиса управления задачами Linear. В первой части говорит о том, как продавать такие изменения. Во второй — как шёл сам процесс.
 
3. Evil Martians: Интерфейсы для разработчиков должны быть оптимизированы под высокую продуктивность. В статье собраны самые частые паттерны.
 
4. Ксения Толокнова: Толковый анализ возможностей экранных клавиатур в Android и iOS. Что и когда можно использовать в ваших приложениях.

5. Baymard Institute: Режим примерки товара в дополненной реальности в интернет-магазинах на мобильных работает коряво и достаточно бесполезно выводы из свежего исследования).

6. Creative Navy: Профессиональные интерфейсы для производственных линий по упаковке и наполнению товаров.

7. Виталия Фридман: Краткий обзор паттернов сканирования информации на экране.

8. Creative Navy: Интерфейсы описания университетских курсов. Они прошлись по 280 вузам и провели 45 интервью.

9. Baymard Institute: Рекомендуют делать навигацию между фото пользователей в отзывах о товаре. Обычно они открываются поодиночке, что заставляет делать много лишних телодвижений.

10. Luke Wroblewski: Самая ценная вещь, которую дизайнеры могут дать продукту — лучше показать пользователю ценность этого продукта.

11. Matthew Ström: Разные виды информационной плотности в интерфейсе — насыщенность на единицу пространства, во времени и в плане ценности.

12. Baymard Institute: Сложные фильтры на B2B-сайтах по продаже электроники и советы по организации поиска в них.
 
13. Baymard Institute: Советуют использовать табличные списки на B2B-сайтах по продаже электроники на компьютере и обычные списки на телефоне.
 
14. MeasuringU: Новые сравнительные исследования сайтов американских банков и заказа цветов. Как пользователи оценивают их по метрикам SUPR-Q, NPS и UX-Lite.
 
#patterns

5Д — Десять дельных дел для дизайнера

◼︎ Объедините тридцать животных, рыб, птиц в пятнадцать новых созданий. Рисуйте легко. Для каждого нового создания придумайте подходящий образу бренд, товар, продукт, нарисуйте новых созданий как образ, маскот, новых интерактивных сервисов для города. Придумайте новые сервисы. Например, для нового существа объединяющего медведя и сову можно придумать сервис могучих грузчиков обеспечивающих перевозку только частных библиотек, погрузку, аккуратную перевозку и распаковку книг и другой ценной интеллектуальной собственности,которую не доверишь обычным грузчикам. Придумайте существ и сервисы.

◼︎ Пересмотрите фильмы: «Бархатная бензопила» (2019 год), «Брачная история» (2019 год), «Большой куш» (2000 год), «Бёрдмэн» (2014 год), «Борьба с моей семьей» (2019 год) найдите в этих историях, картинах, эстетике и драме общие черты, общие закономерности, общие метафоры и символы или похожих героев. Выведь заметили, что все названия на общую для всех букву, может есть еще общее?

◼︎ Перерисуйте десяток известных картин так, чтобы возник вид на сюжет картины в проекции сверху, как план изображения, как «карта картины», это помогает вашему восприятию активней использовать пространственное мышление и «крутить изображение» в воображении. Полезный навык.

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

◼︎ Поиграть в Counter Strike так, чтобы не стрелять в противника, а отвлекать его от стрельбы по вашим коллегам по команде разным странным поведением и созданием отвлекающих маневров или используя только флэшбэнги «ослеплять» и тем самым отвлекать от действий коллег.

◼︎ Посмотреть сериал в обратном порядке. От последней серии сезона к первой и выстроить свой собственный нарратив из такого подхода. Осмыслить как сюжет строится и в какой последовательности и как бывает интересно и сложно его нарушать.

◼︎ Изучать популярные статьи о психологии и поведении человека. К каждой статье рисовать простую «смыслограмму» схему основного смысла и связей в статье примеров и выводов. Это помгает лучше понимать и запоминать.

◼︎ Каждый день слушать новую музыку, исполнителя, жанр, причем так, чтобы пару первых треков зарисовывать эскизы образов возникающих в воображении от свежей и необычной музыки

◼︎ Выпустить серию обычных стикеров с мотивационными фразами и расклеить их на спортивной плащадке, чтобы вложенный смысл и энергия в словах и типографике передавалась тем, кто занимается

◼︎ Придумывать новые функции для обычных предметов, например для пожилых людей расширение функциональности обычной трости для ходьбы

Попробуйде 5Д и вам понравится