9 ТРЕНДОВ В WEB-ДИЗАЙНЕ В 2016 ГОДУ
ТОП от Ярослава Трегубова, арт-директора digital agency PRO100: 9 ТРЕНДОВ В WEB-ДИЗАЙНЕ В 2016 ГОДУ 1. FLAT 2.0 - это простота и эстетика. По сути Flat 2.0. сочетает в себе обычный "плоский" дизайн, который был популярен ранее, и эффекты объёма. Он достигается за счёт правильно применённых бликов и теней. Примеры: • https://www.trefectamobility.com/ • http://christmaswithjoy.com/ • http://vwthinkblue.com.mx/conciencia-ecologica/ 2. Эффективная типографика. Привлекательный текст - это важный элемент для создания отзывчивого сайта. При этом, внедряя типографику, помните об адаптации для мобильных устройств. Примеры: • http://www.nurturedigital.com/ • http://www.poigneedemainvirile.com/ • http://originalbyanjarubik.com/ • http://acme-world.com/ 3. Иконки и инфографика. Дизайнеры не перестают утверждать: иллюстрируйте материал подходящими иконками. С их помощью сайты легче читать и проще удержать внимание посетителя сайта. Особенно это касается страниц с большим количеством текста - разбавляйте абзацы иконками "в тему". Примеры: • http://parcourscanada.com/ • https://www.simplygum.com/ • https://www.schoolrunner.org/ 4. HD фотографии на страницах. Статичные фотографии высокого качества на первом скролле выглядят эффектно. Пример: http://www.google.com/…/behind-the…/streetview/treks/petra/… 5. Вертикальный паттерн и скроллинг. Из-за высокой нагрузки эффектами и визуалами сайты стали более тяжёлыми. Поэтому всё чаще используется анимация скроллинга, размещение контента с подгрузкой и лонгборд. Пример: • http://www.nationalgeographic.com/…/yellowstone-national-pa… • http://www.fitbit.com/whyfitbit 6. Карточные интерфейсы. Каждая карта представляет собой одну единую концепцию. Такой вариант отлично подходит для приложений и информационных сайтов. Примеры: • http://thenextweb.com/ • http://upmagazine-tap.com/# • http://block16omaha.com/ 7. Меню бургер. Пример того, как не юзабилити стало популярным. И как бы на бургеры не ругались, они всё равно активно используются. Примеры: • http://warsze.polin.pl/en/ • http://makeitbright.diadora.com/ 8. Фоновое видео. Больше динамики! Пример: https://www.squarespace.com/domains/ 9. Анимация, анимация и ещё раз анимация. Все современные сайты имеют анимацию - от глобальных (паралакс, фиксированный фон) до микроанимаций (ховер-эффект). Примеры: • http://www.doudoublues.com/ • https://www.christmas.express/ Примеры сайтов смотрите в описании к изображениям. И да пребудет с вами юзабилити 😉
