Мобильная веб-разработка презентация

Содержание

Обо мне Luxoft, 10 ЦСР Разработка мобильных приложений в следующих сферах: логистика;  перевозка пациентов; поиск лекарств; крупный сотовый оператор. Блог: http://andrebrov.net Твиттер: @andrebrov Почта: ARebrov@luxoft.com

Слайд 1Мобильная веб-разработка
Ребров Андрей


Слайд 2Обо мне
Luxoft, 10 ЦСР

Разработка мобильных приложений в следующих сферах:
логистика; 
перевозка пациентов;
поиск лекарств;
крупный

сотовый оператор.

Блог: http://andrebrov.net
Твиттер: @andrebrov
Почта: ARebrov@luxoft.com




Слайд 3О семинаре
1. Почему стоит выбирать мобильный веб.

2. Как разрабатывать.


Слайд 4Решает ли мобильный веб все проблемы?



Слайд 5Решает ли мобильный веб все проблемы?
НЕТ!


Слайд 6Но на него стоит переходить уже сейчас?


Слайд 7ДА!
Но на него стоит переходить уже сейчас?


Слайд 8Когда телефоны были большими…

Сайты для них были:
унылые;
нефункциональные;
только WAP…

… или их вообще

не было.

Хотя кто-то ставил Opera Mini и радовался жизни =)


Слайд 9Время шло и теперь…
Различных мобильных устройств стало много..
… и даже слишком.


Слайд 10Так что имеем сейчас
Полноценный компьютер в кармане
Малый размер экрана
Полноценный интернет (Wi-Fi)
Ряд

ограничений (Flash, цена интернета)
Геолокация и прочие встроенные модули


Слайд 11Что изменилось еще
Новые возможности в создании сайтов
Постепенный уход от десктопных приложений
Выросла

скорость интернета





Слайд 12Осталось сделать выбор


Слайд 13Разрушим ряд мифов!



Слайд 14Нативные приложения имеют больший функционал


Слайд 15Нативные приложения имеют больший функционал Myth busted
Геолокация
Работа с файловой системой

Доступ к акселерометру и гироскопу
Работа с touch-событиями


Слайд 16Нативные приложения имеют большую производительность
Аппаратное ускорение

Мультипоточность



Слайд 17Нативные приложения имеют большую производительность Myth busted
http://stevesouders.com/mobileperf/



Слайд 18Нативные приложения проще разрабатывать


Слайд 19Нативные приложения проще разрабатывать Myth busted
HTML
CSS
JS


Слайд 20Нативные приложения проще сделать с использованием родных стилей


Слайд 21Нативные приложения проще сделать с использованием родных стилей Myth busted
Sencha Touch

jQTouch
jQuery Mobile



Слайд 22Нативные приложения проще найти (и купить)
Apple Store

Android market

...


Слайд 23Нативные приложения проще найти (и купить) Myth busted



Слайд 24Нативные приложения проще монетизировать
Единичная продажа



Слайд 25Нативные приложения проще монетизировать Myth busted
Pay-per-use

Advertise

SaaS




Слайд 26Рынок мобильных приложений



Слайд 27PC vs Mobile


Слайд 28Мобильный интернет все более популярен


Слайд 29Конец первой части



Слайд 30Время разработки



Слайд 31Итак...

Вы все еще не пишите под мобильные устройства?

Тогда мы идем к

вам!

Слайд 32Способы
HTML+JS+CSS
Использовать фреймворк


Слайд 33HTML+JS+CSS
Разные платформы
Разные экраны

Где то это уже было, да?
Но разбираться как это

работает нужно, поэтому читаем «Building iPhone Apps with HTML, CSS, and JavaScript» http://ofps.oreilly.com/titles/9780596805784/

Слайд 34Будь проще и люди к тебе потянуться
Преимущество фреймворков:
Решается проблема кроссплатформенности
Решается проблема

разных экранов
Готовые решения для native-like поведения

Слайд 35Многообразие выбора
jQTouch
jQueryMobile
Sencha Touch
XUI
…..


Слайд 36jQTouch
Первый серьезный мобильный фреймворк
Многое подарил jQuery Mobile и Sencha Touch
Созданы native

эффекты переходов между экранами
Первый блин немножко комом

http://www.jqtouch.com/


Слайд 37jQTouch
jQTouch

id="infoButton" href="#about">About

Text



Слайд 38jQuery Mobile
Построен на jQuery
Поддержка всех платформ
Удобная работа с событиями
Поддержка HTML5
Удобная работа

с темами

http://jquerymobile.com/


Слайд 39jQuery Mobile
Text Input:

type="text" name="name" id="name" value="" />


Слайд 40Sencha Touch
Быстрое создание сложного интерфейса
Простота в создание своих компонент
Удобная работа с

данными
Проблема с производительностью

http://www.sencha.com/products/touch/


Слайд 41Sencha Touch
var timeline = new Ext.Component({ title: 'Timeline',
    tls: 'timeline',  scroll: 'vertical',
    tpl: [  '', '', '

class="avatar">',
'',
'
',  '
', '

{from_user}

',  '

{text}

', '
', '
', ''     ]   });

Слайд 42XUI
Очень минималистичный
Отдельные сборки под платформы
Поддержка HTML

http://xuijs.com/


Слайд 43XUI
x$('#foo').html('sweet as honey'); x$('#foo').outer('free as a bird'); x$('#foo').top('top of the pops'); x$('#foo').bottom('bottom

of the barrel'); x$('#foo').before('
first in line
'); x$('#foo').after('better late than never');

Слайд 44Что еще?
Wink toolkit
iUI
Dojo Mobile
DHTMLX Touch

+ Спойлер


Слайд 45Делаем нативным
PhoneGap
MotherApp
Big5
Rhodes


Слайд 46Что почитать
Курс лекций и материалов по мобильной веб-разработке и дизайну
http://goo.gl/hLJv1
Comparing Mobile

Web Frameworks
http://goo.gl/L8Yh5
Сравнение фреймворков для создания native приложений
http://goo.gl/rNb4t




Слайд 47Вопросы?

Ребров Андрей
Luxoft Professional
ARebrov@luxoft.com
twitter.com/andrebrov
http://andrebrov.net


Скачать презентацию

Обратная связь

Если не удалось найти и скачать презентацию, Вы можете заказать его на нашем сайте. Мы постараемся найти нужный Вам материал и отправим по электронной почте. Не стесняйтесь обращаться к нам, если у вас возникли вопросы или пожелания:

Email: Нажмите что бы посмотреть 

Что такое ThePresentation.ru?

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


Для правообладателей

Яндекс.Метрика