4 заметки с тегом

windows 8

Дизайн приложений для Windows Phone без ножа

Не секрет, что создание дизайна приложения под Windows Phone или Windows 8 занимает гораздо меньше времени, чем под iOS или Android. И дело тут не только в специфике дизайна. Главным фактором экономии времени является налаженный алгоритм взаимодействия дизайнера с разработчиком. Инструмент, который соединяет дизайн и код — Blend, входящий в пакете Visual Studio.



Как это работает?
Как правило дизайнеры создают макеты либо в Adobe Photoshop, либо в Adobe Illustrator. При создании макетов в этих программах можно следовать нескольким правилам, которые позволят разработчику эффективно обработать макет в Blend.

1. Все объекты должны быть нарисованы “путями” (path). Если импортируете объекты из иллюстратора в фотошоп, всегда вставляйте объекты через «Shape Layer».


Таким образом, макет PSD будет содержать три вида объектов:
Текстовые блоки
Объекты path
Растровые объекты



2. Если к слою применены какие либо эффекты, их нужно обязательно растрировать (правой кнопкой на слой / Rasterize Layer Style).



В противном случае при конвертации в Blend все примененные эффекты — пропадут.

3. Старайтесь использовать родные шрифты Segoe. Либо, в качестве альтернативы, системные шрифты Windows. Использовать уникальные шрифты не возбраняется, но в таких случаях необходима более плотная работа с разработчиком, чтобы все отображалось корректно.
4. Аккуратно группируйте файлы в папки, все названия слоев и папок лучше набирать латиницей. Это элементарное правило позволит легко понимать разработчика, когда он начнет объяснять вам, в каком месте вашего файла что-то не в порядке.
5. Не используйте «tab» и многочисленные пробелы для отбивки при форматировании текстовых блоков. Вообще старайтесь избегать всяческих костылей.

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

Теперь о магии
Для чего все эти правила и зачем их соблюдать? В первую очередь это позволяет дизайнеру забыть о такой «болезненной» операции, как нарезка, разметка (redline). Остаются, конечно, и мелочи, такие как иконки для аппбара (в ближайшее время и это может измениться), иконки приложения, нарезка сплешей.

Экран дизайнера


Экран разработчика


В итоге получается идентичное отображение макетов.

Для разработчика эти файлы так же большой подарок. Все стили, заливки, размеры шрифтов, отступы, все то, что так не любят разработчики, все это уже преобразовано Блендом в код, остается только перенести этот код в проект.



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

Вышеописанный сценарий является компромиссным. В идеале дизайнер должен создавать проект прямо в Blend, и тогда на выходе разработчик будет получать не только стили макета, но и переходы, и функционал основных элементов.
2013   app design   blend   windows 8   windows phone   опыт

QR-код в магазине приложений

Проблема
Сейчас схема получения приложения из браузерной версии Windows Phone store представляется очень сомнительной и неоправданно сложной.

1. Заходим на страницу приложения. Нажимаем установить.
2. Переходим на страницу, где якобы (3) идет связь с телефоном, после чего приложение должно прилететь на телефон в виде пуша. Но как показывает опыт этого никогда не происходит, наверное #странатакая.
На этот случай предусмотрен (4)«план Б». Система отправляет вам письмо со ссылкой на приложение.
5. Далее вы должны зайти в почтовый клиент телефона.
6. Перейти по ссылке в магазин приложений. Нажать установить
7. И вот оно! Долгожданное приложение, загружается в ваш телефон.

Решение
В каждом виндовс телефоне есть отличный встроенный qr-считыватель, который способен распознавать qr-коды любой сложности. Более того в магазине есть куча приложений выполняющих эту функцию.
Так почему бы не использовать этот инструментарий в Windows Phone store?

Заходим на страницу приложения в браузерной версии Windows Phone store. Видим иконку, которая использует стандартную анимацию виндовс — сдвиг. На второй сцене анимации qr-код.


Берем телефон, считываем qr-код, он перекидывает нас в магазин. Вуаля, приложение скачано!


UPD 29.05.2013

Сегодня наткнулся на приложение для браузера Google Chrome Windows Phone QR Beta, которое реализует описанный выше сценарий.

Топ 3 — ДОЖДЬ (Windows 8)

С момента выхода ТВ ДО///ДЬ (W8) прошел всего месяц, а приложение уже попало в тор-3 самых скачиваемых приложений (в своей категории).


И в топ 50 самых скачиваемых приложений Windows store (Россия).


Спасибо всем, кто пользуется приложением.
Сделано в Chocolate Dog Software.