Дизайн

30 онлайн-источников вдохновения для веб-дизайнеров

В сайтах для дизайнеров сейчас недостатка нет — недостаток только есть во времени их просмотреть и найти что-то стоящее.

Если вам некогда выбирать такие сайты, Кристофер Рэтклиф, который занимает должность заместителя редактора в Econsultancy, уже сделал собственную подборку из множества полезных ресурсов!

Часть указанных сайтов и ресурсов используется в работе дизайнера ежедневно, другие – не чаще раза в неделю. С их помощью можно оставаться в тренде новостей веб-дизайна всего за 30-60 минут в день!

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

web-design-inspiration-04-650x405

Вдохновение

Awwwards

Первый сайт из списка “места, куда следует приходить за вдохновением”. Именно здесь Кристофер ищет новые идеи.

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

CSS Design Awards

Как и Awwwards, на CSS Design Awards выдаются награды самым красивым и оригинальным сайтам. Чтобы победить, необходимо выполнить лишь одно условие – соблюсти целостность дизайна. Никто не знает наверняка, что подразумевается под этим определением, но полюбоваться на дизайн участников может каждый.

One Page Love

Основной принцип, заложенный в создании любого сайта — простота. А что может быть проще, чем ограничить сайт одной страницей? Конечно, создание одностраничного сайта сопряжено с определёнными проблемами. Но One Page Love – ресурс, который показывает, как правильно и красиво создавать лендинги, портфолио, пошаговые формы, регистрации и магазины на основе всего 1 страницы.

Чаще всего одностраничные сайты разрабатываются с определённой целью – рекламировать продукт / услугу или побудить пользователя подписаться на рассылку. Ставки высоки, поэтому, берясь за создание подобного сайта, помните о том, что дизайн должен быть аккуратным и «бить точно в цель» (точнее — в целевую аудиторию) — именно это и поможет вам отыскать ресурс One Page Love.

UI Parade

Этот ресурс отличается от других обилием функциональных элементов, среди которых: разбиение на страницы, поисковая строка, индикаторы текущего состояния и т.д. Для того чтобы создать привлекательный, плавный и последовательный интерфейс, необходимо учитывать малейшие детали, и UI Parade поможет в этом. Все примеры из коллекции помогут вам создать интерактивный сайт по лучшим из предлагаемых практик.

Niice

Сами себя Niice позиционируют как “поисковая система со вкусом”. Здесь собраны разнообразные изображения от сообщества, которые можно свободно использовать на своих проектах.

Designspiration

Еще один великолепный источник идей в дизайне, с которым можно безбоязненно работать каждому – Designspiration.

Muzli

Плагин для Google Chrome Muz.li заменяет домашнюю страницу браузера на агрегатор дизайнерских идей, куда попадают примеры с нескольких источников. В частности, плагин подключен к Awwwards.

Awwwards Creattica

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

Creattica

Здесь можно найти практически всё, начиная от элементов UI, лого и иконок, и заканчивая витринами готовых сайтов и приложений. Creattica представляет собой открытое сообщество, в котором каждый может представить свои работы и проголосовать за понравившиеся. Также здесь есть обширная и постоянно растущая коллекция бесплатных образцов, которые можно загрузить и сразу начать работу над новым проектом.

PSDBucket

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

Designers’ List

Это — список ресурсов для дизайнеров, в котором можно найти всё для дизайнера: от блогов до вдохновляющих сообществ, от бесплатных ресурсов до CSS-галерей, шрифтов и многого другого. На то, чтобы просмотреть все материалы, размещённые по ссылкам в Designers’ List, понадобится уйма времени. Но вы гарантированно найдете что-нибудь вдохновляющее и полезное.

Бесплатные изображения

Freepik

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

Freebiesbug

Freebiesbug раздает тысячи бесплатных PSD-макетов и других полезных в веб-дизайне ресурсов.

Graphic Burger

На Graphic Burger можно найти ежедневную подборку коллекций бесплатных иконок, фотографий, инсценировок и других графических полезностей.

Палитра

Color.

При помощи Color. можно легко собирать и сохранять комбинации цветов. Движения назад и вперед регулируют HUE, вверх и вниз – яркость, колесико – насыщенность.

Pltts

Коллекция часто используемых палитр от Pltts может вызвать самые удивительные ассоциации. Думаю, сегодня я выберу Wasabi Suicide.

Adobe Color CC

Комбинатор палитр Adobe Color CC, переименованный из Adobe Kuler в нечто более осмысленное. Вместе с ребрендингом он получил мощное “колесо цветов”, поэтому грех жаловаться.

Мобильные устройства

Pttrns

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

WTF Mobile Web

Или “Чего не следует делать при разработке мобильных сайтов”. Здесь собраны яркие примеры ужасно неудобных дизайнерских решений.

Capptivate

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

Этот инструмент Кристофер обнаружил совсем недавно, хотя он присутствует в Google Chrome с конца 2013 года. Достаточно щелкнуть правой кнопкой по содержимому страницы и выбрать последний пункт “просмотр кода элемента”, либо нажать комбинацию Ctrl+Shift+C. На появившейся панели скраю четко будет видна пиктограмма мобильного устройства, в котором можно выбрать симуляцию любого интересующего вас аппарата.

Econsultancy’s Mobile Web Design Best Practice Guide

Если вы подписаны на Econsultancy, то не помешает скачать книгу с описанием лучших практик мобильного дизайна. 200 страниц чистого знания!

Правила хорошего мобильного приложения от Google

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

Взаимодействие с пользователем

Hover States

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

Little Big Details

Всем любителям скрупулезной работы над дизайном посвящается Little Big Details — место, где незначительные детали становятся несущей конструкцией дизайна.

UXPin

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

Сообщество

Behance

Сообщество Behance – это свободная площадка для самовыражения дизайнеров сайтов, где поделиться и оценить работы может каждый.

Dribbble

По сути, Dribbble – это сервис “покажи и расскажи” для дизайнеров, на котором можно получить качественные отзывы о своей работе.

Что почитать

Smashing Magazine

На Smashing Magazine публикуют полезные статьи по дизайну и коду, руководства по созданию пользовательских интерфейсов и по работе с WordPress. Обновляется ежедневно.

Designer News

Что-то вроде Hacker News, но для дизайнеров. На Designer News сообщество профессиональных дизайнеров делится интересными ссылками и собственным опытом с другими.

User Testing Blog

Заглянув на User Testing Blog, можно найти огромную коллекцию статей об адаптивном дизайне, которые ответят на все вопросы о мобильной поддержке.

Источник: spark.ru