Author: stasgavrylov

17
Июл
2015

«Готов» ли HTML?

Перевод статьи Is HTML «complete»? с сайта brucelawson.co.uk, автор — Брюс Лоусон. Не так давно Тим Брей написал интересный пост под названием </html>, в котором он заявляет: Никто, похоже, не заинтересован в работе над «словарем» (под которым понимаются те штуковины…
ДАЛЕЕ

17
Май
2015

Материальный дизайн — Макет: Метрики и контуры

Перевод раздела Metrics & keylines официальной документации Google: http://www.google.com/design/spec/material-design/. Основная сетка Все компоненты выравниваются по основной сетке, состоящей из квадратов со стороной 8 dp. Шрифт и иконки на панели инструментов выравниваются по сетке, состоящей из квадратов со стороной 4 dp….
ДАЛЕЕ

17
Май
2015

Материальный дизайн — Макет: Единицы измерения и размеры

Перевод раздела Units and measurements официальной документации Google: http://www.google.com/design/spec/material-design/. Некоторые единицы измерения в различном контексте имеют различные значения. В этой главе описано использование устройство-независимых пикселей, масштабируемых пикселей, а также таких идей как плотность пикселей. Плотность пикселей Количество пикселей, помещающихся в…
ДАЛЕЕ

17
Май
2015

Материальный дизайн — Макет: Принципы

Перевод раздела Principles официальной документации Google: http://www.google.com/design/spec/material-design/. В основе материального дизайна лежат элементы печатного дизайна — типографика, сетки, пространство, масштаб, цвет и изображения, создающие иерархию, особый смысл и центры внимания, погружающие пользователя в эту реальность.  Материальный дизайн использует приемы из…
ДАЛЕЕ

17
Май
2015

Материальный дизайн — Типографика

Перевод раздела Typography официальной документации Google: http://www.google.com/design/spec/material-design/. После релиза Android Ice Cream Sandwich, стандартным шрифтом, используемым в Android, стал Roboto. После релиза Froyo штрифт Noto стал стандартным шрифтом, используемым в Android для всех языков, не поддерживаемых шрифтом Roboto. Кроме того, Noto…
ДАЛЕЕ

24
Апр
2015

Материальный дизайн — Изображения

Перевод раздела Imagery официальной документации Google: http://www.google.com/design/spec/material-design/. Изображения – это не просто украшение. Это мощный инструмент, который может помочь вам донести свои идеи и выделить свой продукт. Смелые, яркие и осмысленные изображения помогают привлечь внимание пользователя. Неважно, хотите ли вы…
ДАЛЕЕ

24
Апр
2015

Материальный дизайн — Иконки

Перевод раздела Icons официальной документации Google: http://www.google.com/design/spec/material-design/. Иконки приложений Иконки приложений являются средством визуального выражения приложений, сервисов и инструментальных средств бренда. Простые, выразительные и удобные, они сообщают основную идею и цель приложения. Несмотря на то, что иконка каждого приложения визуально…
ДАЛЕЕ

22
Апр
2015

Материальный дизайн — Цвет

Перевод раздела Color официальной документации Google: http://www.google.com/design/spec/material-design/. Цвет в материальном дизайне пропитан духом смелых оттенков, стоящих бок о бок с приглушенным окружением, глубокими тенями и яркими светлыми участками. В качестве примеров использовались современная архитектура, дорожные знаки, маркировочная лента тротуаров и спортивные площадки. Используйте неожиданные…
ДАЛЕЕ

08
Апр
2015

Материальный дизайн — Приятные мелочи

Перевод раздела Delightful details официальной документации Google: http://www.google.com/design/spec/material-design/. Анимация может присутствовать во всех компонентах приложения, какого бы размера они ни были. От высокодетализированных иконок до ключевых переходов и действий. Все элементы работают сообща, создавая единое восприятие и прекрасное функциональное приложение….
ДАЛЕЕ

08
Апр
2015

Материальный дизайн — Осмысленные переходы

Перевод раздела Meaningful transitions официальной документации Google: http://www.google.com/design/spec/material-design/. Иногда пользователю трудно определить, куда нужно смотреть. Ему бывает неясно, как элемент попал из точки А в точку Б. Тщательно скоординированный дизайн движений может фактически управлять вниманием пользователя на протяжении множества шагов…
ДАЛЕЕ

08
Апр
2015

Материальный дизайн — Отзывчивое взаимодействие

Перевод раздела Responsive interaction официальной документации Google: http://www.google.com/design/spec/material-design/. Отзывчивое взаимодействие создает доверительную связь с пользователем и вовлекает его. Когда пользователь взаимодействует с приложением и видит, как происходят прекрасные и абсолютно логичные вещи, он чувствует удовлетворение и даже восторг. Взаимодействие имеет…
ДАЛЕЕ

08
Апр
2015

Материальный дизайн — Достоверное движение

Перевод раздела Authentic motion официальной документации Google: http://www.google.com/design/spec/material-design/. Осознание осязаемости формы объекта позволяет нам понять, как манипулировать им. Наблюдение за движением объекта позволяет нам понять, легкий он или тяжелый, гибкий или жесткий, маленький или большой. Движение в мире материального дизайна…
ДАЛЕЕ

01
Апр
2015

Материальный дизайн — Объекты в трехмерном пространстве

Перевод раздела Objects in 3D space официальной документации Google: http://www.google.com/design/spec/material-design/. Между организацией объектов в реальном мире и в их расположении в материальном пространстве существуют параллели. В реальном мире объекты могут накладываться друг на друга, но не могут проходить сквозь друг…
ДАЛЕЕ

01
Апр
2015

Материальный дизайн — Свойства материала

Перевод раздела Material properties официальной документации Google: http://www.google.com/design/spec/material-design/. Материал обладает некоторыми неизменными характеристиками и характерной линией поведения. Понимание этих свойств поможет вам манипулировать материалом в соответствии с концепциями материального дизайна. Физические свойства Материал обладает изменяющимися размерами по осям x и…
ДАЛЕЕ

01
Апр
2015

Материальный дизайн — Окружающая среда

Перевод раздела Environment официальной документации Google: http://www.google.com/design/spec/material-design/. Трехмерный мир Материальная среда является трехмерным пространством, а это значит, что все объекты располагаются в плоскостях x, y и z. Ось z расположена перпендикулярно плоскости отображения, и ее положительная шкала направлена на зрителя….
ДАЛЕЕ

01
Апр
2015

Материальный дизайн — Введение

Перевод раздела Introduction официальной документации Google: http://www.google.com/design/spec/material-design/. Введение Мы поставили перед собой задачу по созданию для своих пользователей визуального языка, который бы сочетал в себе классические принципы хорошего дизайна с инновациями и возможностями технологий и науки. Перед вами материальный дизайн….
ДАЛЕЕ

25
Фев
2015

Обеспечение лучшей резервной поддержки SVG и управление оформлением с помощью элемента <picture>

Перевод статьи Better SVG Fallback and Art Direction With The <picture> Element с сайта http://sarasoueidan.com/, автор — Сара Суэйдан. Помимо использования SVG в CSS в качестве фонового изображения, вы можете использовать SVG и для изображений в контенте HTML с помощью одной из нескольких техник…
ДАЛЕЕ

18
Фев
2015

Использование встроенных SVG с резервной поддержкой Grunticon

Перевод статьи Inline SVG with Grunticon Fallback с сайта css-tricks.com, c разрешения автора — Криса Койера. Вышел Grunticon 2! Он обзавелся новым вебсайтом. Grunticon — это невероятно крутой инструмент для создания системы SVG-иконок. Рабочий процесс выглядит следующим образом: Поместите все…
ДАЛЕЕ