Донецкий техникум промышленной автоматики

Фотографії в веб-дизайні. Де брати, коли і як використовувати? Логічна або красива фотографія? ...

  1. Місцезнаходження і навколишнє середовище
  2. Змішування персональних зображень
  3. фотографії товарів
  4. Редакція фон
  5. Додавання характерних рис
  6. висновок

Фраза «стічна фотографія» часто викликає ефект пострілу посеред ділової зустрічі

Фраза «стічна фотографія» часто викликає ефект пострілу посеред ділової зустрічі. Вона асоціюється з чимось нікуди ні придатним, неприродним, і не відповідним для сучасного веб-дизайну. Але фотографії, знайдені в Інтернеті, не завжди бувають аж настільки недоречні.

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

Місцезнаходження і навколишнє середовище

Для сайтів компаній з продажу товарів або послуг, такі фото можуть бути дуже важливими. Особливо, якщо це сайт роздрібної торгівлі, який більшість людей будуть відвідувати особисто. Такі підприємства використовують свої веб-сайти, як цифрове представництво компанії. Тому велика фотографія з зображенням навколишнього середовища, дає відвідувачам уявлення про будівлю, можливо навіть інтер'єру, що підкуповує клієнта. І навіть якщо немає можливості помістити на сайті фотографію точного місця розташування - завжди можна використовувати зображення популярного місця поблизу.

Веб-сторінка Nature Valley Trail View включає в себе великі фотографії національних парків, розташованих по всій Америці. Фото для цього сайту можуть бути зробленими спеціально під замовлення, а можуть бути стокових, придбаним в Інтернеті.

Фото для цього сайту можуть бути зробленими спеціально під замовлення, а можуть бути стокових, придбаним в Інтернеті

Головне тут те, що вони дуже високої якості. Оскільки фотографії займають багато місця, вони визначають загальний настрій сайту. Низька якість викликало б відчуття чогось неохайного, але в даному випадку ми маємо якраз зворотний ефект.

Для іншого прикладу погляньте на сайт Red Dessert Dive. Це булочна-кафе, яке спеціалізується на призначених для користувача десертах. Протягом усієї сторінці ви спостерігаєте різні фотографії, але заголовок тут є найбільш значущим елементом. Відвідувачі помічають його, перш ніж що-небудь інше, що абсолютно необхідно для концентрації уваги. За допомогою фотографій сайт хвалиться своїм унікальним інтер'єром пекарні поряд з деякими десертами і столовими приборами. Потужна образність, як в цьому прикладі, демонструє профіль компанії, не покладаючись виключно на текст.

Розгляньте можливість використання екологічних фотографій, коли необхідно пов'язати веб-сайт з фізичним місцезнаходженням.

Змішування персональних зображень

Багато стокові фото використовуються в якості прозорого заднього фону. Їх часто додають на корпоративні сайти в якості доповнення до графіку або для створення нових фото композитів.

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

Проникливий дизайнер може успішно змішати персональні портрети з елегантними методами композітінга

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

Це чудова тенденція, тому що вона йде далі, ніж просто типове повноекранне фото. Тема виглядає як один суцільний колір, поки ви не зберете всі частини дизайну воєдино. Воістину унікальний ефект, і цей приклад прекрасно ілюструє те, як стічне фото використовується в веб-дизайні.

Майте на увазі, що споживачі люблять взаємодіяти з реальними людьми. Безликий сайт може іноді відмінно працювати - варто тільки подивитися на успіх Amazon і eBay. Але трохи особистого контакту також може додати сайту очок.

Але трохи особистого контакту також може додати сайту очок

Персональний сайт коміка-стендапера Брайана Рігана сповнений фотографій. На головній сторінці - особисті фото змішані з текстурованим фоном. Така компоновка не зовсім традиційна, але вона відмінно працює на персональному сайті. Тут ви знайдете безліч фотографій, змішаних з повноекранними заголовками та іншими елементами.

Не думайте, що все стокові фото повинні бути поміщені на сайт в тому вигляді, в якому ви їх придбали. Трохи магії від Photoshop може підштовхнути фотографію на вашому сайті в абсолютно новому напрямку.

фотографії товарів

Будь-який хороший онлайн-магазин потребуватиме зображенні продукції. Це абсолютно необхідно для продажів.

Даний стиль фотографії кілька унікальний і більшість професійних фотографів класифікують таку зйомку як «точний постріл в голову». Завдання фотографа - уявити кожен продукт в певному світлі, для того, щоб клієнти захотіли його купити.

Завдання фотографа - уявити кожен продукт в певному світлі, для того, щоб клієнти захотіли його купити

Подивіться на онлайн магазин Nike зі зразками взуття, поміщеними в мініатюрні блоки. Кожне зображення кросівок повернуто вправо і розміщено на однаковому сірому тлі. Деякі кросівки пропонують альтернативні кольору, які можна вибрати при наведенні на мініатюру. Ця додаткова функція показує важливість якості продукції. Якщо ви вирішили запустити інтернет-магазин і продавати фізичні товари, хорошою ідеєю буде найняти професіонала, який буде знімати продукцію для вашого сайту.

Класний портрет або фотографія пейзажу можуть поліпшити дизайн веб-сайту, але зображення високоякісного товару куди більше підвищать продажу.

Коли справа доходить до фізичної продукції, ми розуміємо, що фото дуже важливо. Попередній перегляд якісної фотографії плюс трохи Photoshop роблять чудеса. Але що якщо мова йде про корпоративні послуги?

Але що якщо мова йде про корпоративні послуги

The Lee W. Robinson - сайт-порфоліо цього дизайнера. Його фотографії містять не фактичні речі для продажу, а приклади його робіт.

Однак деякі труднощі виникають при проектуванні сайтів послуг, які не можуть бути продемонстровані на фотографії, наприклад, сантехніки. В цьому випадку можна додати портрет, або змішати його з картинками навколишнього середовища, видами офісу, обладнання або фотографій домашніх інтер'єрів клієнта (якщо вони дозволять).

Редакція фон

Fullscreen фони можуть включати в себе фотографії людей, робочого процесу, або чого-небудь ще реально відбувається. Ідея полягає в тому, щоб використовувати фотографії для персоніфікованих сайту. Blind Barber використовує техніку повноекранних зображень через слайд-шоу, яке з'єднує окремі сторінки.

Кожна фотографія відповідає перехідною посилання від бронювання на прийом до переглядання інтернет-магазину. І, треба сказати, фотографії настільки відмінної якості, що реально додають цінність дизайну в цілому.

Ще один крутий приклад - сайт Book of Beards. Він використовує одне повноекранне фонове зображення, яке залишається фіксованим на кожній сторінці. Для завантаження сторінок на цьому сайті використовується JavaScript, тому фонове зображення є своєрідним послідовним елементом фокусування.

Фактично цей сайт був створений професійним фотографом Джастіном Джеймсом Мюром. Book of Beards - сайт, який доводить, що простота може мати велике значення, а фотографії дійсно грають значну роль в веб-дизайні.

Додавання характерних рис

Стічна фотографія не завжди потрібна для заповнення більшої частини сторінки. Навіть невеликий портрет або мініатюра може додати індивідуальності дизайну.

У центрі дизайну сайту-портфоліо дизайнера Мета Хелмі - його власна фотографія профілю. Це безперечно велика, але єдина фотографія на всьому сайті. В даному випадку, люди останнє відвідування, в будь-якому випадку побачать персональний портрет Мета.

Але можна піти не так далеко, але отримати такий же ефект. Ви можете подивитися на сайт-портфоліо Рогге Кінга. Його фотографія в відтінках сірого, розміром 200 × 200, розташована в кутку колонтитула. Навіть така невелика і легка, вона як і раніше передбачає привабливий особистий контакт.

Навіть така невелика і легка, вона як і раніше передбачає привабливий особистий контакт

Цю тенденцію особистої фотографії можна розвинути в повноцінну інформацію про команду з біографіями і соціальними профілями працівників компанії. Мета такого підходу - запропонувати якомога більше (або як можна менше) персоніфікації сайту.

висновок

Коли справа доходить до фотографії - найбільш важливим фактором є якість. Завдяки йому проект може бути або відмінним, або жахливим. Високоякісні фотографії допоможуть веб-сайту будь-якого авторитетного бренду. Слідуючи тенденції, яку ми сьогодні розглянули, ви можете використовувати фотографії для розробки потужної цифрової айдентики свого підприємства.

Але що якщо мова йде про корпоративні послуги?