Презентация команды Юрия Филюка. Гастро-кафе "Be Poltavian". RestoCampPoltava 2015
Презентация Юрия Ветрова (Mail.ru Group)
95
Жизнь со множеством платформ Особенности проектирования и дизайна для Android, iPhone, Symbian, WP7 Юрий Ветров
description
Transcript of Презентация Юрия Ветрова (Mail.ru Group)
Жизнь со множеством платформОсобенности проектирования и дизайна для Android, iPhone, Symbian, WP7
Юрий Ветров
2
О чем этот рассказ?
— Продукты выпускаются сразу на нескольких мобильных платформах. Что делать дизайнеру и проектировщику?
— Чем отличаются интерфейсы Android, iOS, Symbian, Windows Phone 7.
1. Android
2. iPhone
3. Windows Phone 7
4. Symbian
4
Androidкомпоновка и типы экранов, паттерны, навигация
5
Компоновка экрана
область уведомлений
активная вкладка
информация о текущем объекте
элемент списка
навигация по экранам
название группы элементов
действия с текущим экраном
6
Типы экранов: Стартовый
7
Типы экранов: Список
8
Типы экранов: Объект
9
Типы экранов: Медиа
10
Типы экранов: Карта
11
Типы экранов: Форма
12
Типы экранов: Настройки
13
Типы экранов: Справочные
14
Типы экранов: Камера
15
Типы экранов: Загрузка приложения
16
Типы экранов: Блокировка
17
Типы экранов: Домашний
18
Навигация
19
Общая навигация между разделами
меню
вкладкистартовые
экраны
20
Навигация внутри экрана
поиск
панелиинструментов
элементысписков
вкладки2го уровня
контент контекстноеменю
21
Действия с объектамиконтекстное
менюдиалоговые
окна
кнопкив панелях
контекстноеменю
22
Между близкими по контексту экранами
кнопкив панелях
23
Событийная навигация
системныеуведомления
24
Навигация между приложениямисистемные
уведомления
кнопка “Back”
многозадачность
25
Гайдлайны
User Interface Guidelineshttp://developer.android.com/guide/practices/ui_guidelines/index.html
Icon Design Guidelineshttp://developer.android.com/guide/practices/ui_guidelines/icon_design.html
1. Android
2. iPhone
3. Windows Phone 7
4. Symbian
27
iPhoneкомпоновка и типы экранов, паттерны, навигация
28
Компоновка экранаобласть уведомлений
информация о текущем объекте
элемент списка действий
действия с текущим экраном
название группы элементов
активная вкладканавигация по экранам
29
Типы экранов: Стартовый
30
Типы экранов: Список
31
Типы экранов: Объект
32
Типы экранов: Медиа
33
Типы экранов: Карта
34
Типы экранов: Форма
35
Типы экранов: Настройки
36
Типы экранов: Справочные
37
Типы экранов: Камера
38
Типы экранов: Загрузка приложения
39
Типы экранов: Блокировка
40
Типы экранов: Домашний
41
Навигация
42
Общая навигация между разделами
вкладки
стартовыеэкраны
43
Навигация внутри экрана
поиск
панелиинструментов
элементысписков контент
44
Действия с объектами кнопки внутри экрана
кнопкив панелях
контекстныеменю
кнопкив панелях
45
Навигация между близкими по контексту экранами
кнопкив панелях
46
Событийная навигация
алертыуведомления
47
Навигация между приложениями
алерты уведомления
многозадачность
48
Гайдлайны
Human Interface Guidelines
http://developer.apple.com/library/ios/#documentation/UserExperience/Conceptual/MobileHIG/Introduction/Introduction.html
Human Interface Guidelines for Web Applications
http://developer.apple.com/safari/library/documentation/InternetWeb/Conceptual/iPhoneWebAppHIG/Introduction/Introduction.html
Safari Web Content Guide
http://developer.apple.com/safari/library/documentation/AppleApplications/Reference/SafariWebContent/Introduction/Introduction.html
System-Provided Buttons and Icons
http://developer.apple.com/library/ios/#documentation/UserExperience/Conceptual/MobileHIG/UIElementGuidelines/UIElementGuidelines.html#//apple_ref/doc/uid/TP40006556-CH13-SW41
Custom Icon and Image Creation Guidelines
http://developer.apple.com/library/ios/#documentation/UserExperience/Conceptual/MobileHIG/IconsImages/IconsImages.html#//apple_ref/doc/uid/TP40006556-CH14-SW1
1. Android
2. iPhone
3. Windows Phone 7
4. Symbian
50
Windows Phone 7компоновка и типы экранов, паттерны, навигация
51
Компоновка экрана
название приложения или (родительского)
экрана
активная вкладка
информация о текущем объекте
элемент списка
навигация по экранам
действия с текущим экраном
область уведомлений
системный цвет для выделения объектов
52
Типы экранов: Стартовый
53
Типы экранов: Список
54
Типы экранов: Объект
55
Типы экранов: Медиа
56
Типы экранов: Карта
57
Типы экранов: Форма
58
Типы экранов: Настройки
59
Типы экранов: Справочные
60
Типы экранов: Камера
61
Типы экранов: Загрузка приложения
62
Типы экранов: Блокировка
63
Типы экранов: Домашний
64
Навигация
65
Общая навигация между разделами
хабы ипанорамы
вкладки
66
Навигация внутри экрана
поиск
панелиинструментов
элементысписков
контент
кнопки внутри экрана
контекстное меню
67
Действия с объектами
кнопкив панелях
кнопкивнутриэкрана
контекстное меню
диалоговые окна
68
Навигация между близкими по контексту экранами
кнопкив панелях
69
Событийная навигация
алерты
подтверждения
70
Навигация между приложениями
алерты
многозадачность
71
Гайдлайны
User Experience Design Guidelines for Windows Phonehttp://msdn.microsoft.com/en-us/library/hh202915(v=VS.92).aspx
UI Design and Interaction Guidehttp://go.microsoft.com/?linkid=9713252
Windows Phone 7 Interoperability Bridgeshttp://windowsphone.interoperabilitybridges.com/
Windows Phone 7 Series Icon Packhttp://windowsteamblog.com/blogs/wpdev/archive/2010/03/27/windows-phone-7-series-icon-pack.aspx
1. Android
2. iPhone
3. Windows Phone 7
4. Symbian
73
Symbianкомпоновка и типы экранов, паттерны, навигация
74
Компоновка экрана
область уведомлений
активная вкладка
информация о текущем объекте
элемент списка
навигация по экранам
действия с текущим экраном
75
Типы экранов: Стартовый
76
Типы экранов: Список
77
Типы экранов: Объект
78
Типы экранов: Медиа
79
Типы экранов: Карта
80
Типы экранов: Форма
81
Типы экранов: Настройки
82
Типы экранов: Справочные
83
Типы экранов: Камера
84
Типы экранов: Загрузка приложения
85
Типы экранов: Блокировка
86
Типы экранов: Домашний
87
Навигация
88
Общая навигация между разделамистартовые
экраны
менюпанель кнопок
вкладки
89
Навигация внутри экрана
панель кнопокпоиск
элементы списков
фильтры
контент
90
Действия с объектами
панель кнопокконтекстное
менюдиалоги
91
Навигация между близкими по контексту экранами
фильтры
кнопкив контенте
92
Событийная навигация
алертыуведомления
93
Навигация между приложениями
алерты уведомления
многозадачность
94
Гайдлайны
Updated Symbian Design Guidelines
http://www.developer.nokia.com/Resources/Library/Symbian_Design_Guidelines/
UI Style Guide
http://
www.forum.nokia.com/info/sw.nokia.com/id/5c419b14-75ff-4791-b1a8-db1e0d72e36e/Symbian_3_UI_Style_Guide.html
Carbide UI Theme Edition Tutorial
http://library.forum.nokia.com/index.jsp?topic=/
Design_and_User_Experience_Library/GUID-3D81EB35-DC3B-4DAA-A6CF-F698D0FA0CF0.html
Mobile Web Browsing
http://www.forum.nokia.com/Develop/Web/
Icons and Metaphors
http://library.forum.nokia.com/index.jsp?topic=/
Design_and_User_Experience_Library/GUID-02FA611E-CA7B-4C05-9697-78D88695C12C.html
Было приятно видеть вас! Вопросы?
Юрий Ветровwww.jvetrau.com twitter.com/jvetrau
www.mail.ru facebook.com/pages/MailRu
Все иллюстрации, использованные в данной презентации, принадлежат их уважаемым владельцам. В случае, если вы являетесь их правообладателем и против размещения этих иллюстраций – напишите, пожалуйста, письмо по адресу [email protected] и я
уберу их из слайдов.
