Правильные инструменты веб-дизайна могут оптимизировать ваш рабочий процесс, помогая вам работать умнее, а не сложнее — и более эффективно. В конце концов, вы хотите инвестировать свою энергию в решение проблем, восхищение пользователей и создание красивых дизайнов. Вы не хотите тратить его на скучные, повторяющиеся и душераздирающие задачи.
К счастью, новые инструменты веб-дизайна выпускаются все время, чтобы помочь вам упростить процессы и сократить время и усилия — особенно в дизайне пользовательского интерфейса.
Здесь мы рассмотрим 29 блестящих инструментов для веб-дизайна в этом году и дальше, что поможет вам стать более продуктивными. Некоторые из них продают новые марки; другие были на некоторое время. Но у всех есть потенциал, чтобы сэкономить ваше время, энергию и бюджет в ваших проектах веб-дизайна.
Эскиз быстро заменяет Photoshop в качестве инструмента для дизайна пользовательского интерфейса
Начнем с наиболее очевидным. Да, мы знаем, что все слышали об инструменте разработки векторного пользовательского интерфейса Sketch — Bohemian Coding — но, по-видимому, по-прежнему существует много веб-дизайнеров, которые полагаются на Photoshop для дизайна пользовательского интерфейса (и это несмотря на выпуск Adobe XD, прототипирование Adobe и инструмент каркаса — on e новых дополнений к Creative Cloud).
Рори Берри, креативный директор Superrb, по праву считает, что использование Photoshop для веб-дизайна является ошибкой. Он сделал переход на Sketch в 2017 году и настоятельно рекомендует его. «Будучи пользователем Photoshop уже более 10 лет, было сложно изменить и узнать что-то новое», — говорит он. «Но буквально после первого дня использования Sketch не было оглядывания назад. Я полный конверт ».
Он предлагает ряд причин. «По сравнению с Photoshop, сортировка всех ваших документов, которые у вас есть, и внесение изменений в Sketch намного проще», — начинает он. «У Sketch есть небольшие документы, тогда как Photoshop имеет большие. Из-за того, что это векторное приложение, размеры файлов значительно меньше по сравнению с Photoshop. »
И это еще не все. «Встроенная система сетки в Sketch великолепна и упрощает дизайн интерфейса. Я думаю, что общий пользовательский интерфейс и минимальное ощущение делают его более чистым для дизайна и удобного для пользователя. Photoshop кажется очень сложным в сравнении ».
Сообщество Sketch предлагает сотни плагинов, чтобы сделать работу дизайнеров более легкой и плавной, добавляет он. «В принципе, есть плагин для всего, если вы можете его найти. Photoshop / Lightroom по-прежнему является нашим решением для редактирования фотографий, но Sketch — победитель для веб-дизайна ».
Не пропустите наши 17 советов по использованию Sketch.
02. Adobe XD
Эскиз-соперник Adobe XD имеет легкий интерфейс, который позволяет вам легко и легко концептуализировать и прототип
Adobe vector design and wireframing tool, Adobe XD, продолжает улучшаться, с объявлением в Adobe MAX в этом году, что теперь он будет включать прототипирование голоса.
XD включает инструменты рисования, инструменты, которые позволяют вам определять не -статические взаимодействия, мобильные и настольные iews и инструменты для обмена отзывами по проектам. Он позволяет выбрать размер монтажной области для конкретного устройства для запуска проекта, и вы даже можете импортировать популярный набор пользовательского интерфейса, например, Material Material.
Андрей Робу, директор по дизайну студии Robu в Барселоне, среди его поклонников. «XD еще не заменит Sketch, но для быстрых макетов это здорово», — говорит он. «Это очень легкий интерфейс, с большим количеством загруженных фотографий, и отлично подходит для раскладок. Прототипирование очень полезно, чтобы показать клиентам, как работает материал, особенно потому, что вы можете сразу нажать содержимое онлайн. Мне также нравится, что я могу копировать и вставлять материал из других приложений Adobe ».
. В частности, Adobe XD интегрируется с остальная часть Creative Cloud. Эллис Роджерс, дизайнер графики в Receptional Ltd также рекомендует его. «Эскиз блестящий для разработки для веб-разработчика, потому что вы работаете над ценностями в программном обеспечении, построенном именно для проектирования веб-сайтов и приложений», — говорит он. «Но самым большим ограничением для меня было то, что он доступен только на Mac, что затрудняет обмен файлами Sketch для веб-разработчиков / дизайнеров, не использующих OS X. Совместное использование файлов Sketch для разработки означало дополнительное программное обеспечение / конверсии или работу с плоскими JPG — что-то что было слишком много границ.
Будучи пользователем Photoshop и Illustrator, пользовательский интерфейс для Adobe XD чувствовал себя знакомым, добавляет он, поэтому не было реальной кривой обучения для ее использования. «Итак, теперь, после нескольких недель пробной версии, это единственный инструмент, который я теперь использую для всего веб-дизайна, дизайна приложений, прототипов или каркасов».
Роджерс также хвалит возможности XD предлагает использовать библиотеки Adobe для быстрого импорта любой актив из Photoshop или Illustrator, поскольку это делает проекты совместной работы более быстрыми.
«Работа с дизайнерами и иллюстраторами UI / UX делает этот процесс простым», — говорит он. «Когда проект / прототип или каркас завершены, Adobe XD позволяет очень быстро выбирать элементы и создавать переходы страниц для рабочего прототипа, который можно разделить по ссылке. Ссылка также позволяет вам собирать обратную связь на странице, сохраняя ее организованность. Ссылка может быть обновлена в Adobe XD, поэтому клиент всегда может увидеть последнюю версию, не беспокоясь о неправильных версиях; абсолютная радость для работы ».
03. Figma
Figma позволяет вам проектировать, прототип и собирать отзывы с другими дизайнерами в реальном времени
Figma — это инструмент для проектирования интерфейса, который позволяет нескольким дизайнерам сотрудничать в режиме реального времени. Он доступен в браузере или в Windows, Mac или Linux, а также есть бесплатные и платные версии в зависимости от того, для чего вы его используете.
Вот некоторые из его выдающихся Особенности:
«Фигма имеет аналогичный USP, как Sketch, за исключением кросс-платформенности», — объясняет дизайнер Front Benjamin Read. «Недавно я использовал его для создания нескольких значков для статьи, которую мы публикуем на нашем веб-сайте, и нашел рабочий процесс невероятно гладким. У меня не было времени учиться, и у меня была дополнительная польза от совместной работы: вы можете делиться графикой с другими в приложении ».
« Я пытался переключиться на Linux для своей работы, и иногда мы используем Windows, поэтому Figma имеет смысл для меня с практической точки зрения », — добавляет он. «В сравнении я нашел много инструментов для других платформ.»
Внештатный писатель и художник Дэвид Иствуд, также имеет хорошие вещи, чтобы сказать о Фигме. «Это также был очень полезный инструмент, когда нам нужно было быстро высмеивать MVT; иногда небольшие дополнения к существующему макету. Нам нравится, что вы можете быстро создавать проекты для настольных компьютеров, планшета и мобильных устройств ».
04. Affinity Designer
Сертификат Affinity программного обеспечения быстро становится альтернативой Creative Suite
«Дизайнер Affinity от Serif имеет назвали «Photoshop-убийцу» некоторыми, и легко понять, почему », — говорит Дэн Эдвардс, креативный директор No Divide.« Мои первые впечатления о том, что приложение невероятно хорошо спроектировано и похоже, что оно было специализированный инструмент для веб-дизайна и графики.
«Были некоторые функции, которыми я действительно наслаждался, включая регулируемые, неразрушающие слои. Это означает, что вы можете настраивать изображения или векторы, не повреждая их.
«Масштаб на 1 000 000 процентов был просто блаженством (очень часто 32 000 фотошопов чувствуют, что этого недостаточно). Это особенно полезно при работе с векторным искусством , так как вы действительно можете приблизиться. Функции отмены и истории также очень удобны — Affinity позволяет вам вернуться на более чем 8 000 шагов! »
« Когда дело доходит до проектирования, пользовательский интерфейс чувствует себя знакомым. из Photoshop, все, кажется, хотят начать все заново, что может создать реальную проблему. Что Affinity сделала, чтобы сохранить привычную компоновку, одновременно затягивая все и скрывая отвлекающие факторы. Я легко мог прыгнуть прямо и получить проектирование ».
«В целом, Affinity чувствует, что это может быть настоящим конкурентом Photoshop, Illustrator и Sketch. И всего за 48,99 фунтов стерлингов это реальная сделка!»
Не пропустите наши руководства по использованию персонаж Pixel, экспонента и Pen t ool в Affinity Designer, который теперь также доступен для iPad.
05. Аниме
Spice up ваши приложения с этим движком анимации
Хотя анимации веб-страниц временами получили плохой рэп, разработчики всегда ищут способы сделать вещи проще. CSS-анимации и переходы были огромным шагом вперед, но для более сложных взаимодействий часто требуется библиотека. Аниме — это новый движок анимации, который вы хотите посмотреть на если вам нужно добавить сложный анимированный com
Вот пример, чтобы продемонстрировать суперпростой API:
Этот код определяет объекты, которые вы хотите оживить, а также особенности анимации. API позволяет настраивать элементы с помощью селекторов CSS, элементов DOM или даже объектов JavaScript.
Автор, Джулиан Гарнье, предоставил коллекцию CodePen, которая демонстрирует, что может сделать библиотека, а также полную документацию по GitHub .
06. Avocode
Avocode помогает вам кодировать веб-сайты или приложения из проектов Photoshop или Sketch
Avocode делает его чрезвычайно простым для разработчиков с интерфейсом для кодирования веб-сайтов или приложений из проектов Photoshop или Sketch. Он создан той же командой, которая принесла нам CSS Hat и PNG Hat, поэтому неудивительно, что они сделали процесс экспорта еще одним шагом дальше. Хотя предыдущие приложения разрешили вы экспортируете задницу ets, что делает Avocode действительно особенным, так это то, что вы можете использовать свой Photoshop-плагин для синхронизации вашего PSD в Avocode одним щелчком мыши.
Avocode быстро и автоматически анализирует ваш PSD или файл Sketch и привносит все в красиво оформленный интерфейс , Затем у вас есть полный контроль над тем, как вы экспортируете активы, включая экспорт SVG в качестве стандарта.
Вы также можете щелкнуть элементы в дизайне и скопировать и вставить код в текстовый редактор по вашему выбору. «Он предоставляет пользователям все необходимое для кодирования — предварительный просмотр дизайна, доступ ко всем слоям и экспорт активов», — говорит соучредитель Avocode Ву Чунг Ань. «Самое лучшее, что разработчикам вообще не нужны Photoshop или Sketch. Текущий рабочий процесс действительно отстой, и именно поэтому мы создали Avocode.»
Мы не уверены, что какое-либо приложение может когда-либо реплицировать разработчика. Но мы знаем многих дизайнеров с жестким давлением, которые с радостью используют это, чтобы превратить PSD и Sketch-файлы в интерактивные проекты, которые затем могут стать основой для сборки веб-сайта. Он стоит от 14 долларов в месяц.
07. Zeplin
Zeplin переводит файлы Photoshop или Sketch в бесплатное Mac, Windows или веб-приложение
Джеймс Стейф, безусловно, делает это: «Они не всегда используют одно и то же программное обеспечение, — отмечает он, — поэтому те кропотливые слоистые и аннотированные макеты Photoshop заканчиваются сплющенные файлы и вещи неизбежно теряются в переводе .
Zeplin смягчает этот болезненный опыт, переводя Photoshop или Sketch файлы в бесплатное Mac, Windows или веб-приложение. «Лучшая часть — это то, что Zeplin обеспечивает быструю ссылку на цвета, размеры и шрифты из ваших проектов», — говорит Стриф. «Он даже создает CSS и руководства по стилю. Я обнаружил, что Zeplin — это огромная экономия времени, и моим друзьям-разработчикам, похоже, это очень нравится ».
08. Pattern Lab
Pattern Lab основан на атомном дизайне
Pattern Lab — это красивый узорный дизайн инструмент, созданный Дэйвом ОИсеном и Брэдом Фростом, основан на концепции Atomic Design, в которой говорится, что вы должны разбить свой дизайн на самые маленькие части — атомы — и объединить их для формирования более крупных, многоразовых компонентов — молекул и организмов, — которые могут затем превращаться в пригодную для использования пластин.
Хотя по своей сути это статический генератор сайтов, который сшивает компоненты пользовательского интерфейса, в Lab Lab гораздо больше, чем в Lab Lab. Это язык и инструмент-агностик; он позволяет вам встраивать шаблоны пользовательского интерфейса внутри друг друга и создавать динамические данные; он оснащен инструментальными средствами изменения размера окна, которые помогут вам обеспечить полную адаптацию вашей системы проектирования; и он полностью расширяется, поэтому вы можете быть уверены, что он будет расширяться, чтобы удовлетворить ваши потребности.
09. Vivaldi
Иногда лучший инструмент может быть таким простым, как новый браузер. Vivaldi — это быстрый, настраиваемый веб-браузер для опытных пользователей, созданный некоторыми людьми, которые запустили Opera. Дублированный «браузер для наших друзей», Vivaldi построен с использованием веб-технологий: JavaScript и React были использованы для создания пользовательского интерфейса, а также Node.js и множества модулей NPM.
Vivaldi — это самый настраиваемый браузер, и он предлагает другие интересные функции, такие как управление командной строкой, панель для заметок, укладка вкладок и черепица, а также веб-панели, которые позволяют размещать все ваши любимые сайты в одном месте для легкого доступа.
10. Canva
Canva — популярный инструмент для быстрого создания изображений и инфографики в социальных сетях
Хотите Лоуренс Хармер (Lawrence Harmer), основатель Solve Web Media, рекомендует Canva. Это бесплатные, основанные на браузере инструменты, которые используются как дизайнерами, так и не дизайнерами, для создания графики как для печати, так и для веб-сайтов .
«Канва претт я хорош для создания хороших изображений », — говорит Хармер. «Изображения — это окно в душу вашего сайта и социальных сетей, поэтому такой инструмент может быть ключом к успеху».
11. Инструмент для веб-дизайна
Generate предложения по веб-дизайну легко с помощью этого бесплатного инструмента
Beewits имеет хорошая линия в инструментах, облегчающих деловую сторону веб-дизайна, а именно ее генератор котировок веб-дизайна и калькулятор часовых тарифов. Теперь для 2018 года появилось еще одно превосходное бесплатное приложение: самоочевидный инструмент для создания веб-дизайна.
«Это важно y простой инструмент «Proposify», который позволяет вам быстро и легко выпускать предложения », — объясняет Дэвид Аттард из Beewits. «Это прославленная форма, которая позволяет вам вводить и изменять заданный текст, а затем создает документ Word, готовый для прямой отправки клиенту». Альтернативно, вы можете ввести свой собственный текст без использования шаблона.
Если вы входите в бесплатный сервис, вы можете сохранить свою текущую версию, так что в следующий раз у вас есть куча полей, которые уже заполнены вашими данными. Это просто, но он выполняет свою работу.
12. Site Stacks
Вы можете быстро и легко проверить технологический стек любого веб-сайта
Вот еще один инструмент, основанный на браузере это просто и блестяще. Введите URL-адрес любого веб-сайта для этого расширения Chrome, и он позволит вам взглянуть на его технический стек. Он быстрый, плавный и надежный, обеспечивает покрытие более чем 40 000 продуктов и гордится своей точностью и полнотой его данные.
«Мы построили это расширение, чтобы упростить доступ к этим данным, — говорят его создатели, — а также защищают вашу конфиденциальность и выполняют все операции на наших собственных серверах, чтобы ваш просмотр не замедлялся».
13. CodePen Projects
14. Bootstrap
Старый любимый Bootstrap имеет несколько новых новых обновлений
Bootstrap, конечно, не новый инструмент. это революция в развитии, и нет сомнений в том, что повсеместная структура будет продолжать формировать то, как мы создаем материал в Интернете. Каждое обновление также приносит полный пересмотр инструмента. Из последней версии команда говорит:
С Bootstrap 4 мы снова снова чтобы проект учитывал два ключевых архитектурных изменения: переход на Sass и переход на flexbox CSS. Наше намерение заключается в том, чтобы немного помочь продвинуть сообщество веб-разработчиков вперед, нажав на новые свойства CSS, меньшее количество зависимостей и новые технологии в более современных браузерах ».
15. ally.js
Не упускайте из виду доступность — используйте ally.js
Никакого списка инструментов веб-разработки не будет полным без по крайней мере, один инструмент доступности. Доступность — один из тех часто забываемых аспектов проектирования и разработки, и ally.js может упростить его для вас.
Теперь стабильный продукт, ally.js — это библиотека JS, которая дает вам прекрасный контроль над фокусируемыми и непроницаемые элементы. Например, используя свой API, вы можете запретить получать элементы вне модального окна, пока модальный не будет закрыт. Вы также можете узнать, какие элементы являются настраиваемыми или настраиваемыми, а также определить изменения фокуса в тени DOM.
Две другие мощные функции — это возможность определять, каким образом фокус изменился (клавиатура, мышь и т. Д.). ), и когда элемент является фокусируемым и физически видимым на экране (это может помочь избежать прокрутки страницы).
16. Тип Nugget
Тип Самородок дает вам больший контроль над вашими наборами
Тип Самородок адресован вам 'll на почти каждом проекте frontend: работа с типографикой CSS. Все еще в бета-версии с большим количеством функций в работе, это онлайн-набор инструментов, который дает вам прекрасный контроль над стилями типов.
Инструмент отображает разнообразные набор текстовых образцов на странице, h можно отрегулировать в реальном времени на панели справа. Панель позволяет выбирать размер шрифта, вес, стиль, цвет, расстояние между буквами, оформление текста и многое другое для отдельных аспектов страницы (глобальные стили, заголовки, абзацы, ссылки и списки HTML).
инструмент позволяет вам зарегистрироваться для учетной записи, войти в систему и сохранить свой прогресс. После указания всех ваших настроек вы можете нажать кнопку «Создать код», а Type Nugget создаст ссылку на таблицу стилей, размещенную на ее CDN. Если вы найдете сложную и повторяющуюся типографию CSS, вам будет полезно добавить этот инструмент в рабочий процесс.
17. ARKit
Создание дополненной реальности для устройств iOS 12 с ARKit 2 от Apple
Расширенная реальность — смешивание цифровые объекты и информация с окружающей средой вокруг вас — это пространство, которое сейчас вызывает волнение в сообществе разработчиков приложений для веб-приложений и приложений. Не в последнюю очередь из-за ARKit от Apple, рамки, которая позволяет вам легко создавать события AR для iPhone и iPad под управлением iOS 11 или выше. Для начала просто загрузите iOS 11 или 12 и самую последнюю версию Xcode, которая включает в себя SDK. Проверьте, на что способен ARKit.
18. Vue.js
Не используется для комплектации библиотек JavaScript? Vue.js идеально подходит для вас
Каким будет список новых веб-инструментов без рамки JavaScript? Vue.js, например React, является основой для создания пользовательских интерфейсов и использует виртуальную DOM. Как следует из названия, основная библиотека Vue сосредоточена на уровне представления .
Посмотрите на пример кода, взятый из документов Vue, который использует пользователя input and demonstrates the library’s elegance. We’ll start with the HTML:
Notice the custom v-on handler that calls the reverseMessage method. Here’s the JavaScript:
In that example, I’m populating the paragraph with data and defining the reverseMessage method. Vue is great for those less experienced with complex libraries, but also has a number of plugins to help with development of complex single-page web apps.
{{ message }}
var myApp = new Vue({
el: '#example',
data: {
message: 'Hello Vue.js!'
},
methods: {
reverseMessage: function () {
this.message = this.message.split('').
reverse().join('')
}
}
});
19. Hologram
This Mac app built on A-Frame lets you create WebVR experiences without needing to code
Hologram is an all-in-one tool for WebVR creation. This free desktop app requires no previous coding knowledge, and its native Google Blocks integration enables you to play with lots of free 3D objects right off the bat. Under the hood, Hologram takes full advantage of the power and simplicity of A-Frame, Mozila’s WebVR framework.
This means that developers can download projects created with Hologram and use them in their A-Frame workflows. It’s currently available on Mac and a Windows version is promised soon.
20. Parallax SVG Animation Tools
This set of tools makes it easier to create complex sequences of SVG animation
Created by Gareth Battensby of Parallax, SVG Animation Tools is a range of SVG animation tools in the form of a Python script. “I built the tools as a response to the frustrations you get when creating complex or long sequence SVG animations,” he says in this explanatory blog post.
“The biggest of these being overwritten edits whenever you re-export from Illustrator. These tools completely eliminate that issue – they’re perfect for front-end developers who animate SVG graphics with GSAP or similar animation libraries.”
21. Quill
Quill is a flexible rich text editor with a powerful API
Quill is billed as a WYSIWYG rich text editor ‘for the modern web’. There are lots of different contexts in applications where a rich text editor is needed, so it’s no wonder Quill has exploded in popularity since its version 1.0 beta release in mid-2016.
Now a stable product, Quill lets you convert a basic div element into a powerful rich text editor with a few lines of JavaScript:
But the most powerful features in Quill are its flexibility and extensibility by means of modules and a powerful API. Quill offers themes and modules that include toolbar, keyboard, clipboard and history. You can test-drive many of these features in the Quill playground and of course the documentation is a must-read if you intend to use its advanced features.
22. URL to PDF
Convert HTML into PDFs automatically with this API
Brought to you by Alvar Carto, this self-hosted API enables you to convert the HTML into PDFs, so it’s handy for rendering receipts, invoices, or any other HTML content. The API ignores a page's @media print CSS rules by default, and sets Chrome to emulate @media screen, to make the default PDF look more like the actual site. You can set it to operate automatically at regular intervals and best of all, it’s free.
23. iotaCSS
iotaCSS is a CSS framework with a difference
iotaCSS is a CSS framework that’s been purposely crafted to be design-agnostic. It was created by consultant frontend architect Dimitris Psaropoulos, who found that other CSS frameworks were imposing a lot of limitations on the designers he worked with. This was forcing him to either write a lot of code on top, or ask the designer to compromise. So instead, he created his own framework, which works a little differently.
While most CSS Frameworks behave as a unit, iotaCSS is a set of individual, small and flexible modules that don’t depend on each other. You can use one independently or you can combine them to build more complicated user interfaces.
iotaCSS been quietly in development for a couple of years, with a number of early adopters using it to build high-scale products. But now it’s out of beta and confidently announcing itself to the world. You can learn more about how it works in this blog post.
24. Launchpad
Launchpad is a tool from Anima that lets you publish websites directly from Sketch, with no coding required. The entire interface is integrated into Sketch, and can be used to create landing pages and static websites, although at the moment it doesn't support dynamic web pages using JavaScript. But it does let you include links, add responsive breakpoints, set up forms, embed videos and integrate analytics tools. So it could be an ideal tool for setting up a quick and easy promotional website, for example.
You can learn more about Launchpad in this blog post.
25. React Sketch.app
26. SVGito
27. Sizzy
Sizzy allows you to preview multiple screens during app testing
Sizzy is a tool that allows you to preview multiple screens at once while you’re testing out your responsive web apps.
Creator Kristijan Ristovski had previously been using react-storybook to switch between the different variations of each component. But he got annoyed having to go back and forth between so many devices. So he built Sizzy, which allows you to see all the changes simultaneously, making it much quicker and easier to spot and fix layout bugs.
You can learn more about Sizzy in this blog post.
28. Foundation for Emails 2
Create responsive HTML emails with Foundation for Emails 2
Foundation for Emails is a framework from ZURB formerly known as Ink. It is used for creating responsive HTML emails that work on just about every platform and service, bundling together email coding best practices. The latest iteration uses a Sass codebase that gives you access to a settings file, wherein you can define all sorts of defaults to suit your needs.
As well as the framework itself, ZURB has provided the ZURB Email Stack, an all-in-one workflow that includes:
The Getting Started guide will help walk you through how to get the stack up and running should you choose to take advantage of all the features.
29. Form
RelativeWave's Form is a prototyping tool like no other we've tried. It's not a typical design tool in that there's no tools or layers palette. Using the app feels like a mix of design and code.
While you can't actually create graphics in the app, you can insert them and use what Form calls 'patches' to add gestures and interactions. The Mac app requires you to also use the iOS app so you can view your prototype in real time and interact with it.
"Form is an app design and prototyping tool with the goal of producing designs that are closer to what you get in production," explains RelativeWave creative coder Max Weisel. "We want designers to work directly on the production side of an app, and at the same time free up engineers to focus on more complex problems."
There are some great tutorials on how to use Form, but the process is rather complex if, like us, you are used to creating visuals in Photoshop. Moving an image to the centre of your device, for example, is achieved using Superview variables and Match Patches. Once in place you use maths to divide the width and height and connect them to the X and Y positions in Image View. Group those together, rename the variables and adjust the X and Y anchor points. We found this process fairly complex.
However, once you get your head around the processes, you can create stunning prototypes. Having access to the device's camera and other sensors means the prototypes you create are just as powerful as the coded app would be.