SlideShare ist ein Scribd-Unternehmen logo
1 von 95
Юрий Ветров

Жизнь со множеством платформ
Особенности проектирования и дизайна для Android, iPhone, Symbian, WP7
О чем этот рассказ?


— Продукты выпускаются сразу на
  нескольких мобильных платформах. Что
  делать дизайнеру и проектировщику?
— Чем отличаются интерфейсы Android, iOS,
  Symbian, Windows Phone 7.




2
1. Android
2. iPhone
3. Windows Phone 7
4. Symbian
Android
компоновка и типы экранов, паттерны, навигация




4
Компоновка экрана
область уведомлений

 активная вкладка             навигация по экранам


  информация о
 текущем объекте


  элемент списка


                                название группы
                                   элементов




                              действия с текущим
                                   экраном



          5
Типы экранов: Стартовый




6
Типы экранов: Список




7
Типы экранов: Объект




8
Типы экранов: Медиа




9
Типы экранов: Карта




10
Типы экранов: Форма




11
Типы экранов: Настройки




12
Типы экранов: Справочные




13
Типы экранов: Камера




14
Типы экранов: Загрузка приложения




15
Типы экранов: Блокировка




16
Типы экранов: Домашний




17
Навигация




18
Общая навигация между разделами
стартовые
  экраны                            вкладки




                 меню




  19
Навигация внутри экрана   элементы
                                 списков
                    вкладки
    поиск          2го уровня




   панели           контент     контекстное
инструментов                       меню

      20
Действия с объектами     контекстное
                                  меню
контекстное       диалоговые
   меню              окна




                     кнопки
                   в панелях
      21
Между близкими по контексту
 экранами




  кнопки
в панелях




 22
Событийная навигация




 системные
уведомления




23
Навигация между приложениями
многозадачность                    системные
                                  уведомления




                  кнопка “Back”




       24
Гайдлайны


User Interface Guidelines
http://developer.android.com/guide/practices/ui_guideli
nes/index.html
Icon Design Guidelines
http://developer.android.com/guide/practices/ui_guideli
nes/icon_design.html




25
1. Android
2. iPhone
3. Windows Phone 7
4. Symbian
iPhone
компоновка и типы экранов, паттерны, навигация




27
Компоновка экрана
область уведомлений
                               действия с текущим
                                    экраном


   информация о
  текущем объекте



  элемент списка
     действий




                                название группы
                                   элементов




навигация по экранам            активная вкладка


           28
Типы экранов: Стартовый




29
Типы экранов: Список




30
Типы экранов: Объект




31
Типы экранов: Медиа




32
Типы экранов: Карта




33
Типы экранов: Форма




34
Типы экранов: Настройки




35
Типы экранов: Справочные




36
Типы экранов: Камера




37
Типы экранов: Загрузка приложения




38
Типы экранов: Блокировка




39
Типы экранов: Домашний




40
Навигация




41
Общая навигация между разделами




             стартовые
               экраны




              вкладки




42
Навигация внутри экрана
элементы
 списков       контент         поиск




                               панели
                            инструментов

  43
Действия с объектами     кнопки внутри экрана

                   кнопки
                 в панелях




контекстные        кнопки
   меню          в панелях
    44
Навигация между близкими по
контексту экранами


                кнопки
              в панелях




45
Событийная навигация
           уведомления   алерты




46
Навигация между приложениями
алерты       уведомления




                           многозадачность


  47
Гайдлайны

Human Interface Guidelines
http://developer.apple.com/library/ios/#documentation/UserExperienc
e/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/AppleApplicat
ions/Reference/SafariWebContent/Introduction/Introduction.html
System-Provided Buttons and Icons
http://developer.apple.com/library/ios/#documentation/UserExperienc
e/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/UserExperienc
e/Conceptual/MobileHIG/IconsImages/IconsImages.html#//apple_ref/
doc/uid/TP40006556-CH14-SW1



48
1. Android
2. iPhone
3. Windows Phone 7
4. Symbian
Windows Phone 7
компоновка и типы экранов, паттерны, навигация




50
Компоновка экрана
название приложения            область уведомлений
 или (родительского)
       экрана
  активная вкладка             навигация по экранам



   информация о
  текущем объекте




  элемент списка


системный цвет для
выделения объектов



                               действия с текущим
                                    экраном



           51
Типы экранов: Стартовый




52
Типы экранов: Список




53
Типы экранов: Объект




54
Типы экранов: Медиа




55
Типы экранов: Карта




56
Типы экранов: Форма




57
Типы экранов: Настройки




58
Типы экранов: Справочные




59
Типы экранов: Камера




60
Типы экранов: Загрузка приложения




61
Типы экранов: Блокировка




62
Типы экранов: Домашний




63
Навигация




64
Общая навигация между разделами



                                  вкладки




        хабы и
       панорамы


65
Навигация внутри экрана      кнопки внутри экрана

   поиск       элементы   контент
                списков




   панели
                                      контекстное меню
инструментов

       66
Действия с объектами
                               диалоговые окна
            контекстное меню




кнопки           кнопки
внутри         в панелях
экрана
  67
Навигация между близкими по
контексту экранами




   кнопки
 в панелях




68
Событийная навигация


              алерты


           подтверждения




69
Навигация между приложениями


              алерты




          многозадачность




70
Гайдлайны


User Experience Design Guidelines for Windows
Phone
http://msdn.microsoft.com/en-
us/library/hh202915(v=VS.92).aspx
UI Design and Interaction Guide
http://go.microsoft.com/?linkid=9713252
Windows Phone 7 Interoperability Bridges
http://windowsphone.interoperabilitybridges.com/
Windows Phone 7 Series Icon Pack
http://windowsteamblog.com/blogs/wpdev/archive/2010
/03/27/windows-phone-7-series-icon-pack.aspx



71
1. Android
2. iPhone
3. Windows Phone 7
4. Symbian
Symbian
компоновка и типы экранов, паттерны, навигация




73
Компоновка экрана
область уведомлений
  активная вкладка            навигация по экранам


  информация о
 текущем объекте


  элемент списка




                              действия с текущим
                                   экраном



          74
Типы экранов: Стартовый




75
Типы экранов: Список




76
Типы экранов: Объект




77
Типы экранов: Медиа




78
Типы экранов: Карта




79
Типы экранов: Форма




80
Типы экранов: Настройки




81
Типы экранов: Справочные




82
Типы экранов: Камера




83
Типы экранов: Загрузка приложения




84
Типы экранов: Блокировка




85
Типы экранов: Домашний




86
Навигация




87
Общая навигация между разделами
стартовые          вкладки
  экраны




                 панель кнопок         меню


     88
Навигация внутри экрана     фильтры
    контент




элементы списков
                      поиск       панель кнопок
        89
Действия с объектами




                   контекстное
панель кнопок                    диалоги
                      меню

       90
Навигация между близкими по
контексту экранами


            фильтры




                кнопки
              в контенте




91
Событийная навигация
           уведомления   алерты




92
Навигация между приложениями
алерты       уведомления




                           многозадачность


  93
Гайдлайны

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_Ex
perience_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_Ex
perience_Library/GUID-02FA611E-CA7B-4C05-9697-
78D88695C12C.html

94
Было приятно видеть вас! Вопросы?



                                                                      Юрий Ветров
                                                                      www.jvetrau.com
                                                                      twitter.com/jvetrau




                                                                      www.mail.ru
                                                                      facebook.com/pages/MailRu



       Все иллюстрации, использованные в данной презентации, принадлежат их уважаемым владельцам. В случае, если вы являетесь их
правообладателем и против размещения этих иллюстраций – напишите, пожалуйста, письмо по адресу jvetrau@gmail.com и я уберу их из слайдов.

Weitere ähnliche Inhalte

Ähnlich wie Презентация Юрия Ветрова (Mail.ru Group)

User Experience 2011: Мастер-класс: Кросс-платформенное проектирование для мо...
User Experience 2011: Мастер-класс: Кросс-платформенное проектирование для мо...User Experience 2011: Мастер-класс: Кросс-платформенное проектирование для мо...
User Experience 2011: Мастер-класс: Кросс-платформенное проектирование для мо...Yury Vetrov
 
Владимир Макеевв «Проектирование интерфейса Android приложений»
Владимир Макеевв «Проектирование интерфейса Android приложений»Владимир Макеевв «Проектирование интерфейса Android приложений»
Владимир Макеевв «Проектирование интерфейса Android приложений»touchin
 
Разрабатываем качественное Windows 8 приложение
Разрабатываем качественное Windows 8 приложениеРазрабатываем качественное Windows 8 приложение
Разрабатываем качественное Windows 8 приложениеMykhail Galushko
 
di.by 2014 e-commerce mobile: как подружить интернет-магазин с мобильными уст...
di.by 2014 e-commerce mobile: как подружить интернет-магазин с мобильными уст...di.by 2014 e-commerce mobile: как подружить интернет-магазин с мобильными уст...
di.by 2014 e-commerce mobile: как подружить интернет-магазин с мобильными уст...Darya Kosilo
 
di.by 2014 e-commerce mobile: как подружить интернет-магазин с мобильными уст...
di.by 2014 e-commerce mobile: как подружить интернет-магазин с мобильными уст...di.by 2014 e-commerce mobile: как подружить интернет-магазин с мобильными уст...
di.by 2014 e-commerce mobile: как подружить интернет-магазин с мобильными уст...Yuri Vedenin
 
Автоматическое тестирование мобильных приложений на основе скриншотов
Автоматическое тестирование мобильных приложений на основе скриншотовАвтоматическое тестирование мобильных приложений на основе скриншотов
Автоматическое тестирование мобильных приложений на основе скриншотовSergey Borisov
 
Живые обои для Android. Как создать. Тонкости. Продвижение
Живые обои для Android. Как создать. Тонкости. ПродвижениеЖивые обои для Android. Как создать. Тонкости. Продвижение
Живые обои для Android. Как создать. Тонкости. ПродвижениеSergey Mikhaylov
 
Вёрстка для мобильных телефонов
Вёрстка для мобильных телефоновВёрстка для мобильных телефонов
Вёрстка для мобильных телефоновtoWave.ru
 
Наталия Макишвили "Вёрстка для мобильных устройств"
Наталия Макишвили "Вёрстка для мобильных устройств"Наталия Макишвили "Вёрстка для мобильных устройств"
Наталия Макишвили "Вёрстка для мобильных устройств"Yandex
 
Remote (dev)tools своими руками
Remote (dev)tools своими рукамиRemote (dev)tools своими руками
Remote (dev)tools своими рукамиRoman Dvornov
 
Graduate Project: designing a web site and 3D application for Elby Adbertising
Graduate Project: designing a web site and 3D application for Elby AdbertisingGraduate Project: designing a web site and 3D application for Elby Adbertising
Graduate Project: designing a web site and 3D application for Elby AdbertisingAnna Kholina
 
Основы работы в BPwin.pdf
Основы работы в BPwin.pdfОсновы работы в BPwin.pdf
Основы работы в BPwin.pdfssuser117705
 
Особенности тестирования мобильных приложений (Android, iOS)
Особенности тестирования мобильных приложений (Android, iOS)Особенности тестирования мобильных приложений (Android, iOS)
Особенности тестирования мобильных приложений (Android, iOS)Эльвина Сакаева
 
METRO. Дизайн для Windows Phone
METRO. Дизайн для Windows PhoneMETRO. Дизайн для Windows Phone
METRO. Дизайн для Windows PhoneNikita Lukianets
 
Урок 3Ds Max - полустационар "Компьютерная графика и дизайн" в КА "ШАГ"
Урок 3Ds Max - полустационар "Компьютерная графика и дизайн" в КА "ШАГ"Урок 3Ds Max - полустационар "Компьютерная графика и дизайн" в КА "ШАГ"
Урок 3Ds Max - полустационар "Компьютерная графика и дизайн" в КА "ШАГ"STEP Computer Academy (Zaporozhye)
 
Презентация на тему: Операционная система Windows
Презентация на тему: Операционная система WindowsПрезентация на тему: Операционная система Windows
Презентация на тему: Операционная система Windows2berkas
 
Разработка мобильных приложений на HTML5
Разработка мобильных приложений на HTML5Разработка мобильных приложений на HTML5
Разработка мобильных приложений на HTML5DevDay
 
Подходы к тестированию андроид приложений
Подходы к тестированию андроид приложенийПодходы к тестированию андроид приложений
Подходы к тестированию андроид приложенийSQALab
 

Ähnlich wie Презентация Юрия Ветрова (Mail.ru Group) (20)

User Experience 2011: Мастер-класс: Кросс-платформенное проектирование для мо...
User Experience 2011: Мастер-класс: Кросс-платформенное проектирование для мо...User Experience 2011: Мастер-класс: Кросс-платформенное проектирование для мо...
User Experience 2011: Мастер-класс: Кросс-платформенное проектирование для мо...
 
Me12 usabiliti-mobile
Me12 usabiliti-mobileMe12 usabiliti-mobile
Me12 usabiliti-mobile
 
Владимир Макеевв «Проектирование интерфейса Android приложений»
Владимир Макеевв «Проектирование интерфейса Android приложений»Владимир Макеевв «Проектирование интерфейса Android приложений»
Владимир Макеевв «Проектирование интерфейса Android приложений»
 
Разрабатываем качественное Windows 8 приложение
Разрабатываем качественное Windows 8 приложениеРазрабатываем качественное Windows 8 приложение
Разрабатываем качественное Windows 8 приложение
 
Gtug.sucks.vs.rules
Gtug.sucks.vs.rulesGtug.sucks.vs.rules
Gtug.sucks.vs.rules
 
di.by 2014 e-commerce mobile: как подружить интернет-магазин с мобильными уст...
di.by 2014 e-commerce mobile: как подружить интернет-магазин с мобильными уст...di.by 2014 e-commerce mobile: как подружить интернет-магазин с мобильными уст...
di.by 2014 e-commerce mobile: как подружить интернет-магазин с мобильными уст...
 
di.by 2014 e-commerce mobile: как подружить интернет-магазин с мобильными уст...
di.by 2014 e-commerce mobile: как подружить интернет-магазин с мобильными уст...di.by 2014 e-commerce mobile: как подружить интернет-магазин с мобильными уст...
di.by 2014 e-commerce mobile: как подружить интернет-магазин с мобильными уст...
 
Автоматическое тестирование мобильных приложений на основе скриншотов
Автоматическое тестирование мобильных приложений на основе скриншотовАвтоматическое тестирование мобильных приложений на основе скриншотов
Автоматическое тестирование мобильных приложений на основе скриншотов
 
Живые обои для Android. Как создать. Тонкости. Продвижение
Живые обои для Android. Как создать. Тонкости. ПродвижениеЖивые обои для Android. Как создать. Тонкости. Продвижение
Живые обои для Android. Как создать. Тонкости. Продвижение
 
Вёрстка для мобильных телефонов
Вёрстка для мобильных телефоновВёрстка для мобильных телефонов
Вёрстка для мобильных телефонов
 
Наталия Макишвили "Вёрстка для мобильных устройств"
Наталия Макишвили "Вёрстка для мобильных устройств"Наталия Макишвили "Вёрстка для мобильных устройств"
Наталия Макишвили "Вёрстка для мобильных устройств"
 
Remote (dev)tools своими руками
Remote (dev)tools своими рукамиRemote (dev)tools своими руками
Remote (dev)tools своими руками
 
Graduate Project: designing a web site and 3D application for Elby Adbertising
Graduate Project: designing a web site and 3D application for Elby AdbertisingGraduate Project: designing a web site and 3D application for Elby Adbertising
Graduate Project: designing a web site and 3D application for Elby Adbertising
 
Основы работы в BPwin.pdf
Основы работы в BPwin.pdfОсновы работы в BPwin.pdf
Основы работы в BPwin.pdf
 
Особенности тестирования мобильных приложений (Android, iOS)
Особенности тестирования мобильных приложений (Android, iOS)Особенности тестирования мобильных приложений (Android, iOS)
Особенности тестирования мобильных приложений (Android, iOS)
 
METRO. Дизайн для Windows Phone
METRO. Дизайн для Windows PhoneMETRO. Дизайн для Windows Phone
METRO. Дизайн для Windows Phone
 
Урок 3Ds Max - полустационар "Компьютерная графика и дизайн" в КА "ШАГ"
Урок 3Ds Max - полустационар "Компьютерная графика и дизайн" в КА "ШАГ"Урок 3Ds Max - полустационар "Компьютерная графика и дизайн" в КА "ШАГ"
Урок 3Ds Max - полустационар "Компьютерная графика и дизайн" в КА "ШАГ"
 
Презентация на тему: Операционная система Windows
Презентация на тему: Операционная система WindowsПрезентация на тему: Операционная система Windows
Презентация на тему: Операционная система Windows
 
Разработка мобильных приложений на HTML5
Разработка мобильных приложений на HTML5Разработка мобильных приложений на HTML5
Разработка мобильных приложений на HTML5
 
Подходы к тестированию андроид приложений
Подходы к тестированию андроид приложенийПодходы к тестированию андроид приложений
Подходы к тестированию андроид приложений
 

Mehr von .toster

Native look and feel bbui & alicejs
Native look and feel bbui & alicejsNative look and feel bbui & alicejs
Native look and feel bbui & alicejs.toster
 
Практики применения JRuby
Практики применения JRubyПрактики применения JRuby
Практики применения JRuby.toster
 
Sinatra: прошлое, будущее и настоящее
Sinatra: прошлое, будущее и настоящееSinatra: прошлое, будущее и настоящее
Sinatra: прошлое, будущее и настоящее.toster
 
Attributes Unwrapped: Lessons under the surface of active record
Attributes Unwrapped: Lessons under the surface of active recordAttributes Unwrapped: Lessons under the surface of active record
Attributes Unwrapped: Lessons under the surface of active record.toster
 
Decyphering Rails 3
Decyphering Rails 3Decyphering Rails 3
Decyphering Rails 3.toster
 
Understanding the Rails web model and scalability options
Understanding the Rails web model and scalability optionsUnderstanding the Rails web model and scalability options
Understanding the Rails web model and scalability options.toster
 
Михаил Черномордиков
Михаил ЧерномордиковМихаил Черномордиков
Михаил Черномордиков.toster
 
Андрей Юношев
Андрей Юношев Андрей Юношев
Андрей Юношев .toster
 
Алексей Тарасенко - Zeptolab
Алексей Тарасенко - ZeptolabАлексей Тарасенко - Zeptolab
Алексей Тарасенко - Zeptolab.toster
 
Maximiliano Firtman - Разработка приложений с помощью PhoneGap
Maximiliano Firtman - Разработка приложений с помощью PhoneGap Maximiliano Firtman - Разработка приложений с помощью PhoneGap
Maximiliano Firtman - Разработка приложений с помощью PhoneGap .toster
 
Вадим Башуров
Вадим БашуровВадим Башуров
Вадим Башуров.toster
 
Вадим Башуров - Как откусить от яблока лимон
Вадим Башуров - Как откусить от яблока лимонВадим Башуров - Как откусить от яблока лимон
Вадим Башуров - Как откусить от яблока лимон.toster
 
Вадим Башуров - Как откусить от яблока лимон
Вадим Башуров - Как откусить от яблока лимонВадим Башуров - Как откусить от яблока лимон
Вадим Башуров - Как откусить от яблока лимон.toster
 
Pablo Villalba -
Pablo Villalba - Pablo Villalba -
Pablo Villalba - .toster
 
Jordi Romero Api for-the-mobile-era
Jordi Romero Api for-the-mobile-eraJordi Romero Api for-the-mobile-era
Jordi Romero Api for-the-mobile-era.toster
 
Внутренняя архитектура и устройства соц. сети "Одноклассники"
Внутренняя архитектура и устройства соц. сети "Одноклассники"Внутренняя архитектура и устройства соц. сети "Одноклассники"
Внутренняя архитектура и устройства соц. сети "Одноклассники".toster
 
Reusable Code, for good or for awesome!
Reusable Code, for good or for awesome!Reusable Code, for good or for awesome!
Reusable Code, for good or for awesome!.toster
 
Matthew Eernisse, NodeJs, .toster {webdev}
Matthew Eernisse, NodeJs, .toster {webdev}Matthew Eernisse, NodeJs, .toster {webdev}
Matthew Eernisse, NodeJs, .toster {webdev}.toster
 
Wild wild web. html5 era
Wild wild web. html5 eraWild wild web. html5 era
Wild wild web. html5 era.toster
 
Web matrix
Web matrixWeb matrix
Web matrix.toster
 

Mehr von .toster (20)

Native look and feel bbui & alicejs
Native look and feel bbui & alicejsNative look and feel bbui & alicejs
Native look and feel bbui & alicejs
 
Практики применения JRuby
Практики применения JRubyПрактики применения JRuby
Практики применения JRuby
 
Sinatra: прошлое, будущее и настоящее
Sinatra: прошлое, будущее и настоящееSinatra: прошлое, будущее и настоящее
Sinatra: прошлое, будущее и настоящее
 
Attributes Unwrapped: Lessons under the surface of active record
Attributes Unwrapped: Lessons under the surface of active recordAttributes Unwrapped: Lessons under the surface of active record
Attributes Unwrapped: Lessons under the surface of active record
 
Decyphering Rails 3
Decyphering Rails 3Decyphering Rails 3
Decyphering Rails 3
 
Understanding the Rails web model and scalability options
Understanding the Rails web model and scalability optionsUnderstanding the Rails web model and scalability options
Understanding the Rails web model and scalability options
 
Михаил Черномордиков
Михаил ЧерномордиковМихаил Черномордиков
Михаил Черномордиков
 
Андрей Юношев
Андрей Юношев Андрей Юношев
Андрей Юношев
 
Алексей Тарасенко - Zeptolab
Алексей Тарасенко - ZeptolabАлексей Тарасенко - Zeptolab
Алексей Тарасенко - Zeptolab
 
Maximiliano Firtman - Разработка приложений с помощью PhoneGap
Maximiliano Firtman - Разработка приложений с помощью PhoneGap Maximiliano Firtman - Разработка приложений с помощью PhoneGap
Maximiliano Firtman - Разработка приложений с помощью PhoneGap
 
Вадим Башуров
Вадим БашуровВадим Башуров
Вадим Башуров
 
Вадим Башуров - Как откусить от яблока лимон
Вадим Башуров - Как откусить от яблока лимонВадим Башуров - Как откусить от яблока лимон
Вадим Башуров - Как откусить от яблока лимон
 
Вадим Башуров - Как откусить от яблока лимон
Вадим Башуров - Как откусить от яблока лимонВадим Башуров - Как откусить от яблока лимон
Вадим Башуров - Как откусить от яблока лимон
 
Pablo Villalba -
Pablo Villalba - Pablo Villalba -
Pablo Villalba -
 
Jordi Romero Api for-the-mobile-era
Jordi Romero Api for-the-mobile-eraJordi Romero Api for-the-mobile-era
Jordi Romero Api for-the-mobile-era
 
Внутренняя архитектура и устройства соц. сети "Одноклассники"
Внутренняя архитектура и устройства соц. сети "Одноклассники"Внутренняя архитектура и устройства соц. сети "Одноклассники"
Внутренняя архитектура и устройства соц. сети "Одноклассники"
 
Reusable Code, for good or for awesome!
Reusable Code, for good or for awesome!Reusable Code, for good or for awesome!
Reusable Code, for good or for awesome!
 
Matthew Eernisse, NodeJs, .toster {webdev}
Matthew Eernisse, NodeJs, .toster {webdev}Matthew Eernisse, NodeJs, .toster {webdev}
Matthew Eernisse, NodeJs, .toster {webdev}
 
Wild wild web. html5 era
Wild wild web. html5 eraWild wild web. html5 era
Wild wild web. html5 era
 
Web matrix
Web matrixWeb matrix
Web matrix
 

Презентация Юрия Ветрова (Mail.ru Group)