Дизайн Android-Приложений В Photoshop

Добрый вечер уважаемые хабротяне! Решил поделиться своим небольшим опытом разработки приложений для ОС Android. Мы будем делать дизайн приложения с рецептами, но нам понадобится Фотошоп и воображение.

Если кому интересно, добро пожаловать под кат. С момента своего появления Android претерпел множество изменений в дизайне.

Текущая тенденция наглядно отражена на сайте разработчиков.

Сегодня мы постараемся приблизиться к идеалу, который диктует нам Android, и нарисуем дизайн приложения.

В качестве подопытного я выбрал программу, представляющую собой простой каталог кулинарных рецептов.

Далее я покажу скриншоты с некоторым описанием.



Дизайн Android-приложений в Photoshop

Для начала давайте создадим в Photoshop документ с размерами экрана устройства, который мы будем использовать в качестве ориентира.

Ну что же, дорисовываем кнопки управления + статус-бар.



Дизайн Android-приложений в Photoshop

И теперь первый шаблон, Панель действий, заменил старую строку заголовка, теперь более широкую и осмысленную.

Просто устанавливаю фон.



Дизайн Android-приложений в Photoshop

.

нарисуйте значок.



Дизайн Android-приложений в Photoshop

.

название и главное отличие от того, что было раньше:

Дизайн Android-приложений в Photoshop

Размещаем кнопки, необходимые для нашего приложения.

Получается своеобразное пересечение строки заголовка (например, окон Windows) и меню.



Дизайн Android-приложений в Photoshop

Здесь я добавил категории блюд в виде списка.

Выполнен в одной цветовой гамме.

Советую привести все ваши заявки к одному стилю, правилу хорошего тона - что ли.



Дизайн Android-приложений в Photoshop

Теперь я выбрал один предмет, при нажатии на предмет он будет выглядеть вот так.

Это шаблон удобства использования, который облегчает взаимодействие пользователя с программой.



Дизайн Android-приложений в Photoshop

После нажатия переходим в подкатегорию.

Обратите внимание, что кнопка поиска здесь нам не нужна, а рядом со значком появляется стрелка, которая в данном случае дублирует кнопку «Назад».



Дизайн Android-приложений в Photoshop

Собственно сама страница рецептов.

Теперь стрелка рядом со значком вернет нас на главную страницу, а также мы сможем поделиться рецептом с помощью кнопки «Поделиться».

По возможности максимально используем юзабилити: свайпы, прокрутки и прочие радости жизни.

Теперь дизайн можно отправлять на верстку и кодирование.

Вот пожалуй и все, что я хотел вам сказать, надеюсь, мне удалось передать что-то новое в понятной форме.

Я не претендую на «профессиональные инструкции», это всего лишь мой опыт и наблюдения.

Теги: #Android #дизайн

Вместе с данным постом часто просматривают: