Где найти красивые дизайны мобильных интерфейсов (подборка сайтов) - «Веб-дизайн»

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

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

Вообще создать эффективный и красивый дизайн мобильных интерфейсов – задача не из легких. Да, есть определенные правила, можно найти готовые UI/UX наборы интерфейсов, почитать советы специалистов, но все же “площадь для фантазии” несколько ограничена. Нужно не просто уложиться в определенные размеры экрана, но и создать эффективную графическую оболочку с точки зрения юзабилити. Приложение должно быть простым и понятным. Тут требуется не просто опыт дизайнера, а нужны специальные навыки проектировщика интерфейса мобильных приложений.

Начнем наш обзор с наиболее известных проектов.

Dribbble

Наверняка сайт Dribbble вам хорошо знаком, т.к. является одной из самых крупных площадок для дизайнеров, где они презентуют свои работы, обмениваются впечатлениями и находят вдохновение. Его мы упоминали в пятерке полезных дизайнерских соц.сетей, он также часто встречается в разных подборках графики и т.п. Найти красивые интерфейсы мобильных приложений тут можно двумя способами: 1) вводите в строку поиска запрос “mobile app” или 2) открываете пункт меню Tags, где выбираете теги iphone, ui, android и т.п.

Behance

Behance – еще один популярный сервис по типу портфолио с обсуждением и поиском работы. Подробную информацию о нем советую глянуть в детальном обзоре а сейчас просто расскажу как искать красивые интерфейсы приложений. Здесь есть очень мощный механизм фильтров (горизонтальное меню), где сначала можете выбрать вместо “All Creative Fields” категорию UI/UX, а затем дополнительно воспользоваться поиском или похожими тегами по теме (Related tags) – application, iphone, ipad и т.п.

Pinterest

Pinterest – бесконечный источник вдохновения и заодно самый популярный сервис графических закладок. На сайте сможете отыскать много интересных материалов, нужно только зарегистрироваться. Далее вводите в строку поиска нужный вам запрос, например – “mobile app design”. Можно при этом выбрать в качестве источника готовые подборки (Boards) от бывалых пользователей либо просматривать все файлы.

Mobile Mozaic

В отличии от предыдущих сайтов, где интерфейсы мобильных приложений являются одной из категорий работ, проект Mobile Mozaic целиком и полностью посвящен данному направлению. Здесь представлено около 200 разных приложений, которые отсортированы по разным темам: музыка, еда, финансы, спорт, путешествия и т.п. При клике на картинку попадете на страницу с подборкой разных скриншотов экрана из выбранной программы.

Mobile Design Inspiration

Первое, что бросается в глаза на сайте Mobile Design Inspiration – наличие анимаций (gif’ок), отображающих работу интерфейсов мобильных приложений.  Если сравнивать такой формат со скриншотами, то он, конечно, более наглядный, т.к. позволяет увидеть не просто дизайн экрана, но и разные эффекты при взаимодействии пользователя с ним.

Pttrns

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

Inspired UI

По умолчанию на главной сайта Inspired UI отображаются последние скриншоты. В шапке есть выпадающий список категорий и выборка по устройствам (iPhone, iPad, Android). Как и в прошлом примере, при клике на картинку определенного приложения попадаете не страницу со всеми его дизайнами.

UIHaus

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

Mobile Tuxedo

В сервисе Mobile Tuxedo собраны разные ресурсы и информация по теме мобильных приложений. Для интерфейсов переходим в раздел UI Patterns. Под картинками оранжевым цветом выделены метки, с помощью которых можно просмотреть несколько объектов. При клике на картинку вас перебрасывает на страницу приложения в iTunes. Подборки скриншотов здесь нет.

UIMovement

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

LovelyUI

В LovelyUI найдете красивые интерфейсы приложений андроид, iPhone и iPad. Кроме категорий и устройств есть фильтр по трендам – круги, градиенты, прозрачные кнопки, все цвета радуги. В принципе, все дизайны вы можете видеть сразу, при клике на отдельный вариант дополнительных скриншотов программы не подгружается. Сервис максимально прост, но интересные решения здесь встречаются.

Meer.li

Достаточно симпатичные скриншоты программ подобраны на сайте Meer.li. По каждому из них есть возможность лайка и комментирования. Сверху в меню найдете переключатель между мобильными платформами – iPhone, Android и другие. Там же расположены кнопки отображения новых, популярных и т.п. работ.

AppreciateUI

Пользоваться сайтом AppreciateUI предельно просто: слева находятся типы интерфейсов мобильных приложений и элементом в них, справа – соответствующие скриншоты. По личным ощущениям, здесь нет каких-то экстравагантных и супер ярких дизайнов, скорее обычные классические примеры графики. С другой стороны, не каждая программа должна иметь броское и оригинальное оформление, некоторым важна в первую очередь функциональность. Отличительной фишкой сайта есть то, что при клике на картинке она открывается в новом окне в достаточно большом разрешении (приблизительно 600 x 1000 пикселей).

Uplabs

Красивые интерфейсы приложений в сервисе Uplabs – не единственная представленная здесь графика, хотя их достаточно много. Очень классно реализована страница просмотра того или иного скриншота – увеличивается картинка плюс отображается информация по элементу, похожие объекты, есть даже возможность скачать исходники в некоторых случаях. Данный проект является частью группы тематических сайтов по дизайну – при переключении на вкладку Android грузится аналогичный сервис MaterialUp, для веб-графики – SiteUp.

AndroidUX

AndroidUX – один из первых сайтов с интерфейсом приложений андроид. За все время его посетило более миллиона человек. На главной странице найдете разные типы элементов дизайна: виджеты, часы, набор номера, настройки, камера, форма логина и т.д. По каждому из них подобраны скриншоты с разными состояниями и вариантами оформления. Если вы работаете с Android, ресурс вам должен пригодится. Кстати, сверху есть интересная заметка о конвертации графики из iOS и сравнение разных версий дизайнов системы Android ранее и сейчас.

Mobile Patterns

Из плюсов сервиса Mobile Patterns я бы отметил хорошую навигацию по разным типам объектов, а также большие картинки, открывающиеся при клике (где-то 700 x 1300 пикселей). Сверху возле логотипа можно выбрать отдельное отображение графики по платформам iPhone и Android, планшетов нет. В целом сайт содержит достаточно неплохие варианты интерфейсов, можно кое-что для себя почерпнуть.

Capptivate.co

Автор проекта Capptivate.co решила собрать в одном месте варианты отличной анимации из iOS программ. Сверху в меню найдете типы интерфейсов (контент, навигация, загрузка, инфографика), а также разные виды эффектов для них: вращение, появление, затемнение и т.п. Если вам нужно добавить немного интерактивных объектов и оживить собственное приложение, здесь есть на что посмотреть.

UXArchive

Сайт UXArchive будет интересен в первую очередь создателям интерфейсов, так как в нем уделяется больше внимания работе приложений, а не внешнему виду. Здесь собраны 22 типа задач, возникающих в мобильном софте: логин, бронирование, поиск, шеринг, загрузка, создание/удаление и т.п. Данные процессы рассмотрены на 139 различных приложеиях, что в итоге дает почти 400 разных примеров. Каждый из них представлен в виде серии скриншотов. Получается достаточно наглядно и познавательно.

App.itize.us

Создатели проекта App.itize.us провели тщательный отбор наиболее толковых приложений. По каждому из них доступно детальное описание, но увы подборки скриншотов не наблюдается – здесь есть только одна картинка и линк на программу. С другой стороны набор графики из нее можно глянуть на том же iTunes, пройдя по ссылке. Для удобства слева найдете список категорий/тематик: книги, игры, новости, музыка, путешествия, видео и другие.

UIParade

На UIParade представлена разная графика, которая встречается в пользовательских интерфейсах. Возможно, приложений здесь не так и много, но другие элементы (кнопки, слайдеры, иконки) вполне могут вам помочь вдохновиться. В правом верхнем углу найдете меню с категориями: формы, кнопки, переключатели, модальные окна, иконки и т.п. Все это, впринципе, часто встречается в мобильном дизайне.

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