Как стать автором
Обновить

Комментарии 22

Человека, решившего унифицировать дизайн столь разных продуктов надо уволить. И всех его соратников тоже…
Речь не идёт о переводе вообще всех продуктов на единый шаблон. Интерфейсные решения принимаются на разных уровнях: базовые элементы интерфейса (кнопки, поля ввода и т.п.) и более сложные компоненты (например, просмотрщик фото); визуальное единство экранов и предсказуемое поведение сценариев взаимодействие.

Полная унификация точно помогает линейке родственных продуктов (например, медиапроекты). Разнородным сервисам пригодятся скорее лучшие практики — например, как грамотно строить работу с формами в несколько шагов или учитывать требования accessibility.
Не соглашусь с вами. Весь мир идёт к унификации — светофоры, салон авто, телефоны, калькуляторы… Все вещи в мире так или иначе одинаковы (конечно же не сравниваем вилки со стульями).

Мне больше нравится, когда дизайн рабочего места/странички можно настроить под себя.
Жесткое "втюхивание" своего концепта мне не по душе.
Опыт Microsoft, WPS, Google о чем-то да говорит.
Может присмотритесь к нему?

А о чем говорит опыт Microsoft, WPS и Google? :)

Задача должна стоять не в унификации (зачем она вообще?), а в повышении конверсии с каждого отдельного проекта. А любителей «одинаковых сфетофоров» за чужие деньги надо увольнять сразу.
В большой продуктовой линейке помимо эффективности работы конкретного сервиса не менее важны:
  • Скорость выхода на рынок. За счёт использования готовых решений значительно ускоряется выпуск новых функций и продуктов.
  • Обеспечение качества реализации продукта (включая дизайн) меньшими средствами. Использование единых элементов и компонентов, раздающихся на продукты централизованно, решает эту задачу.
  • Усиление бренда за счёт единства дизайна внутри продукта и между схожими сервисами.


Зрелая дизайн-система помогает и в продуктовых экспериментах — удачные решения легко масштабируются на все экраны и родственные сервисы.
Каковы парадигмы анимации в вашей системе?
Без этого — неполноценно, особенно в наши дни.
Пока мы опубликовали только то, что отлажено и укладывается в простую масштабируемую модель. Наработки по accessibility, voice & tone, анимации и другим вещам сыроваты для выкладывания наружу, но откроются для всех со временем.
Позволю себе немного критики:

Сомнительное решение назначать font-size: 15px и line-height: 20px;
Если уж делать все по фэн-шую, то можно взять за правило, чтобы разница между высотой линии и высотой шрифта была четной: например font-size: 16px и line-height: 20px. Таким образом можно избежать проблем с полу-пикселями.

Второй момент: задавать фиксированную высоту кнопкам мне кажется плохой практикой. Пусть лучше она подстраивается под размер контента (высота линии + паддинг), ну или использовать свойство min-height по крайней мере.
Вы могли бы привести пример с полупикселами? (2 картинки)
Малые масштабы для пущей наглядности:
Картинка
image

Шрифт 8px, кнопка 15px – как не крути, по центру не выровняешь. Будет либо выше (1), либо ниже (2). Делаем кнопку высотой в 16px – всё становится ровно (3).
Спасибо
13, 15 и 17 выбрали не от хорошей жизни — у Roboto, который используется на медиапроектах, плохой рендеринг в Windows. Чётные размеры наборного текста выглядят condensed из-за того, что не показывается часть суб-пикселей. Сейчас у нас куплена лицензия на Proxima Nova, которая уже частично используется и таких проблем не имеет, так что, возможно, сможем перейти на кратные 4 размеры шрифта. Но даже в гайдах Material первые полгода-год для веба был указан 15й шрифт с оговоркой, что это временная проблема.

Вторая проблема — в вебе крайне сложно использовать выравнивание от базовой линии шрифта, что сильно поломало наши планы по вертикальному ритму. В том числе из-за этого пока в Paradigm не внесены межпараграфные расстояния.

Возможно, после этого сможем вернуться к расчёту через паддинги.
Мобильной версии как таковой на данный момент нет, т.к. приоритеты стоят на развитии системы.
Это скорее артефакты, которые пока что надо оторвать и в будущем заменить полноценной адаптивной версией.
Мы строим интернет, просто мобильные в Вологодской области есть только у 1.4% населения, пока не приоритет. Позже добавим.
С 2012 года внутренняя установка в нашем подразделении — запускать все продукты сразу с мобильной версией. Но Paradigm — это внутренний рабочий инструмент, который практически не используется с мобильных. Его адаптация находится внизу приоритетов — гораздо ценнее довести до ума требования по доступности или принципы анимации. Но для задачи анонсирования мы, конечно, облажались с этим — многие читают статьи с мобильных.
http://joxi.ru/v29XPzqS3KMLbm

Хм…
Цитата из статьи:

В нашем подразделении «Почта и портал» около 20 продуктов — productivity (Почта, Облако, Календарь, Mail.Ru для бизнеса), медиапроекты (Авто, Гороскопы, Дети, Добро, Здоровье, Леди, Кино, Медиатор, Недвижимость, Новости, Погода, Спорт, ТВ, Hi-Tech, SEOSan), Beepcar, Ответы, мобильные продукты (myMail, Artisto), главная страница и общепортальные правила для Mail.Ru, поддержка стилистики бренда My.com.


Пока мы занимаемся этим пулом продуктов. Когда Paradigm будет достаточно отлажен, сможем помочь и коллегам.

Я буквально неделю назад ещё работал в Mail.RU и поэтому приходилось пользоваться мобильным клиентом почты (андроид). Он спроектирован с использованием этого вашего языка дизайна? Если так, то очень неубедительно: тот же gmail и выглядит приятнее, и не лагает так.

Мобильные приложения пока вне дизайн-системы. В 2013 году мы описали то, как она может работать на нативных платформах, но из-за смены стратегии (закрыли много второстепенных приложений, по факту в подразделении всего три продукта, которые потенциально можно унифицировать) и ограничений платформ (гайды позволяют менять немногое) ограничились цветами и иконками.
Зарегистрируйтесь на Хабре , чтобы оставить комментарий