Дизайн-джем #14: изучение Tesla UI Kit и дизайн-систем от Apple, Uber и Microsoft, а также полезные ресурсы по теме
В систематическом дайджесте от Redmadrobot Design Lab.
Мало что впечатляет роботов так, как мощь дизайна. Наши датчики находятся в постоянном поиске следов творческой мысли, которая выражается в самых разных областях. Все самые интересные дизайн-находки мы отправляем на наш Telegram-канал Design Jam, а спустя две недели они попадают в наш тематический дайджест.
В прошлом выпуске мы вдохновились работами талантливых иллюстраторов и художников и изучили полезные ресурсы по теме дизайна сайтов. Сегодня окунёмся в безграничный мир упаковки товаров, но сначала поговорим про дизайн-системы: изучим наработки крупных компаний, пощупаем шаблоны и дизайн-элементы в Figma, потестим сервисы и почитаем полезные книги по теме. Скучно не будет 🤖
Чтобы понять, как устроен дизайн продукта, нужно разложить всё по полочкам. В этом помогает дизайн-система — библиотека из сеток, шрифтов и разных UI-элементов.
К сожалению, такой «брендбук» по проектированию интерфейса есть не у всех компаний — чтобы его создать, нужно систематизировать большое количество информации. К счастью, многие компании и сервисы, у которых он уже есть, щедро выкладывают его в открытый доступ.
Например, на сайте Design Systems For Figma опубликованы дизайн-системы мировых компаний и сервисов: Uber, Atlassian, Apple, Slack, Figma и других. А ещё, их можно загрузить сразу в Figma, чтобы изучить все компоненты. Тот случай, когда можно подробно узнать, откуда растут ноги у любимого продукта.
Дизайн-системы есть не только у частных сервисов, но и у государственных систем США. На сайте U.S. Web Design System подробно описаны все визуальные компоненты, которые используются при их проектировании, а для практического изучения есть скетч-файл с библиотекой элементов.
Если хочется больше экспериментов, то сравните её с дизайн-системой Microsoft. Скорее всего, вы найдёте больше десяти отличий.
Изучение дизайн-систем в самом разгаре, и чтобы у вас не закончилось топливо для экспериментов, мы подкинем парочку ресурсов в костёр творчества 🤖
Мы уже изучили дизайн-системы Apple, Uber, Microsoft и даже правительственных сервисов США, а ещё успели пощупать шаблоны и элементы в Figma, и поговорили про лучшие плагины для этого сервиса. Но это ещё не всё.
Если же свою дизайн-систему создавать вы ещё не готовы, но нейросеть требует пищи для размышлений, то можно проверить свои знания по теме с помощью чек-листа или подписаться на рассылку, которая посвящена отечественным дизайн-системам.
Завершаем тему дизайн-систем полезными книгами. За подборку спасибо старшему рободизайнеру Кате Соседовой.
Начнём с книги “Atomic Design” от веб-дизайнера Брэда Фроста о проектировании надёжных дизайн-систем. Он изучает эффективность дизайн-библиотек и показывает, как можно оптимизировать разработку дизайн-систем внутри команды. Например, автор описывает методологию, которая представляет дизайн-элементы в виде продуманных иерархий, что упрощает проектирование.
У книги “Design Systems” целых пять авторов и все они делятся личным опытом из области планирования, проектирования, создания и внедрения дизайн-систем.
А книга от компании Adobe “Hack the Design System” рассказывает, как спроектировать и масштабировать дизайн-систему внутри крупной организации. Авторы делятся опытом Airbnb, IBM, Microsoft и других компаний. И чтобы закрепить всё то, что мы узнали из подборки, почитайте подробную статью про дизайн-системы от основателя Tilda Publishing Никиты Обухова.
Ну что ж, пришло время поговорить об упаковке! Начнём мы с Amazon. Ежегодно компания отправляет по всему миру более 3 млрд коробок с товарами, и на каждой из них красуется улыбающийся логотип.
Всё, что требуется для сборки конструкции: ножницы и немного клейкой ленты. Тот случай, когда изолента не только держит картон, но и связывает клиента с брендом.
Анбоксинг — это не только жанр на YouTube, но и способ взаимодействия покупателя с брендом. Например, распаковка подарочного набора видеоигры передаёт её атмосферу ещё до запуска. Это настолько увлекательный опыт, что мы готовы смотреть об этом видео.
Если хотите узнать, в чём магия, то посмотрите на распаковку подарочного набора игры The Last of Us 2. Первым делом нас встречает ржавый ящик весом в 4,5 кг, а когда мы его открываем, то видим приставку, диск с игрой, виниловую пластинку с саундтреком, джойстик, наушники, куклу главной героини, рюкзак, футболку, турецкий оберег и живой мох.
Исследовав ржавый сундук со мхом и построив домик для кота, самое время закинуть вещи в стирку, принять душ и посмотреть на высокотехнологичную упаковку.
7th Gen Laundry Care — экологичный порошок для стирки белья в форме капсул и таблеток. Он упакован не в привычную нам картонную коробку, а в пузырёк из биоразлагаемых материалов. Схожим образом поступила и компания Earth Suds. Она выпускает продукцию для душа в упаковке из органики. Благодаря своей экологичности, она особенно популярна у туристов.
Исключительный случай, когда можно не только постирать вещи и помыть голову, но и очистить свою карму заботой о природе. А больше подобных примеров с впечатляющей упаковкой можно изучить на портале The Dieline.
Качественная упаковка привлекает к себе внимание не только на прилавке магазина, но и в вебе. Сайт крафтовой газировки The Carbonation доказывает это на деле: производитель оживил фирменную айдентику бренда при помощи плавных анимаций, гармонии простых форм, выверенной сетки и ярких контрастов 🖤
Чтобы общаться с покупателем на одной волне, бренды действуют подобно человеку: развивают уникальный характер, внешний вид и стиль общения — идентичность. Чтобы понять, как это делать и причём тут упаковка, мы приберегли ссылку на крутую статью по теме. В ней рассматриваются 5 причин, почему важен бренд и описываются 8 шагов к его созданию.
И как мы знаем, пятница без вдохновения — это понедельник. Поэтому держите ссылку на аккаунт Димы Бертолучи — талантливого графического дизайнера из Санкт-Петербурга. Его работы выполнены с уклоном в брендинг и типографику, поэтому в них можно не только лампово залипать, но и изучать что-нибудь полезное.
Вдохновляйтесь, творите и подписывайтесь на наш Design Jam в Telegram. Да пребудет с вами сила роботов!
Полезная и интересная статья! Спасибо)
Да, полностью поддерживаю)