Рубрики
Uncategorized

Таким образом, вы хотите создать систему дизайна, PT. 1: могут ли дизайнеры и разработчики когда-либо друзьями?

Системы дизайна — это ярость в наши дни. Сделано правильно, они делают как дизайн и реализацию UI … Теги с дизайном, UX, Uiweekly, Devops.

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

Давайте посмотрим на них с точки зрения мобильной связи — как вы создаете систему дизайна, которая является полезной, эффективной, и даже удаляет болевые точки взаимодействия между дизайнерами и разработчиками?

Что именно дизайнерская система?

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

Система дизайна состоит из двух частей, описанных этим высокоучным уравнением:

              Design system = Design × System

Дизайнерская часть — это все о том, как выглядит ваш продукт, ведет себя и говорит с пользователем — другими словами, фактический внешний вид’n’feel, возможно, разработан более подробно и с большей глубиной, чем обычно. Это, вероятно, более легкая часть, потому что исторически наша отрасль имела довольно много опыта с такими вещами.

Часть системы не должно быть недооценена, потому что она важно для согласованности, быстрой и дешевого дизайна и реализации, а также способность свободно формировать UX в будущем. Достижение того уровня гибкости сложно, но и в том, где проектные системы приводят наибольшее значение.

Поскольку часть системы должна быть достаточно прочной, чтобы позволить создавать различные конструкции, а затем развиваться во времени, поддерживая реализацию, мы приходим на второе фундаментальное уравнение:

                     Design < System

Это не значит, что дизайн менее важен или менее центен, конечно, нет! Дело в том, что ситуация, когда у вас отличный дизайн, но плохая система намного хуже, чем наоборот, особенно с точки зрения усилий реализации и общей гибкости.

Дизайнеры лучше, ну, проектируют, в то время как разработчики, вероятно, немного лучше при создании систем. Давайте посмотрим, как обе стороны могут помочь друг другу и облегчить работу.

Мне посчастливилось недавно реализовать крупномасштабную конструкторскую систему, используемую в десятках приложений. Основываясь на этом опыте, прежде чем мы доберемся до Nitty-Gritty детали спецификаций и реализаций дизайна, позвольте мне предложить некоторые первоначальные советы как для дизайнеров, так и разработчиков.

Уважаемые дизайнеры

Вы абсолютно необходимы иметь опыт из первых рук со всеми платформами, для которых вы будете проектировать. Вам нужно погрузиться в платформу, впитывая ощущение использования его ежедневно, и познакомиться с его знаковыми приложениями.

Если ваш главный телефон является iPhone, вам нужно получить устройство Android (и наоборот) — Да, я знаю, культурный шок значительна в обоих случаях, но это ваша работа в конце концов. Неважно, если вы собираетесь разработать для автомобилей или смарт-холодильников или истребителей или собачьих домов с поддержкой IOT, вам нужно физически проводить время с этими вещами.

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

Еще хуже, обычно нет никаких очевидных, предсказуемых отношений между тем, что просто и то, что является сложным для реализации. Даже небольшое изменение дизайна с вашей точки зрения может вызвать огромное увеличение усилий реализации. Будьте готовы убить своих любимых или хотя бы отложить их до следующей основной версии.

На Android одна из этих кнопок на самом деле намного дороже для реализации, чем другой.

Если вы не будете разрабатывать это, кто-то еще будет — и что кто-то, вероятно, будет кто-то другой каждый раз, поэтому некоторые вещи в вашем приложении не только будут выходить из вашего контроля, но они также будут выглядеть немного разные каждый раз Отказ Нет другого варианта, кроме как просто проектировать, достаточные детали, все, что потребуется ваша конструкторская система.

Рано или поздно ваш дизайн будет преобразован в код, в лучшем случае 1: 1. В большинстве заявок много пользовательского интерфейса, и он сложен, дорогой, а также очень трудно проверить. Насколько последовательными и систематически вашими спецификациями и конструкциями напрямую и существенно влияют на стоимость развития. Консистенция не просто помогает разработчикам, это также поможет вам также при разработке реальных приложений.

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

Та же размер шрифта, одинакового интервала, но дизайн инструмент и ОС визуализации его немного по-другому. И давайте не начнем с несоответствий по версию ОС …

Если вы не проектируете особое приложение, такие как игры или VR, пожалуйста, уважайте платформу и, следовательно, его пользователи. Цель состоит в том, чтобы ударить правильный баланс между самой платформой, бренд вашего клиента и вашим творчеством. Например, люди не сравнивают iOS и Android-версии вашего приложения друг к другу — что они делают, это сравнивает ваше приложение к другим приложениям на их устройстве.

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

Я не буду назвать конкретный инструмент здесь, но кто-то может совершить этот мусор для контроля источника только над моим мертвым холодным телом.

Поскольку вы являетесь опекунами источника истины вашей системы дизайна, у вас должен быть механизм, чтобы сообщить изменения и обновления вашей системы дизайна. Пожалуйста, поговорите со своими разработчиками часто и будьте готовы встретиться с ними на полпути. Создайте отличные вещи и не забудьте повеселиться в процессе!

Уважаемые разработчики

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

В некотором смысле, вы также несете ответственность за доставку всего, что вы должны иметь возможность запланировать свою работу в целом приложение с технической перспективы, чтобы вы не заканчиваете двумя идеальными экранами и 30 сломанными Отказ Если вы думаете, что что-то отсутствует в системе дизайна, пожалуйста, сообщите дизайнерам! Не прыгайте прямо в реализацию — пусть дизайнеры сделают свою работу. Дайте им разработать вещь, так что это соответствует остальной части дизайна, и пусть они укажены Так что это многоразовый. Вам необходимо иметь идеальный обзор UI вашей платформы, как из перспективы разработки, так и для пользователя. Эти API имеют огромную ширину и глубину и содержат много ошибок и несовместимости, но ваша обязанность знать большинство из них.

54 подклассы чрезмерно оптимистичны. И все это более 30 000 локков долго!

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

Поскольку ваша реализация в идеале будет следовать техническим характеристикам дизайнеров и очень тесно в коде, качество входа от дизайнеров имеет высокий шанс непосредственно влиять на качество вашего кода.

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

Одно из этих вещей не похоже на другую.

Пожалуйста, поговорите с вашими дизайнерами часто и будьте готовы встретиться с ними на полпути. Создайте отличные вещи и не забудьте повеселиться в процессе!

Успешное сотрудничество

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

Автор: @jhutarek

Оригинал: «https://dev.to/mobileit7/so-you-want-to-create-a-design-system-pt-1-can-designers-and-developers-ever-be-friends-l7h»