Ультимативная подборка для поиска референсов

Эту подборку можно назвать около-продуктовой. Она в той или иной степени будет полезна всем, кто работает над цифровыми продуктами.

Когда ищешь тот самый флоу

Ультимативная подборка для поиска референсов, image #1

Главный секрет успеха Mobbin — в удобных фильтрах. Поэтому аналоги автор искал именно с возможностью быстро отфильтровать референсы под свой узкий запрос. Как оказалось, сервисов, подходящих под такое описание, не так много, качественных — ещё меньше.

🔹 Refero — совершенно крутой сервис с гораздо более удобными фильтрами, чем в том самом Mobbin. Пилит его Миша Беспалов.

🔹 Appshots — довольно приятный сайт, но смущает что местами практически полная копия Mobbin, при том что с фильтрами там все не хорошо.

🔹 UXArchive — неплохой сайт, в котором мобильные интерфейсы удобно разбиты на флоу.

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

🔹 Call to Inspiration — устроен своеобразным образом: сначала выбираешь нужный тебе паттерн, а потом в перемешку с рекламой тебе показывают рандомные скрины, причём чаще не целого экрана, а только выбранного элемента.

🔹 Pttrns — довольно древний сервис, в котором собраны как мобильные, так и веб-интерфейсы. Совершенно тупо, что нет возможности потыкать, пока не купишь подписку.

Продуктовым дизайнерам на заметку

Ультимативная подборка для поиска референсов, image #2

🔹 Auto Interfaces — подборка автомобильных интерфейсов.

🔹 Interface in Game — подборка игровых интерфейсов.

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

🔹 Pushkeen AI — большая подборка пуш-уведомлений от различных сервисов. Автор — Сергей Терно. Очень круто собранный сервис, в котором можно найти ту самую формулировку для своего пуша 😉

🔹 Шаблоны для Bootstrap — неочевидный способ найти референсы. Лично пользуюсь, когда нужны примеры сложных интерфейсов, типа таблиц и админок. По ссылке один из неплохих шаблонов.

🔹 Darkmode Design — подборка сайтов исключительно с темной темой оформления.

🔹 Navbar Gallery — подборка навигации и шапок сайтов.

🔹 Footer Design — а это уже подборка футеров! Странно, что у них не один создатель 😅

🔹 Stack Sorted — библиотечка UI-элементов с разных реальных сайтов.

🔹 Appmotion — скринкасты приложений с лучшими анимациями.

🔹 Либа — библиотека интерфейсных текстов (на русском).

Любителям систематизировать

Ультимативная подборка для поиска референсов, image #3

🔹 Design Systems Surf — это однозначно мой фаворит. Очень стильный и сделанный с душой сайт от белорусского дизайнера Ilya Greben. Кажется, тут собрано всё, что нужно знать про дизайн-системы:

  • Популярные ДС и ссылки на них.
  • Гайды по доступности, типографике и цветам.
  • Раздел с компонентами и ссылками на эти компоненты в разных ДС. - Подробные спецификации по компонентам.

🔹 Redesigning Design — подробный гайд по созданию ДС с нуля от Ness Grixti. Покрывает все важные темы от ресерча до ведения спеков.

🔹 The Component Gallery — кажется, самая полная коллекция веб-компонентов с привязкой к этим компонентам в разных ДС. Плюс большая база самих ДС с фильтрами по технологиям и фичам. Создатель — Iain Bean.

🔹 Storybook — известный инструмент, в котором фронтендерам удобно создавать компоненты и дизайн-системы. У них есть обширный глоссарий, где собраны основные веб-компоненты. Круто, что сразу можно провалиться в доступные библиотеки и потыкать эти компоненты.

🔹 Design Systems for Figma — подборка дизайн-систем существующих продуктов в Figma.

🔹 Design Systems News — тут можно подписаться на новости из мира дизайн-систем.

🔹 Design Systems Index — и на закуску подборка почти из 300 дизайн-систем, с разбивкой на категории и ссылками.

Источник

2166 views·11 shares