5 Проривних тенденцій в мобільному дизайні
Минули ті часи, коли сайт розроблявся тільки під один пристрій. Багато розробники згадують їх з легкою долею смутку, адже сьогодні все набагато складніше. Сайт повинен добре виглядати не тільки на великому екрані - на мобільному він теж зобов`язаний бути красивим і функціональним.
Для вирішення цих завдань придумано багато цікавих прийомів. І деякі з них набирають все більшої популярності.
Ось 5 корисних тенденцій мобільного дизайну на 2016 рік.
Відео: Британська вища школа дизайну: Дизайн мобільних додатків
багатошарові інтерфейси
Очевидно, що найбільша різниця між настільними і мобільними екранами - це розмір. Мобільні сайти і додатки мають менше місця, це ясно. Для того, щоб допомогти нейтралізувати цей недолік, все більше і більше інтерфейсів виконуються в кілька шарів, один поверх іншого.
Відео: Школа мобільного дизайну 2016
Ці багатошарові інтерфейси, як купа паперів, дозволяють користувачам більш вільно відкривати, закривати, витягувати, перемикати вкладки, або просто видаляти вікна. Ця установка дозволяє економити простір, працюючи тільки з одним відповідним вікном, але зберігаючи легкий доступ до решти.
Деякі поширені прийоми застосування багаторівневого інтерфейсу включають в себе:
- великі списки, що випадають - стандартна опція «меню-гамбургер», для збереження всіх спільних дій, які необхідні користувачу, але безпосередньо не актуальні на відкритому екрані.
- «Клейкі» меню - меню з предметами першої необхідності, яке залишається на екрані весь час.
- вкладки - цифрова версія організаційного методу паперу, з невеликими інтерактивними областями різних сторінок, які завжди видно.
Шаруваті інтерфейси працюють в рамках принципів Матеріального Дизайну від Google, який імітує організацію документів у реальному світі. Перетасування паперу таким чином, щоб потрібне виявлялося зверху - це те, що ми робимо, навіть не замислюючись.
РАДА: Використовуйте градієнт тіні, щоб поставити акценти. Це діє як візуальний сигнал, який повідомляє, що користувачі можуть взаємодіяти з різними рівнями.
креативні жести
Перехід й постукування - це інстинктивні жести, які широко застосовуються для роботи з сенсорними екранами. Але вони мають набагато більший потенціал, і все залежить тільки від рівня вашої креативності.
Наступне покоління жестів, які ми називаємо «Складні жести», відбувається з ігор, але тепер проникає в інші інтерфейси. Вони, як правило, складаються з трьох фаз:
- Посвята - дія, яка запускає послідовність;
- Продовження - унікальні сенсорні візерунки або постукування, просте або складне, але таке, щоб користувач міг впоратися;
- Припинення - сигнальний кінець взаємодії- може бути просто зупинка контакту з екраном.
Відео: Тенденції шрифтового дизайну | Ілля Рудерман | Prosmotr
Але не потрібно винаходити колесо. Кожному креативному жесту потрібно вчитися, вони далекі від інтуїтивно зрозумілих. Використовуйте новий жест, коли він покращує стару форму взаємодії, тобто, зробить її швидше, зручніше, або більш природною. В іншому випадку, залишайтеся з тим, що вже знає користувач.
РАДА: Розгляньте фізичні обмеження при проектуванні нових жестів, особливо зверніть увагу на те, що різні користувачі можуть тримати мобільний пристрій по-різному.
практичні мікровзаімодействія
Мікровзаімодействія почали свій шлях в дизайні як мінімальні розчерки, які підсилюють захоплення від роботи з інтерфейсом. Але тепер, дизайнери розуміють, що ці крихітні, часто непомітні моменти можуть служити для більш глибоких і більш практичних цілей. У майбутньому, ми будемо бачити, що їх використовують все більше і більше.
Мікровзаімодействіем може бути що завгодно, від миттєвої анімації до звукового ефекту.
Відео: Тестування дизайну мобільних додатків
Використання мікровзаімодействій покращує зручність використання, створює більш ефективну функціональність. У 2016 році мікровзаімодействія будуть використовуватися все частіше, щоб заповнити «тріщини» в інтерфейсі.
РАДА: Кращі мікровзаімодействія знаходяться на крок попереду користувача, і майже пророкують, що він думає.
Мікровзаімодействія можуть бути використані практично в будь-якій точці призначеного для користувача інтерфейсу.
значна типографіка
Чим менше екран, тим більш значуща типографіка. Нехтуючи тим, як ваші слова представлені на мобільних пристроях - іншими словами, не змінюючи типографіку взагалі з настільної версії - ви створюєте мобільний сайт або додаток, яке важко читати і важко використовувати.
Трюк з мобільного типографікою балансує між читаністю зі збереженням простору. З цієї причини, часто вибираються простіші шрифти, так як вони легше читаються при менших розмірах. Шрифти без зарубок і з круглими краями також вписуються в естетичні міркування мінімалізму і плоскої конструкції, які в тренді в 2016 році.
Іншою проблемою є вирівнювання. Немає безвідмовного способу впоратися з цим повністю, але деякі поради дозволять усунути багато проблем:
- для великих блоків тексту, використовуйте вирівнювання по лівому краю. Це відповідає природним ритмам читання.
- для невеликих шматочків тексту використовуйте центрування. Для заголовків і закликів до дії, вирівнювання по центру покращує видимість.
- вирівнювання по правому краю слід використовувати тільки в контрольованих умовах, таких як єдиний короткий заголовок, або з примусовим перервами після кожного слова.
РАДА: Щоб забезпечити розбірливість в мобільних пристроях, прагнете до 30-40 символів в рядку. Ця консервативна оцінка становить половину від рекомендованих 60-75 символів для робочого столу, але майте на увазі, що у деяких читачів може бути поганий зір. Решта по достоїнству оцінять зручність.
Карткові макети
Карткові макети вже зробили революцію в настільних і мобільних інтерфейсів, так що дизайнери вивчають нові способи їх поліпшення. Згодом, мобільні карти стають все менше.
Card UI спочатку розглядався як спосіб організації величезної кількості інформації в маленькому контейнері. Соціальні медіа-гіганти, такі як Facebook, Twitter, і особливо Pinterest, задали тон всім іншим, показали, як надати сенс хаотичного безладдя користувацького контенту.
Картковий дизайн зробив чудеса для мобільних UI, тому що вони обмежені різними розмірами екрану. Якщо ви розіб`єте цілу сторінку контенту на керовані блоки, різні пристрої з різними розмірами екрану можуть реорганізувати розміщення цих блоків, не втрачаючи при цьому загальний зміст.
Картковий шаблон стає найпопулярнішим варіантом макета, завдяки зручності і простоті використання.
Деякі сайти йдуть навіть далі, показуючи тільки зображення і назва. Це може не працювати для всіх продуктів, але тенденція набуває все більшої популярності: показати тільки найнеобхідніше на кожній карті, для економії місця, а також щоб залучити користувача відкрити вміст.
РАДА: Не обмежуйтеся стандартною сіткою. Експериментуйте з положенням карт і стовпців.
Як бачите, всі ці тренди в першу чергу працюють на зручність для користувачів, і тільки потім - на красу сайту або програми. Розгляньте, який з них використовувати в ваш продукт - а може, і кілька відразу.
