7 тенденцій веб-дизайну в найближчому майбутньому

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

1. Жести замість кліків

Ми забули, як раніше було складно прокручувати сторінки. Доводилося тягнути курсор до правого краю, щоб користуватися такою древньою штукою, як смуга прокрутки. Якщо ви тоді вже були професіоналом, ви могли використовувати колесо мишки, клавіші курсору або трекпад – але в цьому ви обганяли більшість користувачів.

image

У 2015 прокручувати простіше, ніж кликати. На мобільному можна робити прокручування великим пальцем. А потрапити точно в ціль важче – рівно навпаки порівняно з десктопом.

В результаті, все більше сайтів будуть побудовані на ідеї зверхності прокручування над кліками. І звичайно, саме це ми і бачимо.

image

Ця тенденція продовжиться, оскільки мобільних пристроїв стає більше. На сучасних сайтах менше місць для кліків, і більше прокрутки. Менше посилань, більше кнопок, великих клікабельних областей і високих сторінок, які треба прокручувати.

Сайти, що ділять статті на кілька сторінок, скоро засвоять це. Вони перетворяться в одностраничники, або навіть, як TIME, нескінченні сторінки.

image

Поки невідомо, чи з'явиться веб на годиннику – але якщо так, то там він напевно буде управлятися жестами.

2. Згорнуті меню відмирають

Прокрутка нічого не варто, а пристрої сильно відрізняються в розмірі – тому згорнуті меню йдуть. Дизайнери нарешті можуть не впихати все на верх сторінки. Це веде до дизайну типу Medium – повноекранні заголовки сторінок, з контентом, який відкривається тільки після прокручування.

image

Використовуючи високі сторінки, дизайнери можуть наповнювати їх великими красивими картинками. В 2015 буде більше сайтів, що використовують вертикальне простір, і більше великих картинок.

3. Користувачі прискорюються, сайти спрощуються

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

image

Сайти повинні стати не тільки швидше технічно, але і простіше для розуміння. Затримують користувача дизайни подібні сайтів, які повільно вантажаться. Прості дизайни простіше окинути поглядом. Простіше побачити, який з цих дизайнів більш новий – той, від якого швидше можна отримати задоволення:

image

image

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

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

image

Плоский дизайн – це лише початок. Тенденція йде по напрямку до негайності і простоті.

4. Мертві пікселі

На десктопі піксель – це піксель. Відомо навіть, скільки зазвичай пікселів в дюймі – 72 dpi. Тепер вже мало хто знає, що це таке.

image

В чуйну дизайні все йде до сіток і відсоткам. Але залишається ще одна неохоплена тема: растрові зображення. Майже весь веб побудований на зображеннях з роздільною здатністю в половину екрану, і вони не масштабуються. На ретина-дисплеях і в сучасних браузерах настав час векторних зображень.

Це вже відбувається з іконками, заснованими на шрифтах і Material design від Google. Вони ідеальні для дизайнерів та сучасних браузерів.

image

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

5. Анімація повертається

Щоб створити враження старого сайту, накидайте туди GIFок «Under Construction» і Flash-анімації. Але в сучасному світі анімація повертається в новому вигляді. Плоский дизайн виглядає досить похмуро. Анімація допомагає сайти виділитися й запхати більше інформації в той же простір.

image

Мобільні додатки поміняли очікування користувача. Вони використовують рух для передачі сенсу, і сайти починають робити приблизно те ж.

image

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

GIF-анімація повернулася і ефективно працює, її так просто створювати і ділитися нею.

6. Компоненти – це нові фреймворки

Веб-технології ускладнюються і стають менш семантичними. Дизайнерам доводиться писати складний код на сторінках для використання простих речей, на зразок включення до сторінку Google Analytics або кнопки Facebook Like. Було б простіше, якби могли написати що-небудь на кшталт:

<google analytics key="UA-12345–678">


І це можливо з веб-компонентами, які почнуть поширюватися в 2015 році. Google's Material design вже прийшов до нас, і може послужити каталізатором цього руху. Він забезпечує анімацію і компоненти взаємодії, взяті від додатків Android, з простими тегами зразок

image

Якщо вона приживеться, то на основі компонентів з'явиться набагато більше фреймворків. Можливо, Bootstrap 4.0?

7. Соціальне насичення і схід прямої електронної пошти

Соціальні мережі користуються великим успіхом, але виробники контенту не так вже й щасливі. Проблема в насиченні. У Facebook користувачі бачать лише ті з мільярдів постів, які, на думку мережі, сподобаються більшості користувачів. З часом ваші пости бачать все менша кількість людей. Цю проблему можна вирішити, як не дивно, заплативши Facebook.

Соцмережі не помруть, але в 2014 багато помітні блогери начебто Тіма Ферріса відвернулися від соц.мереж і зосередилися на добрих старих емейл-розсилках. У емейлів є перевага – їх побачить більший відсоток людей.

image

Я вважаю, що ця тенденція посилиться в 2015 році, разом з веб-нотификациями (які працюють так само, як нотифікації в мобільних додатках).

image

Бонусне не-передбачення: CSS-форми

Цю круту технологію помітять тільки дизайнери. CSS shapes дозволяють вбудовувати контент форми, наприклад, в кола:

image

Це круто, але поки браузери не будуть це гарантовано підтримувати, мабуть, ризиковано витрачати на це час і робити дві різні реалізації дизайну для старих і нових браузерів. А крім дизайнерів це ніхто і не помітить. Але це круто.

Чого очікувати в 2015

У 2014 мобільні додатки витіснили десктопи, але основна маса веб-дизайнерів ще не підтяглася. Більшість організацій замовляють веб-сайт, який добре виглядає на комп'ютері, а на мобільному працює вже в другу чергу. У 2015 така стратегія здається непрофесійною. Мобільники стають основними веб-пристроями.

Плоский дизайн вже повсюди, але це не тільки плоскі кнопки – головне, це більш швидкі та прості сайти. Простота – це не мода, це майбутнє.

Все більш модно вставляти в пости анімацію, яка і виглядає якісно, і покращує користувальницьке сприйняття.

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

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

Джерело: Хабрахабр

0 коментарів

Тільки зареєстровані та авторизовані користувачі можуть залишати коментарі.