Не часто вы ассоциируете Adobe со «бесплатными» загрузками, но это именно то, что эта компания сделала с Adobe XD . Это быстрое приложение для создания прототипов интерфейсов для мобильных устройств и веб-сайтов, позволяющее дизайнерам быстро разрабатывать проекты для конкретных платформ.
Самое лучшее в Adobe XD — это простота использования. Даже если у вас мало опыта в разработке чего-либо, есть только очень постепенная кривая обучения, чтобы удержать вас.
Даже пользовательский интерфейс выглядит потрясающе, без всех инструментов и панелей, которые отвлекают так много людей от таких приложений, как Photoshop, Illustrator и Lightroom. В этой статье мы познакомим вас с Adobe XD и объясним, что вы можете и не можете с ним сделать.
Что такое Adobe XD?
Adobe XD — это инструмент для дизайна. Он не создаст ваше приложение для вас, но поможет вам представить концепцию или прототип того, каким вы хотите, чтобы ваше следующее мобильное или планшетное приложение, веб-сайт или другой пользовательский интерфейс были похожи. В приложении используются художественные доски, в основном макеты экрана, для визуального представления дизайна вашего приложения.
Создание мобильных приложений и сайты, которые работают, могут потребовать много технических ноу-хау. Adobe XD предоставляет вам инструменты для превращения идеи в доказательство концепции. Когда вы закончите, у вас будет план, с которого можно работать, и один, который вы можете настраивать бесконечно, пока не будете довольны дизайном.
Точно так же, что концепт-арт так важен в творческих начинаниях (см. Этот красивый концептуальный арт видеоигр концепт-арт качестве доказательства), когда дело доходит до разработки программного обеспечения и создания веб-сайта, важно получить подтверждение концепции желаемого дизайна интерфейса. Предоставление программистам концепции, которая так близко соответствует конечному продукту, является отличным способом согласовать ваши ожидания с тем, что возможно.
Лучше всего приложение разработано таким образом, что любой может его использовать. Являетесь ли вы опытным дизайнером, программистом или человеком, которому не хватает обоих этих навыков; Adobe XD может преодолеть разрыв между вашим видением и техническими знаниями. Вам даже не нужно учиться кодировать о разработке приложения.
Что может сделать Adobe XD?
Adobe XD разработан с учетом нескольких конкретных приложений, но вы также можете мыслить нестандартно. Приложение облегчает задачу, включая шаблоны для:
- Приложения для смартфонов: от iPhone 5 и SE до самых последних моделей; и общий шаблон Android тоже.
- Приложения для планшетов: с шаблонами для iPad, iPad обоих размеров, Surface Pro 3 и 4 и универсальный шаблон планшета Android.
- Веб-сайты / веб-приложения: с несколькими предустановками, включая Full HD.
Вам не нужно придерживаться этих шаблонов, они просто существуют, чтобы облегчить вашу жизнь. Вы также можете указать полностью настраиваемый размер интерфейса (например, экрана) и начать проектирование практически для любой платформы, которую вы можете себе представить.
Если вы разрабатываете мобильное приложение, вы можете загрузить бесплатное приложение Adobe XD для вашей платформы и экспортировать свои проекты для предварительного просмотра на вашем устройстве.
Наборы пользовательского интерфейса делают жизнь еще проще
Если вы думаете о разработке для iOS , Android, Windows или другая хорошо зарекомендовавшая себя платформа; Вы можете использовать комплекты пользовательского интерфейса, чтобы получить руку помощи. По сути, это шаблоны проектов, поддерживаемые Apple, Google, Microsoft и другими, которые можно загрузить в формате Adobe XD.
С помощью комплектов пользовательского интерфейса вы можете ускорить производство, позволяя разрабатывать свое приложение с учетом ограничений и общих элементов, которые вы видите на выбранной платформе. Поскольку они поддерживаются разработчиками платформы, они, как правило, всегда актуальны и основательны.
Например, комплект пользовательского интерфейса Apple iOS включает размеры пустого экрана для ряда устройств, примеры клавиатуры iOS, элементы навигации, такие как лента в верхней части экрана, кнопки переключения iOS и многое другое. Вы можете легко копировать и вставлять элементы в артборды дизайна и создавать точные прототипы.
Adobe также поддерживает несколько других наборов пользовательского интерфейса, включая образцы умных часов, совместимых с watchOS, набор веб-сайтов для электронной коммерции и набор примеров для создания смартфонов в цифровой валюте. Вам нужно будет загрузить соответствующие комплекты пользовательского интерфейса для iOS , Google Material design и Microsoft Windows отдельно.
Простой набор встроенных инструментов
В отличие от других сложных графических и дизайнерских приложений Adobe, XD имеет приятный чистый пользовательский интерфейс с несколькими простыми инструментами. У вас есть основные фигуры: прямоугольники, круги, линии и инструмент для создания пользовательских фигур. Есть также простой текстовый инструмент с доступом к библиотеке шрифтов Typekit (но не ко всем).
Затем вы можете изменить различные атрибуты, относящиеся к этим элементам, такие как непрозрачность, цвет заливки, границы, тени и поведение прокрутки. Наконец, есть увеличительное стекло и артборд инструмент для расширения вашего дизайна.
Adobe XD помогает размещать элементы в эстетически приятных местах, «привязывая» их к краям экрана, центральной точке холста и другим элементам. Вы можете изменить это, если хотите, удерживая кнопку (в версии для Mac это Cmd ).
Вдоль верхнего края приложения вы увидите два переключателя: Дизайн и Прототип . Дизайн — это то, где вы проводите большую часть своего времени, создавая свое видение. Переключитесь в режим Prototype, чтобы добавить различные взаимодействия между элементами на экране. Вы можете инициировать события и переключаться на различные монтажные области, обеспечивая простоту использования без написания кода.
Это делается с помощью простого интерфейса перетаскивания, например: создайте кнопку с помощью инструмента «Круг», создайте новый артборд с желаемым результатом нажатия этой кнопки (например, другой вкладкой в вашем приложении), переключитесь в режим «Прототип» и перетащите стрелку с кнопки на ваш новый артборд. Нажмите кнопку «Play» или превью на своем живом устройстве, чтобы увидеть, как оно воспроизводится.
Вы даже можете указать переходы и эффекты, чтобы они выглядели модно. Есть несколько довольно больших ограничений в режиме Prototype. Вы не можете получить слишком глубокое понимание этого, но оно служит цели, и его простая реализация делает его простым в использовании.
Насколько ограничена бесплатная версия Adobe XD?
Являясь бесплатным продуктом, Adobe XD предназначен для того, чтобы вы могли подключиться к его простому рабочему процессу и удобным инструментам, не тратя ни копейки. Самым большим недостатком бесплатной версии является невозможность иметь более одного активного общего прототипа или набора проектных спецификаций одновременно.
Так что для вашего первого дизайна или проекта бесплатной версии может быть достаточно. Когда дело доходит до того, чтобы делиться большим количеством проектов или проектов с вашей командой или разработчиками приложений, вы быстро наткнетесь на стену. Вы всегда можете экспортировать различные монтажные области в виде файлов .PNG бесплатно навсегда с помощью параметра « Файл»> «Экспорт» .
Тем не менее, общее прототипирование и интерактивность между артбордами является одной из выдающихся особенностей здесь. Приложение по-прежнему полезно без него, но не в такой же степени. Вы не можете создать полностью реализованный прототип, но вы можете быстро сложить свой дизайн.
Другие ограничения бесплатной версии включают ограниченное количество шрифтов Typekit и 2 ГБ облачного хранилища (в отличие от 100 ГБ) для подписчиков Creative Cloud. Если вы решите получить наличные деньги за платную версию , Adobe XD обойдется вам в 9,99 долл. США в месяц только для этого приложения или в 52,99 долл. США в месяц для полного пакета Creative Cloud.
Мы считаем, что Adobe Creative Cloud стоит своих денег. , при условии, что вы сможете использовать его достаточно.
Adobe XD — удивительно удобный инструмент
Adobe XD — это полезный инструмент, независимо от того, собираетесь вы платить за него или нет. В некоторых случаях вы можете получить бесплатную версию для работы над небольшими личными проектами. Когда дело доходит до серьезной работы и обмена с командами, вам нужно обновить.
Adobe XD — это не все и не конец дизайна пользовательского интерфейса. Дизайнеры годами используют графические инструменты для создания макетов для веб-сайтов, дизайна приложений и многого другого. Ознакомьтесь с лучшими инструментами векторной графики Mac для дизайнеров с ограниченным бюджетом чтобы увидеть некоторые способные альтернативы.