Мобильный Дизайн является областью дизайна, которая начала развиваться пару лет назад. С запуском iPhone и App Store в 2008 году, рынок разработки мобильных приложений стал более интересен, так как наконец, появились хорошие мобильные аппаратные и экосистемы. С развитием все большего количества мобильных приложений, дизайн таких приложений начал становиться более важным, чтобы обеспечить хороший опыт для пользователей.
В этой статье вы сможете прочитать о самых важных вещах, которые вы должны знать, прежде чем приступить к разработке мобильных приложений.
Знайте свой рынок
Одной из первых вещей, которую вы должны сделать, чтобы подготовить и информировать себя к разработке мобильного приложения, является наличие собственного смартфона. Это должно быть очевидным, что если вы являлись пользователем смартфона в течение нескольких лет, для вас это станет большим преимуществом при разработке мобильных приложений. Вы должны стать пользователем перед тем, как быть дизайнером, и с помощью самого устройства и его приложений, вам будет намного легче понять потребности и проблемы приложений. Ваше внимание должно быть сконцентрировано на iPhone или Android, так как они являются двумя наиболее распространенными платформами. В последнее время с запуском Windows Phone 8, появился рынок, с дизайном и для этой платформы. И даже если вы должны быть осведомлены о всех видах приложений, предназначенных для нее, мы все еще бы рекомендовали вам пока сосредоточиться на IOS и Android.
Самая большая разница между разработкой мобильных приложений и настольных приложений или даже веб-сайтов, это контекст, именно он делает мобильные приложения настолько мощными и интересными. Каждое приложение используется для своих собственных целей, на определенное время и место. Если вы создаете ресторанный гид, вы хотите создать что-то, что покажет наиболее релевантные результаты для пользователя в минимум времени, так как пользователь, вероятно, будет на улице или на ходу, и ищет быструю рекомендацию. Это открывает большие возможности для инноваций в мобильных разработках, и как дизайнер, вы всегда должны быть проинформированы и вы обязаны тестировать последние приложения, чтобы быть в курсе всех новинок.
Так что, если случайно, вы все еще не пользователь смартфона, то тогда пора купить один и начать загрузку и тестирования приложений, так как это пользовательский опыт, и безусловно, один из самых важных вещей при разработке богатых и мощных мобильных приложений. И не лимитируйте себя только устройством, которым вы владеете, пытайтесь получить информацию о других тоже. Вы можете проверить скриншоты приложений на каждом рынке, App Store для IOS, Google Play для Android и Apps+Games для Windows Phone. Мы рекомендуем вам проверить одну услугу и как эта услуга работает на разных мобильных платформах, таким образом вы сможете изучить стили и различия между каждой платформы. Например, ниже вы можете посмотреть пример Facebook для IOS, Android и Windows Phone.
Визуальное вдохновение
Мобильные экосистемы постоянно меняются и развиваются на основе экспериментов и инноваций, много новых подходов разрабатываются ежедневно. От приложений для чтения, обмена фотографиями до производительности и списка дел, существуют все виды приложений, доступных для пользователей. У каждого из этих приложений есть конкретный визуальный стиль и тон, в зависимости от цели и контекста приложения.
Визуальные знания это те, которые каждый дизайнер должен улучшать в любой области. В мобильном дизайне, это очень важно, так как каждый день появляется новый интерфейс, новая модель дизайна, новый мобильный стиль. Наблюдая и анализируя другие дизайны, это дает вам, веб-дизайнерам, лучшее понимание и больше визуальной информации каждый раз, когда вы работаете над своим проектом.
Вы должны вдохновлять себя большими мобильными приложениями, которые создаются, пока мы говорим. У веб-сайтов, таких как mobile-patterns.com и pttrns.com есть сотни экранов с высоким качеством для мобильных приложений. Если вам нужно вдохновение по иконкам IOS, тогда советуем посетить iicns.com.
Визуальное вдохновение не только важно для внешнего вида вашего приложения, но и для того, как пользователь взаимодействует с ним. Постарайтесь узнать все возможные жесты, поймите, как пользователь хочет взаимодействовать с приложением, и спросите себя, какой самый простой и самый естественный путь для достижения действия, и как вы можете сделать инновацию (прорыв) в этой области?
Дизайн мобильных шаблонов
Прежде чем приступить к дизайну, вы должны изучить существующие модели (шаблоны) мобильных дизайнов, и начать свой проект с “пользовательской точкой зрения” в голове. Мы дадим небольшое пояснение.
В этих шаблонах, вы можете изучить и проанализировать различные виды интерфейсов, меню и навигации, а также использовать их в качестве базы для дизайна ваших мобильных приложений, основанных на содержание и цели вашего приложения. Как вы видите, дизайны шаблонов, действительно полезны, так как вы можете увидеть какие решения уже существуют, и как они отразятся на интерфейсе. Здесь, впервые вы начнете прокручивать дизайн в голове, умственно тестировать макеты, и раздумывать о том, что является более адекватным для вашего приложения.
Задайте себе следующие вопросы: «Какая главная цель моего приложения?”, “Сколько и какие наиболее важные разделы моего приложения”, “Какие действия должны быть доступны пользователю при использовании приложения?». Это вопросы, которые помогут вам выбрать шаблон и определить его базовую структуру.
Начинаем дизайн
После информирования, тестирования, наблюдения, вдохновения, сравнения того что вы можете и должны делать, пришло самое время перейти к самому дизайну. В зависимости от того, какой вы тип человека, вам не стоит сразу открывать Photoshop и создавать пиксели. Подумайте, сделайте эскиз, прототип и итерацию.
Для черчения, вы можете взять iPhone этюдник, которые помогают создавать iPhone сетки, или просто скачайте один из своих бесплатных шаблонов. Это поможет вам сделать эскиз вашей дизайнерской идеи прямо на iPhone макете.
После нескольких эскизов, вы должны создать основную версию вашего приложения, ваш прототип. Существует много прототипов приложений, которые могут вам помочь, но не забудьте выбрать тот, у которого уже есть iPhone шаблон.
Как только макет экрана и приложения закончен, вы можете перейти к созданию последних отполированных пикселей в Photoshop. Мы бы рекомендовали вам, получить хороший PSD, такой как teehan+lax iOS шаблон. Тем самым вам не прийдется заниматься дизайном iOS “дефолтовых” элементов, таких как кнопки, меню выбора, уведомления и т.д. Не волнуйтесь, если вы разрабатываете приложение для Android, для них тоже существуют шаблоны.
Примеры дизайна мобильных приложений
Так что это самые важные вещи, которые нужно знать до начала разработки мобильных приложений. Как всегда, у каждого свой рабочий процесс и предпочтительные приложения, поэтому постарайтесь выбрать свою платформу, нужное программное обеспечение, шаблон и начинайте заниматься творчеством в мобильной области.
Когда ваш дизайн будет готов, старайтесь как можно ближе работать с разработчиком, это гарантирует, что ваше видение и дизайн были разработаны именно так, как вы себе представляли. Так же, как и веб-разработка, это сложная, а иногда и скучная работа, но это должно быть сделано, для того чтобы ваш конечный продукт выглядел именно так, как вы этого хотите.