Компания Microsoft рассказала в своём блоге об изменениях, внесённых в веб-версию облачного сервиса OneDrive. Дизайн сайта стал адаптивным, теперь все элементы на нем подстраиваются под размер и разрешение экрана, а также под размер окна браузера.
Вот что об этом редизайне пишет сотрудник Microsoft, участник команды разработчиков OneDrive Тайлер Расмуссен:
Для всей команды OneDrive несколько последних месяцев были интересными, хоть и трудными. Мы готовили различные нововведения для пользователей этого сервиса на различных платформах — в приложениях для Android, Windows Phone и iOS. Первое крупное обновление дизайна было выпущено ранее в этом году для приложения на Windows Phone. Если вы пользуетесь OneDrive на Android, то могли заметить, что недавно и это приложение стало выглядеть по-другому. Затем мы выпустили версии OneDrive для Android Wear и Apple Watch. А несколько дней назад на iOS вышло крупное обновление приложения для iOS — в нём изменился дизайн значков файлов и папок.
Мы надеемся, что вам нравятся все эти изменения, но последнее из них особенное. Мы представили полностью изменённый сайт OneDrive — с адаптивной «резиновой» вёрсткой.
Не просто редизайн
Когда мы начали переделывать дизайн сайта, мы знали, что можем поменять цвет некоторых элементов его интерфейса и изменить размеры шрифтов, на это ушло бы совсем немного времени, но этого было бы недостаточно. Для того, чтобы сайт OneDrive одинаково хорошо смотрелся в браузерах на устройствах разного типа, нам пришлось переделать его с нуля. Фундаметальным для дизайна каждого сайта являются, конечно, его визуальная разбивка разделов, цветовая схема и типографика.
Визуальная разбивка
После рассмотрения нескольких вариантов мы поделили страницу сайта на клетки шириной и высотой по четыре пикселя каждая. Такое решение дало нам гибкость при вёрстке, но в то же время сохранило визуальную целостность сайта. Мы хотели выбрать единую разметку, которая одинаково хорошо работала бы как в вебе, так и в нативном приложении. Четырёхпиксельные клетки подошли для этих целей как нельзя лучше.
Каждый компонент интерфейса был переделан таким образом, чтобы мог идеально вписаться в новый визуальный стиль: панели, диалоги, список файлов, навигация в левой части, команды и даже мелкие кнопки. Было проделано очень много работы, но мы очень довольны тем, что получилось в итоге и надеемся, что вы тоже.
Параллельно с этим мы провели тщательный аудит типов устройств и сценарий использования OneDrive на каждом из них. Это помогло нам определить идеальное количество вариаций дизайна, которое нам необходимо предусмотреть. Мы остановились на шести и для каждого из них создали отдельный шаблон. Сайт оказался упорядоченным и адаптивно структурированным в зависимости от того, на каком устройстве вы его открываете — от миниатюрного смартфона до компьютера с огромным экраном.
Цвета
После составления шаблонов для вёрстки мы приступили к выборе палитры. Наш брендовый цвет — #234fa2, поэтому мы взяли его за основу, а затем добавили к нему набор различных оттенков и акцентов. Мы провели тщательное исследование восприятия такой цветовой схемы разными людьми, внесли в неё изменения на основе отзывов и теперь сайт выглядит так, каким вы его видите. В нём сочетается отлично сбалансированный набор цветов — энергичный, освежающий и настраивающий на креатив.
Типографика
Шрифты должны быть хорошо читаемы. Чем они проще, тем легче пользователь воспринимает, что написано на сайте. Нашей основной целью было выбрать такой шрифт, который хорошо бы читался и идеально подошёл к описанию вашего контента, а уж во вторую очередь к интерфейсу OneDrive. Для веб-версии OneDrive мы выбрали шрифт Segoe , который используется в ряде продуктов экосистемы Microsoft. Мы применяем его почти во всех своих цифровых продуктах, поскольку он сохраняет хорошую читабельность независимо от своего размера.
Мы ограничили число манипуляций со шрифтом и создали схему с чёткой иерархией его размера и толщины для разных компонентов. Мы хотели, чтобы текст на сайте выглядел сбалансированным и хорошо сочетался с каждым используемым элементом интерфейса.
Ещё не всё
Новый редизайн сайта — одна из попыток сделать сервис OneDrive удобным и пригодным для использования в повседневной жизни. И мы рады поделиться вами результатами своего труда. Обычным пользователям этот дизайн станет доступен в ближайшие дни, а бизнес-пользователям он будет открыт до окончания этого года. Было проделано очень много работы, и мы надеемся, что вы довольны результатом. Однако, работа над этим сайтом ещё не завершена, в будущем в него будет внесено ещё немало изменений.
Тайлер Расмуссен,
Старший менеджер по дизайну OneDrive.
