В физическом мире, никто не строит ничего без подробных чертежей, потому что жизнь людей находятся на линии.В цифровом мире, ставки просто не так высоки, .
Это называется «программное обеспечение» по следующей причине: потому что, когда он попадает вам в лицо, это не больно, как много.Никто не умрет, если ваш сайт идет жить с левого края заголовка в 4 пикселей из одной линии с картинки в поле ниже его .
Но, в то время как жизнь пользователей не может быть на линии, дизайн чертежи (также называемые проектные спецификации, или данные) может означать разницу между корректно реализован дизайн, который улучшает пользовательский опыт и удовлетворяет customers и запутаннойи непоследовательными дизайн, который портит пользовательский опыт и недовольство клиентов .
Для тех из нас, кто создает цифровые продукты, дизайн спецификации может означать разницу между эффективного сотрудничества и расточительного процесса назад и вперед с дорогостоящих ошибок выполнения и задержек с доставкой.Это также может означать разницу между Вашего бизнеса зарабатывать деньги и теряет деньги, в этом случае живет фактически может быть на линии .
Короче говоря, данные могут помочь нам построить правильный продукт более быстро и более эффективно .
Какие чертежи (и почему они синий)
Почему чертежи синий?Чтобы найти ответ, давайте вернемся во времени немного, любезно Wikipedia 1 :
“ Проект является воспроизводство технического чертежа, документирования архитектуры или проектирование с использованием процесса печати контакт в светочувствительных листов.Введен в 19 веке, процесс позволил быстро и точное воспроизведение документов, используемых в строительстве и промышленности.Процесс сине-печати характеризуется светлыми линиями на синем фоне, отрицательный оригинального .”
Архитектурные чертежи были ксерокс 19-го века.Они были дешевые, наиболее надежная технология доступна для копирования технических чертежей .
2 
Чертежи были созданы, посылая свет вокруг туши на прозрачной пленке.Свет будет сиять через везде, кроме чернил и ударил мелованную бумагу с светочувствительный материал, превращая, что бумажные синий.Это изложил белую копию инженерной графики на темно-синем фоне .
Эти копии затем были распределены строителям, которые были ответственны за реализацию проектов в этих чертежей .
Сегодня многие дизайнеры также распространять особенностях дизайна для интерфейсных разработчиков, которые отвечают за реализацию проектов.не особенностях дизайна, больше не сделал с бумагой и света, и они больше не синий, но, как и прежде, они гарантируют, что продукт будет построен правильно .
От кирпича в клочья, Bytes
Я узнал значение архитектурных чертежей в моей предыдущей карьеры в качестве девелопера.Один из моих обязанностей было найти великих архитекторов для создания чертежей, так что строители Мы наняли точно знал, что строить.Где-то по пути, я понял, что развитие недвижимости не был для меня: я хотел сделать большее влияние путем создания масштабируемых горизонты виртуального, а не реального, мира.Я узнал, HTML, CSS и JavaScript и отправился на поиски стартапов, которые нанимают.Мое понимание важности детальных чертежей пошел со мной .
В диком западе World Wide Web стартапов, я должен был построить отдельными страницами приложения JavaScript, которые выглядели хорошо и показали хорошие результаты, и я должен был сделать это быстро.Проекты часто дошедшие до нас одну неделю до даты выпуска продукта, и мы попросили, чтобы начать спринт.Проекты, как правило, состоял из Photoshop файлов (РСП) с большим количеством слоев и нулевой specs сопровождать их .
Для бывшего девелопера, работая с графических конструкций без спецификации походило на набор архитектурных чертежей со всеми чертежами и ни один из номеров.Без необходимой CSS “измерения”, я был вынужден охотиться через слои и подуровни форм и текстовых элементов, чтобы выяснить правильное значение HEX для границы вокруг кнопки “Купить” или семейства шрифтов, используемых в “Забыли пароль?”поле.Такой технологический процесс был очень непродуктивно .
Я голодал для спецификации, когда мой друг Chen Blume 5 подошел ко мне с идеей Specctr 15 6 ,инструмент, который принесет знакомые преимущества архитектурных чертежей в мир графического дизайна и веб-разработки интерфейсных.Я сразу же признали ценность и потенциал этой идеи, так что мы начали работать вместесразу, и вскоре после этого, первая версия Specctr был выпущен .
Первоначально плагин Specctr было для Adobe Fireworks users 8 только, что в то время — 2012 — казалось, лучший инструмент для пользовательского интерфейса и веб-дизайнеров.Позже, мы расширили спектр поддерживаемых приложений, и сегодня она включает в себя Fireworks, Illustrator, Photoshop и InDesign .
Фото (и некоторые номера) стоит больше, чем тысячи Words
Они говорят, что картинка стоит тысячи words 9 .Ну, изображения и некоторые значения RGB может быть стоит гораздо больше,
Фраза “картинка стоит тысячи слов” означает, что сложная идея может быть передана с помощью всего одного неподвижного изображения.Это также характеризует также одним из основных целей визуализации, что сделать это можно поглощают большое количество quickly.Тем не менее, в процессе разработки и развития бизнеса, фото или одного PSD не хватает .
Разработчикам нужно знать дизайн-х точная атрибуты, чтобы иметь возможность написать HTML и CSS, необходимые для воссоздания текста и формы элементов через код.Если PSD не сопровождаются подробными спецификациями, затем сделать приблизительные предположения или охота через слои могут привести либо к ошибкам или потере драгоценного времени разработки .
Разработчик Focus
При разработке-то, я, возможно, потребуется несколько минут, чтобы загрузить необходимые ментальные модели в моей голове, прежде чем я могу бытьпродуктивным.Любое прерывание может принести вредительство мяч в сложной воображаемой машины я боролся, чтобы собрать в голове .
Вот почему не выяснять значение RGB или обратиться к партнеру, чтобы спросить, какой шрифт используется может привести к большим пробелам в моей производительности .
И если вы являетесь членом распределенной или удаленной команды, то вы даже не роскошь немедленно получать ответы на свои вопросы с помощью коллеги — вы до асинхронного коммуникационного инструмента, как Skype, Hipchat или, что еще хуже, электронная почта. Как Крис Parnin ставит it 11 :
“ Расходы прерываний были изучены в офисных условиях.Прерванная задача оценивается принять в два раза дольше и содержат в два раза больше ошибок, как непрерывных задач.Работники должны работать в раздробленном состоянии, 57% задач прерывается.Для программистов, есть меньше свидетельства эффектов и распространенность перерывов.Как правило, число, которое получает бросил вокруг возвращения в ‘ zone’ по крайней мере 15 минут после перерыва.Интервью с программистами производить такое же количество .”
Карнавал ошибок: Разработчик Edition
Юлия была на своем компьютере в течение восьми часов подряд и опоздал на ужин с родителями, но она обещала, чтобы этот CSS переход между «Продукт» наложения и “купить” наложения на мастер-отрасли к концудень.Она была почти сделано, но тип на эту кнопку “Отправить” не выглядят так же, как тот, который был в прямом эфире на сайте сейчас .
“Это прекрасно,” подумала она.”Я изменю его завтра.”
Столкнувшись с короткими сроками и перспективы рыться Photoshop слоев, некоторые разработчики будут принять удар в темноте с какой тип использовать — Таким образом, отрицая часов дизайна исследований, которые они вложили в одном стресс топливе решения.
В конце концов, мы должны повторить это в любом случае, но сейчас мы уложиться в срок.Это все о developerудобство .
Никто в истории навсегда положить в дополнительных усилий, чтобы сделать неправильную вещь.Ошибки, как правило, результат после заманчивое ярлык .
Звукозаписывающей индустрии провалилась попытка остановить цифровую дистрибуцию музыки является хорошим примером этого.__4 Spotify в | весь бизнес model 13 базируется на том, что “люди были готовы делать правильные вещи, но только если это было столь же полезным, и гораздо меньше хлопот, чем делать неправильные вещи.”
Дайте передний конец инженера полностью spec’ed дизайн, а затем погреться в лучах благодарности, вытекающих из их лице.Они будут получать все ваши поля и отступы в правильный;что тонкий градиент будет иметь точные значения, которые вы так долго, чтобы соответствовать;и все это будет сделано быстрее.Зачем они это делают что-нибудь еще?Вся информация, они должны тут же перед ними
Триумф занудство: Дизайнер Edition
Лорен взял второй, чтобы оценить ее готовый дизайн.Это было хорошо сбалансированным и передал ощущение спокойствия, все, направляя внимание на кнопку “Отправить” .
Она устала и готова идти домой после долгого рабочего дня, но она обещала доставить готовый дизайн так, что Юлия могли получить фору на развитие его к завтрашнему срока.Она иногда создается спецификации для разработчиков Она работала с, но она просто не иметь его в ней напечатать и сделать каждую индивидуальную аннотацию
“Юлия понять это”, подумала она про себя, она ударила
Это все о designer удобства .
Если дизайн спецификации (т.е. чертежи) есть так много, чтобы предложить, то почему они не часть процесса каждого дизайнера?Поэтому я, как разработчик, может пропустить глядя тип является той же самой причине многие дизайнеры не создают спецификации: Это проще не .
Это потому, что дизайнеры не используют правильные инструменты.Они вручную измерять и отображать каждый аспект, и они печатают значение каждого пикселя и значение RGB “вручную”, используя те же инструменты рисования общего назначения, которые они использовали, чтобы создать дизайн .
Любое время вы спросите группа перестать создавать и сосредоточиться на процессе, вы боретесь тяжелая битва.Холм становится значительно круче, когда процесс идет медленно и нудно .
С правильными инструментами для автоматизации создания спецификации, дизайнеры могут сократить расходы и включить всю свою команду, чтобы пожинать плоды создания и распространения проектных спецификаций .
Давайте создавать (и использование) Дизайн Specs
Два примера выше — с Юлией и Лорен — мнимые, но это не означает, что они не происходят постоянно в реальной жизни.Разработчики не должны делать какие-либо предположения, которые приводят к ошибкам и терять время.С другой стороны, создание подробные спецификациивручную утомительно и занимает много времени дизайнера .
Есть способ лучше?Я думаю, что есть .
Мы должны начать использовать инструменты, которые помогают нам создавать дизайн спецификации с минимумом хлопот.Такие инструменты будут экономить время на дизайнеров и разработчиков и приведет к улучшению рабочих процессов дизайнер-разработчик .
Ниже приведены некоторые выдержки из проекта документа с аннотацией Specctr.С помощью плагина Specctr, дизайнер может быстро предоставить значения цвета любого элемента дизайна, наряду с точным ширины и высоты, градиент значений, атрибутов типа (в т …
Если вы хотите прочитать полностью статью, посетите сайт наших спонсоров