Инструменты андроид разработчика для прототипирования интерфейса android приложений

Автор German Usachev
Инструменты андроид разработчика для прототипирования интерфейса android приложений

Всем привет.

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

А теперь я вам покажу другой сервис для прототипирования он тоже онлайновый в отличие от предыдущего он бесплатен.

Возможно потому, что еще находится в стадии бета-тестирования этот сервис называется Fields и доступен по адресу Fields up.com этот сервис предыдущий позволяет создавать прототипы мобильных приложений в онлайне и расшаривать их через ссылки. Но в отличие от флюида Field Test не содержит библиотека готовых компонентов экрана экран здесь — это заранее вами подготовленное изображение например в. Фотошопе и загруженное на сайт. Я покажу работу — это на примере приложение Ranger или напоминалка которая мы создаем продвинутом курсе так как приложение у нас достаточно простое мы изначально не разрабатывали его Design копия поэтому для демонстрации работы сервиса Fields. Я подготовил несколько скриншотов различных состояний приложения, а также его значок. Это после регистрации на сайте Field Test up.com у нас открывается. Рабочая область. Где мы можем новый прототип прописываем ему имя и добавляем для него иконку приложения на втором шаге нужно добавить Splash Screen Enough я загружаюсь сюда все подготовленные скриншоты — это будут экраны нашего приложения прототипа в настройках можно изменить соотношение сторон. И размер экрана устройства здесь есть два режима режим просмотра прототипа и режим изменения прототип. А изначально мы находимся в режиме изменения и можем менять экран путем добавления ему активных зон или хотспота на каждую активную зону можно назначить пять действий таких как Tab длинный. Тап обычный свайп, а также свайп вправо или свайп влево. Честно говоря я не понял чем об свайп отличается свайпом влево, но тем не менее — это разные действия на каждое действие можно назначить переход на другой экран, а также один из 10 визуальных эффектов которые будут сопровождать этот самый переход таким образом я в сервисе Field Test за полчаса нехитрых манипуляций из полутора десятков картинок собрал несносный прототип приложения remainder который практически в точности повторяет все действия которые вы можете производить в готовом приложение единственное действие приложение которое я не реализовал в прототипе — это отметка выполнения задачи и только. По той простой причине, что я просто не смог на скриншоте поймать момент когда icon списка отмечается как выполнено и анимация выбрасывает её на соседнюю вкладку. Конечно если бы экран в. Фотошопе то — это вполне можно было бы реализовать в описании к этому видео. Я привожу ссылки на оба сервиса просмотренные мной. Здесь также там есть ссылка на. Прототип прямо. Эндера перейдя по ней. Вы можете испытать прототип созданные мной. Здесь также по ссылки под видео. Вы можете скачать настоящий приложение Raider созданная нами в процессе продвинутого курса и сравнить поведение реального приложения с поведением прототипа. А я прощаюсь с последующей урока стройке прототипы разрабатываете свои приложения с вами был. Виталий непочатов. Всем добра.

0 комментариев
0

Читайте также