Дизайн WP приложений

в Expression Blend –

это весело!Ангелина ЛукошкинаДизайнерDigital Cloud Technologies

• Принципы Metro в Windows Phone 7 приложениях;

• Прототипирование приложений при помощи Expression Blend SketchFlow;

• Дизайн приложения при помощи Expression Blend;

Принципы Metro в WP 7 приложениях

• Идеология Metro• Организация работы интерфейса

Windows Phone 7

METRO

Принципы METROдизайна

Легкий, простой,открытый, быстрый

Сконцентрируйтесь на сути,Играйте со свободным пространством,Выделяйте приоритеты

Качественнаятипографика

Segoe WP

Хабы

Организация работы интерфейса Windows Phone 7

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

Panorama

Pivot — это основной элемент организации приложений.

Pivot

Application bar

SketchFlow

Инструмент для скетчинга и прототипирования интерактивных приложений

SketchFlow - часть Expression Blend

Что понадобиться?

• Expression Blend + SketchFlow + Visual Studio 2010

• Windows Phone SDK (Windows Phone Developer Tools)

• SketchFlow Template v1 wp7sketchflow.codeplex.com  - устанавливается из файла msi, автоматом добавляет шаблон на страницу нового проекта в Expression Blend

• SketchFlow Template v2 cut.ms/bn5M  - просто архив с шаблоном проекта, который необходимо распаковать в папку c:\users\[username]\Documents

SketchFlow

• Позволяет быстро экспериментировать с динамическими приложениями

• Огромное количество возможностей• Быстрый обмен идеями• Сбор и обмен отзывами

Огромная ценность для бизнеса:Быстрый и недорогой способ предоставить клиенту готовый прототип решения

Прототип — работающая штуковина, которую можно пощупать, потрогать, пожмакать, почувствовать.

В нем может быть мало функциональности (например, всего одна, но работающая(!) функция).

Прототип не жалко выкинуть

Демо

Мы посмотрели

Базовые возможности SketchFlow:

– SketchFlow Map– Создание экранов и навигации между

ними– Использование простых поведений– Возможности получения отзывов– Генерацию документа с описанием

Дизайн приложения в

Expression Blend

Разработка дизайна приложения

Демо

Что почитать?

dynamic-

prototyping.c

om

• http://www.microsoft.com/expression/resources/BlendTraining/Day.aspx?day=1#Intro

• http://expression.microsoft.com/en-us/cc136534

• http://www.amazon.com/gp/product/143023377X?ie=UTF8&tag=expr-20&linkCode=as2&camp=1789&creative=390957&creativeASIN=143023377X

Что почитать?

Обратная свЯЗЬ

angelina.lukoshkina@dctua.com

@An_Gelina