Наша новая Smashing book № 3 и № 3 ⅓ была выпущена в прошлом месяце, и мы искренне благодарны за огромную обратную связь, отзывы и фотографии, которые получили от многочисленных читателей со всего мира. Мы ценим ваше время и ваши интересы, и благодарим вас за вашу поддержку и любовь.
Сегодня мы рады представить еще одну главу из книги. В этой главе, автор исследует то нужно знать при принятии решения о том, какие инструменты применить для вашего следующего мобильного оптимизированного проекта. Эта глава также есть в свободном доступе в PDF в EPUB и MobiPocket или ZIP со всеми файлами.
— команда Smashing
Это изображение обложки Smashing Book # 3, была разработана К. McLelland.
Как вы, наверное, знаете, веб-дизайн – это дисциплина, которая занимается всеми аспектами разработки интерактивных продуктов. Хотя она включает в себя важные элементы графического дизайна и видео-дизайна, в первую очередь она связана с дизайном взаимодействия. Ее ближайшим родственником в области дизайна считается дизайн продукта. Как дизайнеры, мы создаем виртуальные продукты. Кроме того, поскольку разработка аппаратного и программного обеспечения неразрывно связаны и неразделимы друг от друга, продукт дизайна и дизайн взаимодействия также неразрывно связаны друг с другом.
Веб — дизайн мобильных приложений
По сути, веб — дизайнер, обладающий специальными знаниями в среде World Wide Web. Основными инструментами веб — дизайнера являются такие языки, как HTML, CSS, JavaScript и вспомогательные, например, LESS, Stylus, HAML, Jade, jQuery, MooTools и многие другие.
Проектирование мобильных приложений, включает в себя большую работу, которая многим может показаться просто рисованием красивой картинки, и это правда. По своей сути это похоже на проектирование автомобиля, в котором также большую роль играет рисунок красивого автомобиля. Как и дизайнер, занимающийся созданием новой модели автомобиля, должен знать о материалах, из которого этот автомобиль будет создаваться, так и веб – дизайнер, рисующий дизайн нового приложения, должен учитывать многие факторы, влияющие на создание приложения.
Мы заинтересованы не просто в эстетике интерактивного объекта, но и в том, как он себя ведет. Это особенно важно, когда вы работаете над проектом мобильного приложения (который основан на поведение объектов), в отличие от проектирования документов (которые основаны на содержание объектов).
Проектирование документов и проектирование приложений
Разработка интерактивных документов и, особенно с применением отзывчивого веб — дизайна требует специальных знаний. Как минимум, речь идет о понимании принципов отзывчивого дизайна и его развития. Потому что просто рисование красивых картинок – это искусство, а не дизайн.
Интерактивные продукты или приложения — это совершенно другая деятельность. Проектирование для интерактивной среды требует навыков в области графического дизайна, видео-дизайна и, самое главное, интерактивного дизайна. Наиболее важным аспектом интерактивного продукта является его взаимодействие с пользователем. Эти взаимодействия строятся в коде.
К сожалению, в связи с увеличением специализации в командах, роли дизайнера и веб — разработчиков были искусственно разделены. Хотя такое разделение может быть необходимо при работе в команде, и эти метки должны определить текущие задачи членов команды, а не делить на песочницы, где каждый занимается своими делами. Создавая новое приложение важно понимать, что мы создаем продукцию для удовлетворения потребностей пользователей, и что каждый член команды разработчиков оказывает влияние на пользовательский опыт. Именно поэтому работа в малых междисциплинарных групп важна, потому что при таких видах разделения работы каждый участник несет ответственность за свою часть работы, и думает о пользователе.
Проектирование, ориентированное на пользователя
При создании продукта, сначала идет дизайн, а, уже ориентируясь на него, ведется разработка, которая в свою очередь оказывает влияние на дизайн. Это циклический, повторяющийся процесс, в котором целью является постоянное улучшение продукта до полного удовлетворения потребностей пользователей. [1]
Каждое решение, которое вы принимаете для вашего продукта должно вытекать из соображений о приоритетах и комфорте пользователей. Вы всегда должны думать о потребностях пользователей, и только потом уже думать о собственных. То есть думайте о потребностях пользователей и их контексте, создавайте то, что пользователь будет видеть и с чем взаимодействовать, а затем уже думайте о том, как решать проблемы, которые появляются у вас, в связи с разработкой вашего продукта.
Ваш первый вопрос в новом проекте будет: какие серверные технологии вы используйте, или как выглядит схема базы данных? Стоп! Это неправильный подход. Вы пытаетесь решить свои собственные проблемы, а не пользователя. И это плохо.
Цель этой главы
Два основных решения, которые вы должны будете сделать в процессе проектирования приложения, заключаются в том, чтобы сделать продукт кросс — платформенный и в том, чтобы сделать его родным.
Целью этой главы является дать вам информацию как веб — дизайнеру, максимально полно ответить на некоторые актуальные для всех нас – разработчиков и дизайнеров мобильных приложений вопросы.
Рисунок 9.1. Да, перед нами огромное количество устройств. Нет, ваше приложение не поддерживает все устройства, представленные тут. Ориентироваться на пользователей означает определение вашей целевой аудитории и оптимизации приложения для платформ и устройств, которыми эта аудитория пользуется. Поддержка большого числа платформ с помощью прогрессивного улучшения, процесс всегда намного более легкий, если вы в первую очередь создадите обычный сайт, в противопоставление приложению, как более гибкому продукту. (Фото: David Jones, smashed.by/davidjones)
Что такое простое приложение?
Вы заметили, как люди часто употребляют термин “простое”, упоминаю приложения или программы, часто при этом не понимая, о чем они говорят? Давайте начнем с определения этого понятия.
Простые и сторонние приложения
Если уж быть совсем педантами, то «простой», говоря о цифровых устройствах, относится к отсутствию или наличию электрического тока в транзисторах, которые питают наши устройства. А мы обычно представляем себе какое-то очередное клише: двоичный код, серию нулей и единиц.
И хотя когда-то первые компьютеры программировали с помощью переключателей, сейчас мы не сможем написать приложение, пользуясь похожими средствами. В настоящие время мы пользуемся такими языками как C, Python, Java-Script, и т.д., которые, в конечном счете, были переведены в машинный язык. А он в свою очередь на наличие или отсутствие электрического тока в транзисторах.
Каждая из этих технологий создана на уровнях абстракции. Python написанна в C. Цель каждого уровня абстракции, каждого нового слоя в этом торте технологий, сделать всю систему проще для разработчиков — авторов приложений.
Таким образом, зная технически правильное определение слова «простой» мы понимаем, что использовать его в современном мире нет никакого смысла.
Теперь, когда мы знаем, чем «простой» не является, давайте все же попробуем понять, в каком значение этот термин употребляется сейчас.
Рисунок 9.2. Веб-технологии могут быть простыми технологиями для определенных операционных систем. Здесь у нас есть ноутбук Samsung под управлением Chrome OS с HTML, CSS и JavaScript.
Простые приложения, как культура
«Простой» относится к технологиям — т.е. языки и структуры, — которые формируют культуру, язык, конвенции и нормы платформы. Это базовый уровень абстракции, который включает в себя основные символы, жесты и взаимодействия, которые пользователи используют для взаимодействия с приложениями на данной платформе. Эти элементы имеют огромное значение, потому что они представляют культуру и нормы платформы. Они, по сути, являются визуальными поведенческим языком, при помощи которого пользователь общается с приложениями и программами. И они же представляют собой язык, при помощи которого программа или приложение общается с пользователями. И чем более удобным является этот язык, тем больше преимуществ для создания программ и приложений на этой платформе.
Например, IOS от Apple, с ее подробным путеводителем под названием «Основные принципы учета пользовательского интерфейса». Простое приложение для этой системы полностью соответствует нормам по своей структуре, производительности и функциональности. Также оно будет казаться пользователю знакомым и понятным, даже если он впервые им пользуется.
Рисунок 9.3. Руководство от компании Apple «Основные принципы учета пользовательского интерфейса» предоставляет четкие инструкции о том, как родные приложения на платформе IOS должны выглядеть и вести себя. Также в руководстве указываются основные принципы, формирующие культуры данной платформы.
У нас есть и другие платформы, не менее популярные, чем IOS от Apple, например Android. И эта платформа очень популярная среди производителей мобильных приложений. В настоящее время мобильных устройств, работающих на этой платформе такое множество, что чаще между ними нет ничего общего, кроме платформы. Это создает определенные трудности для производителей мобильных приложений в адаптации своего продукта под многочисленные мобильные устройства, работающие на одной и той же платформе, но имеющие совершенно разные характеристики, и физические в том числе.
Рисунок 9.4. Swype клавиатура – еще одна удивительная новинка. Просто проводите пальцем от буквы к букве, и она автоматически определяет слово, которое вы хотите написать. К сожалению, эта клавиатура присутствует не на всех мобильных устройствах, работающих на Android, а только на некоторые из них. Другие устройства, работающие на этой же платформе, имеют клавиатуру, больше похожую на клавиатуру iPhone, или существуют устройства на этой же платформе, к которым пользователи могут использовать различные виды клавиатур. И если с одной стороны, такое многообразие можно считать только плюсом, с другой стороны, понятно, что единого пользовательского опыта Android не существует. И этот факт создает основное препятствие в создании программного обеспечения для этой платформы.
Например, мое iPhone приложение, под названием, Feathers, имеет собственную клавиатуру, которую я сделал для того, чтобы пользователи могли использовать расширенные Unicode символы. На iPhone, он работает так же, как встроенная iPhone клавиатура. Для достижения этого эффекта потребовалось некоторое усилие, но это не было невозможно. Если бы я разрабатывал приложение на Android, я должен был бы знать, какую из многих клавиатур пользователь установил на свое мобильное устройство, а затем настроить приложение так, чтобы оно соответствовало мобильному устройству пользователя. Само собой разумеется, это потребует гораздо больше усилий и это почти невозможно. Клавиатура Swype которая приходит для некоторых устройств, работающих на Android, например, запатентована. И получается, что на устройстве Android с клавиатурой Swype, я не могу использовать мою клавиатуру.
Рисунок 9.5. Перенос моего приложения на устройства, работающие на Android, потребует изготовления различных версий под каждую пользовательскую модель, чтобы поддерживать различные виды клавиатур.
Компромиссом было бы сделать одну пользовательскую клавиатуру и использовать ее независимо от системной клавиатуры пользователей. Конечно, это будем в чем – то походить на то, что получилось у меня с приложением, разработанным для IOS. Но я сомневаюсь, что пользователям понравится идея переходить на другую не привычную клавиатуру.
Именно поэтому для таких платформ как Android, которые не имеют четкой культуры, требований и прочих важных составляющих, и общепринятых значений, создание приложений и программ является более сложной задачей. Другой непопулярной среди разработчиков мобильных приложений является платформа Windows.
Отличный пример сторонних приложений, предоставляющих лучший пользовательский опыт на некоторых родных платформах является Gmail. Использование настольного почтового клиента в операционной системе Windows, способствует тому, что многие пользователи находят и скачивают на свое мобильное устройство почтовое приложение, постоянно обновляют его, синхронизуют работу почты с другими своими устройствами, устанавливают проверку пришедшей почты антивирусами. Сравните это с простотой Gmail, сервисом, который вы можете легко найти в сети, и завести себе почтовый ящик меньше чем за пять минут.
Рисунок 9.6. Веб — приложение Gmail обеспечивает согласованную работу на всех платформах. Пользователям не нужно ничего устанавливать или беспокоиться о синхронизации своей электронной почты на нескольких устройства.
Gmail также является отличным примером того, как создать хороший кросс — платформенный пользовательский опыт. И хотя это приложение адаптировано под большое количество существующих сейчас платформ, изначально оно было разработано под конкретные платформы.
Вместо этого мы сосредоточимся на создании хорошего кода и методах разработки, таких как прогрессивное расширение. Различные браузеры осуществляют контроль над приложениями по-разному. Поэтому одно и то же приложение может по-разному вести себя в различных браузерах. Даже если они имеют идентичный код, компоненты, разметку и прочие характеристики.
Рисунок 9.7. Браузер — это приложение, которое работает в контексте данной операционной системы. Другими словами, браузер — это родная программа для данной конкретной операционной системы. Веб – приложение представляет собой приложение, которое работает в контексте браузера. Это не простое приложение, поскольку он имеет одну степень разделения (а именно браузер) между самим приложением и операционной системой. Флеш – приложения также не являются родными для браузера, поскольку между ними одна степень разделения. Флэш — приложения, следовательно, не являются родными для браузера, так же, как веб — приложения не являются родными для операционной системы. (Изображение: R. Voegtli, smashed.by/voegtli)
Гибридные приложения
Итак, у нас есть простое приложения, которые относятся к культуре платформе, на которой они работают. И у нас есть веб — приложения, которые запускаются в браузере мобильного устройства через сеть. Но мы пропустили третью категорию, в которую попадают многие современные приложения: гибридные приложения.
Нам нужно понять сильные стороны различных технологий и использовать их в случае необходимости. Такие инструменты как HTML и CSS прекрасно подходят для создания сложных программ и приложений. Таким образом, многие дизайнеры простых приложений используется HTML и CSS, когда им нужно красиво представить пользователю контент. Типы приложений, которые называется гибридными, используют сочетание простых и веб – технологий.
Рисунок 9.8. Приложение Facebook на iPhone представляет собой гибридное приложение.
Приложение Facebook на iPhone является одним из примеров гибридных приложений, в которых некоторые разделы (например, лента новостей) отображаются с помощью веб – технологий.
Точно также и веб – приложения могут быть гибридными. Сайт, созданный в HTML, CSS и JavaScript и использующий флэш, чтобы продемонстрировать многофункциональность интерактивного контента является примером гибридного веб – приложения.
Многие современные приложения являются гибридными, и если вы пишите сайт в HTML, CSS и JavaScript, можно с уверенностью сказать, что вы никогда не будете иметь проблемы с переходом на другие платформы. Гибридные виды приложений в последние годы становятся все более и более популярными.
Преодоление идеологического смещения
Все чаще и чаще выбор технологии, материала или дизайна ориентирован не на желание выбрать лучшее, а на идеологию. Многие разработчики слепо следуют веб – стандартам, которые не всегда соответствуют реальности. Например, использование флеш технологии. Важно в данном случае выявить такие предубеждения на начальном этапе.
Конечно, по своей сути, сторонники строгих веб – стандартов и технологий веб – разработки стремятся к лучшему. И никто не будет спорить, что развитие интернета привело к широкой демократизации взглядов в сфере высоких технологий. Но авторские технологии никто не отменял.
Например, если говорить об общих стандартах для веб – платформ, то приложение только выигрывает, придерживаясь общих стандартов какой – либо веб – платформы, потому что с ее помощью оно (приложение) попадает к пользователю. А вот возьмите Facebook. Facebook, по своей сути, является веб — приложением. Но оно не открыто. Оно бесплатно, но это означает, что вы, пользователь, а не клиент Facebook. Вы скорее продукт Facebook.
Facebook по факту продает ваши личные данные и поведенческие черты своим рекламодателям, которые как раз и являются клиентами этой социальной сети.
Говоря об этом, нельзя не упомянуть бесплатные и платные приложения и программы. В Facebook бесплатное использование для пользователей, как мы выяснили, продуктов социальной сети, а платное для клиентов (рекламодателей). В данном случае можно сказать, что приобретение платных приложений iPhone является более честным. Вы платите за лицензию, и тем самым владеете правом на ее использование. И вы становитесь клиентом компании – производителя. И способы, с помощью которых компания зарабатывает, оказываются прозрачными. И согласитесь, что по сравнению с политикой Facebook, это более честный и традиционный способ.
Конечно, даже коммерческие приложения могут использовать ваши данные окольными путями, поэтому в наше время нужно быть внимательным относительно вашей личной информации
Вытеснят ли родные приложения сторонние?
Как заявил Jeremy Keith на одной из конференции «Создавать простое приложение – это все равно, что записывать информацию на диск». Суть его слов можно интерпретировать следующим образом, родные приложения устаревают также как когда – то устарели лазерные диски. А сторонние веб – приложения возьмут верх.
Я очень надеюсь, что это не правда. Потому что в последнее время наблюдается следующая тенденция, с появлением таких ОС как WebOS и Chromium, интернет сам по себе становится платформой. И постоянное улучшение пользовательского опыта, новые возможности и функционал будет добавляться к родным приложениям в первую очередь. И это не похоже на то как компания Apple, будет решать в 1 сентября 2012, будет ли IOS завершена, и прекращать ли создание новых версий ОС или выпуск новых моделей iPhone и iPad. И в случае положительного решения, еще несколько лет весь Интернет будет догонять компанию Apple.
Мы знаем, что «простой» относится к культуре и языку платформы и говорить о том, что простые приложения скоро устареют, это все равно что говорить о том, что в будущем устройства не будут иметь различные платформы, а платформы в свою очередь, не будут иметь свои требования и условия.
Этой точке зрения присуще мнение, что в будущем будут возникать монокультуры. И в таких условиях каждое устройство будет работать через сеть, и пользователь будет использовать собственные разработки. И все устройства будут подключены к общей веб – платформе. Такое будущие представляется нам серым, потому что в нем личные данные еще более беззащитны, и устройства — это всего лишь немые терминалы, подключенные к одному большому облаку информации, которое будет контролироваться большими корпорациями.
И корпорация, владеющая лицензией на текстовый редактор, будет пытаться найти скрытый смысл в ваших документах, чтобы правильно использовать его себе на благо.
Это не означает, что веб – приложения являются воплощением абсолютного зла, но и сторонниками Света их тоже не назовешь.
Размытые границы
Все чаще стали появляться разговоры о том, что сторонние веб – приложения все чаще используют полный функционал мобильного устройства, например, сенсорный экран, аппаратное ускорение графики, GPS, поддержка акселерометра и камеры, и что таким образом они догонят простые приложения. Однако редко упоминается о том, что и простые приложения догоняют веб – приложения.
Существует три основные области, в которых простые приложения догоняют веб – приложения, это простота развертывания и доступа, автоматическое обновление и беспрепятственный доступ к данным.
Простота развертывания и доступа
Одним из основных преимуществ, которым исторически владеют веб – приложения, это быстрота развертывания и доступа. Нажмите на кнопку «запустить», и если ваш телефон подключен к сети, где бы вы ни находились приложение запуститься. Все очень просто.
Нет необходимости скачивать файл, потом распаковывать его, точнее сначала найти ту папку на вашем устройстве, куда вы скачали архив, а потом только распаковать его. Потом вам нужно установить его, потом запустить, и только потом узнать, что ваша видеокарта его не поддерживает. Стоит ли удивляться, что веб — приложения, такие как Gmail и Google Docs пользуются таким феноменальным успехом, особенно на платформах с плохим юзабилити.
Рисунок 9.9. Граница между веб – приложениями и родными приложениями становится все более и более размытой. Все больше ОС становится на основе веб — технологий, а веб — приложения являются родными для OС.
И, тем не менее, последние тенденции таковы, что родные приложения догоняют по простоте использования и доступа веб – приложения, и все благодаря интернет – магазинам. Стоит ли повторять всем известный факт о том, что с появлением App Store, компании Apple, процесс поиска приложения для устройств от этой компании стал значительно более легким. Все что вам нужно, это зайти в App Store, найти приложение, и скачать его.
Автоматическое обновление
Веб – приложения по своей природе всегда предоставляют функцию автоматического обновления.
Вы всегда используете последнюю версию Gmail, и вас не волнует, какой у нее номер, и когда были последние обновления.
Это не Gmail 7; это просто Gmail. [10]
Простые приложения, напротив, имеют неуклюжие механизмы обновления, которые только снижают желание ими пользоваться. Однако уже наметилась тенденция к тому, что и простые приложения автоматически обновляются, сообщая об этом пользователю уже постфактум. Например, когда в последний раз вы замечали, обновления от Google Chrome? Никогда. Он делает это тихо и самостоятельно.
Прямой доступ к данным
Другое огромное преимущество, которым пользователи веб — приложений традиционно пользуются, является возможность получить доступ к своим данным с любого устройства. Вам никогда не придется беспокоиться о синхронизации электронной почты со стационарного компьютера и мобильного телефона при использовании Gmail. Она всегда есть. Сравните это с кошмаром, который традиционно появляется при попытке синхронизации простые приложений.
И опять же простые приложения и по этому пункту догоняют веб – приложения. С появлением iCloud от компании Apple, ручная синхронизация становится делом прошлого. Данные просто и автоматически становятся доступными на любых устройствах компании Apple, и синхронизация сохраняется постоянно так, что вам больше не надо об этом беспокоиться. iCloud ориентирован на продукты компании Apple, но существуют и другие кросс — платформенные технологи, такие как Dropbox, которые облегчают синхронизацию для пользователей других платформ.
Просто другой клиент
Вы полностью прочитали предыдущий раздел? Хорошо. Тогда вы, возможно, заметили одну общую тенденции во всех трех областях, в которых простые приложения догоняют сторонние. Все три области связаны с Интернетом, а не со сторонними приложениями. Сторонние веб — приложения – это всего лишь стек технологий, HTTP и URL-адреса — находятся на поверхности Интернет стека. Таким образом, простые приложения догоняют сторонние приложения, воспользовавшись преимуществами характеристик Интернета, что и сторонние приложения.
Кроме того, мы наблюдаем возникновение нового типа пользовательского опыта, под названием непрерывный клиент. Непрерывный стаж клиента — как первоначально назвал этот феномен Джошуа Topolsky [11] — позволяет пользователю легко продолжить опыт на различных устройствах и в различных контекстах.
Например, если вы читаете ваш Twitter на компьютер, а затем отойдете от него, вмести со своим телефоном, вы захотите читать своих друзей в Twitter с того места, с которого закончили на компьютере. А когда вы вернетесь домой, вы должны быть в состоянии продолжить читать Twitter с того же места с другого мобильного устройства.
Хорошим примером непрерывной клиента является приложение мгновенного обмена сообщениями Trillian. Оно может хранить чаты в облаке, чаты постоянно обновляются между всеми устройствами в режиме реального времени, что позволяет отслеживать и синхронизировать прочитанные и непрочитанные сообщения, и даже использовать «технологии присутствия», чтобы знать, на каком устройстве вы в настоящее время активны.
Рисунок 9.10. Келли Соммерс предлагает хороший пример приложения, которое демонстрирует непрерывный опыт клиента. Пользователи могут начать смотреть видео на Windows Phone 7, продолжить в веб — клиенте, а затем на своем iPhone.
Как вы видите в эпоху непрерывного опыта, веб — приложения становятся JAC (просто еще один клиент). Это может быть лучший клиент для использования в определенных контекстах, но пользователи имеют возможность выбора перехода на простой клиент, не заботясь о синхронизации данных. Вскоре, непрерывные клиенты будут самыми ожидаемыми новинками, особенно технологии такого высокого уровня как, например, iCloud.
Рисунок 9.11. Хороший пример непрерывной клиента является приложение мгновенного обмена сообщениями Trillian. (Изображение: Trillian блоге, Smashed.by/trillian).
Будущее за родными приложениями
Сегодня веб – приложения - это просто еще один вариант родной платформы, им приходится конкурировать за свои собственные уникальные достоинства, а не за преимущества, полученные из интернета.
При принятии решения об использовании платформы Web или любой другой платформы для очередного приложения. сложно ответить на следующие вопросы. Является ли преимуществом тот факт, что пользовательский интерфейс вашего приложения выглядит, как про …
Если вы хотите прочитать полностью статью, посетите сайт наших спонсоров