Как показывает практика, качественная, цепляющая картинка – половина успешного дизайна. Фотобанк PressFoto постоянно следит за новыми тенденциями в рекламе, полиграфии и web-дизайне, чтобы предвосхищать спрос наших покупателей, и предлагать им актуальные и качественные изображения. В этом блоге мы делимся своими наблюдениями, и рассказываем о наиболее интересных, модных течениях, и событиях в сфере дизайна. Темой этой публикации стали примеры web-дизайна, где в качестве фона используются большие фотографии городов.
Фоновое изображение на главной странице указывает на то, чем занимается компания, и на характер товара или услуги, который она предлагает. Сайты в этой подборке, так или иначе связаны с деятельностью направленной на людей, или на развитие их бизнеса, поэтому в их дизайне присутствует городская тематика. Почему именно города, спросите вы? Как правило, яркие, цепляющие взгляд, фотографии мегаполисов ассоциируются с цивилизацией, прогрессом и силой. Правильное использование таких изображений переводит эту ассоциацию на сайт, заставляя зрителя думать, что и компания обладает этими мощными характеристиками. Это простой и эффективный прием. Давайте посмотрим как он работает на практике:
1. Эксклюзивные итальянские туры. Благодаря качественным фотографиям сайт выглядит роскошно, и прямо заманивает посетить Италию.
2. 9 Design Street – красивая панорамная фотография города, в сочетании с сочным логотипом и яркой кнопкой, на которую так и хочется нажать.
3. Fima – напряженный живой город, с контрастной линией дороги, которая символизирует технологичность и инженерный прогресс, гармонично сочетается с тонкой белой типографикой.
4. GIGI Secure Messaging – еще один пример сайта, который показывает наполненный жизнью город. На этом фоне хорошо смотрятся значки устройств, и сочный логотип с небольшой тенью.
5. Sweet Leaf Tea – легкий и запоминающийся дизайн, где отлично сочетаются слегка размытый город на фоне которого много самобытной типографики.
6. A.W.M. Web Agency – фоновое изображение на сайте меняется, показывая различные сферы деятельности компании. Каждое изображение – виды города потрясающего качества.
7. Cost of Living Index – сайт встречает посетителя, опять же, красивым видом города, но здесь это не просто картинка. При выборе какого-либо показателя (кофе, автомобиль, сигареты т.д.), отображается табличка их стоимости в разных городах мира, а фон меняется, в зависимости от того, какой город вы выбираете.
8. Solidiance – привлекательный и информативный веб-сайт посвященный инновационному городу в Азии. Внутренние страницы построены на основе вертикального параллакса, и имеют кучу красивых городских фотографий.
9. Valencia DMC также использует технику вертикального параллакса для того, чтобы направлять внимание пользователей из одной описательной части в другую. На главной странице расположен широкий слайдер с фотографиями, которые не мешает разглядывать изысканная, слегка прозрачная навигация.
10. Официальный сайт Бехеровки – загадочная иллюстрация, которая заставляет зрителей окунуться в пропитанную традициями старую Чехию.
11. Dakic Online LLC – сайт представляет собой прямую противоположность предыдущему примеру: спокойных и мощный образ современного промышленного города с чистым голубым небом. Сочетание синего, оранжевого и белого цветов удачно дополняет картинку.
12. The Space InBetween – изображения меняются при прокрутке вниз. Текст расположен на затемненных плашках, чтобы ничего не мешало удобной навигации.
13. Future Bristol Low Carbon 2050 – иллюстрированный городской пейзаж разделен на две части: посетители могут голосовать за понравившуюся концепцию развития города.
14. Starmatic – сайт продвигает полезные IOS приложения, связанные с фотографией. На главной странице размытое изображение оживленного центра города, который приятно дополняется скетчем слогана и узким слайдером iPhone.
15. Cropp – онлайн магазин молодежной одежды в стиле гранж, с навигационной сеткой и тематическими фото улиц.
16. Spade – красивый фон, демонстрирующий ночные огни мегаполиса. Дизайн выполнен в трехцветной палитре, где умело смешиваются темно-серый, ярко-красный и сдержанный белый цвета.
17. Dassel und Wagner – здесь нет явного изображения города, но используется фотография неотъемлемой составляющей любого мегаполиса – толпы, которая усиливает слоган «Мы создаем успешные цифровые продукты», заставляя думать, что в современном обществе без них никуда.
18. Visit Bruges – интересная интерактивная анимация рассказывает какие достопримечательности в какое время лучше всего посещать.
19. Сайт Antonio Errigo удачно дополняет навигацию и активные элементы слегка размытыми видами мегаполиса.
20. O2 Tracks – дизайнер использует виды ночного города в качестве фона для слайдера, чтобы усилить ощущение городской тусовки.
21. Startupflyer – красивый контраст между иллюстрацией (самолетик и облака) и фотографией.
А теперь несколько примеров сайтов из Рунета:
22. Alexarts — портфолио графического дизайнера с привязкой к городскому пейзажу. Не самый удачный пример, но зато ощутимый контраст с видами зарубежных мегаполисов.
23. Алабуга – сайт особой экономической зоны использует в качестве фона фотографию промышленных построек, усиливающую ощущение успешного производства.
24. Adproject – сайт российской рекламной компании с иллюстрированным и анимированным видом городской улицы: машинки едут, баннеры мигают. Кликнув на специальные точки можно приблизить участок улицы, даже зайти внутрь некоторых зданий, и посмотреть на примеры работ агентства.
Подведем итог:
Дизайн сайтов с качественными фотографиями городов и улиц, с небоскребами, и спешащими по многоуровневым дорогам машинами, помогают компаниям производить впечатление солидного прогрессивного предприятия. Если в качестве фона используется иллюстрация города, сайт приобретает, или романтичный, или шутливый характер. Городские виды удобный фон для размещения логотипов, надписей и навигации. Добавив прозрачные плашки, или интерактивные элементы можно создать легкий и стильный дизайн.
По мотивам материалов: www.designmodo.com