Адаптивный дизайн или реинкарнация вашего старого компьютера

Как менялась методология дизайна за последние двадцать лет. Изменение принципов и методов применяемых в разработке и создании дизайна потребительского UI / UX, WEB, графического дизайна.

За условно небольшой промежуток времени произошел глобальный технологический бум, компьютер размером с холодильник, переквалифицировался в карманный. Теперь 1000 мгц на запястье это норма, которую может позволить себе каждый. По мере того, как мощность устройств росла, а их размеры уменьшались до компактных, появляются нестандартные форматы дисплеев, а вместе с ними и новые возможности для отображения контента.

На телефонах 2000 – х годов тоже был интернет WAP и им активно пользовались, загрузка WAP сайта со скорость 0.15 кбт/с требовала минимальных ресурсов от сайта, это был текстовый чистый HTML – анекдоты, гороскопы, новости, загрузка мелодий и картинок, позже чаты. Простой текстовый скроллинг, гиперссылки и переход на следующую страницу. Разрешения экранов были практически стандартными и имели, около трех разных вариантов от основных производителей.

На смену WAP приходит GPRS скорость в среднем выросла от 1.5 до 15 кбт/с в зависимости от качества приема сигнала. Экраны телефонов становятся практически в 2 раза больше предыдущих моделей. Появляются первые мобильные интернет мессенджеры и почтовые клиенты, написанные на Java. В мобильном браузере Opera уже можно загружать полноценные ПК версии сайтов, если бы у вас хватило на это терпения, загрузка происходила за энное количество времени, что едва ли можно было назвать комфортным интернет серфингом, в современном его понимании. Но пытливые умы не остановить, в помощь старая технология, отключение изображений в браузере, получаем тот же WAP сайт, уже c некоторыми элементами UI, кнопки и строка поиска.

Говоря об адаптивности, в то время у большинства сайтов, имелась в footer ссылка типа “ перейти к текстовой версии сайта ”.

Самое интересное, что эта технология до сих пор применяется и вросла почти в каждый браузер под названием “режим чтения”, что позволяет с комфортом, вечером, почитать, интересные статейки на планшете, под тусклым светом настольной лампы.

Мобильный трафик начал увеличиваться, как и снова увеличились экраны телефонов, появляются первые доступные сенсэры и первые попытки создать мобильные версии сайтов. Делалось это довольно изощренным способом, создавался сайт для ПК браузера и так же еще один отдельный полноценный сайт для мобильных экранов, совмещалось все это посредством jQuery.

Где мы наблюдали все туже ссылку в footer " перейти к мобильной версии сайта ".

И вот буквально через несколько лет, продолжая развивать и совершенствовать прошлые технологии, развитие интернет-сообщества, пошло семимильными шагами. Появляется библиотека Bootstrap полностью адаптивный фреймворк, который задает стандарт HTML для всех существующих браузеров. Количество производителей мобильных устройств начинает увеличиваться, появляется огромнейшее количество экранов разных размеров. Все это благодаря Bootstrap, где сетка макета и ее содержание адаптируется под размер экрана, а именно масштабируется посредствам CSS. За это время пропускная способность мобильного интернета увеличилась с EGPRS до HSDPA. Все последние версии браузеров отказываются работать с Adobe Flash, считая его устаревшим и небезопасным.

А теперь начинается самое интересное, практически весь контент ушел в мобильный интернет. Все что когда-то было доступно небольшому интернет сообществу на настольных ПК и больших экранах, теперь доступно каждому на мобильных платформах - карманных устройствах. Полностью меняется дизайн всего глобального интернета. Интернет становится адаптивным.

Все что не юзабельно в браузере упаковывается в файлы .apk , .ipa , .bar или .xap , для уже не одноядерных коммуникаторов. А дальше таже технология переходит в WEB приложения, где получает абсолютно независимый интерфейс связки со все возможными платформами и языками, API. Облачные сервисы, браузерные ОС, неттопы.

***

***

Общий интерфейс Common Interface задает стандарт для внутренней и внешней периферии, Смарт ТВ, приставки, смарт часы, фитнес браслеты.

Теперь пользователь может взаимодействовать с одним приложением на разных устройствах -дома, передвигаясь в автомобиле, на пробежке и в спорт зале, или далеко загородом.

Не меняется только само взаимоотношение пользователя с приложением. Разный интерфейс, но все тот же узнаваемый интуитивно понятный и отзывчивый доступ к функциям устройства.

С каждым уменьшением или увеличением дисплея, дизайнер получает новый вызов проблематики для отображения контента. Текст сменяется иконками, иконки сменяются пиктограммами или символами. Масштабирование или ресемплинг уничтожает качество исходной картинки, что в конечном счете приводит к тому, что для каждого интерфейса необходимо создавать отдельный дизайн или искать золотую середину, при этом сохраняя общий стиль и узнаваемость.

***

***

Объекты графического интерфейса UI становятся более округлыми, от сюда меняется и подход к созданию логотипов. По рекомендации Google современный логотип, должен содержать дополнительный узнаваемый элемент, вписывающийся в окружность, для корректного отображения присутствия бренда в интернете. Ну а пока все это хранится и обрабатывается на облачном сервере, мы можем быть уверенны, что картинка прогрузится, и конечный пользователь оценит творение кропотливого труда инженеров, разработчиков и дизайнеров.