Как подходить к разработке настольных приложений с учетом веб-и мобильных приложений?

Question

Мне было поручено создать настольное приложение с «сексуальным» ** внешним видом.Я намерен использовать WPF для достижения этой цели.Одно из требований заключается в том, что приложение для настольного компьютера позже расширится до веб-приложения ASP.NET MVC, а затем - мобильного приложения (возможно, сначала для Android), и все это при сохранении того же внешнего вида и ощущения.

** в этом контексте «сексуальный» означает скользящие меню и, как правило, современный внешний вид

С учетом этого, каков наилучший подход при создании дизайна пользовательского интерфейса рабочего столаесли я хочу повторно использовать стиль компонентов (и / или)?

Например, при создании настольного приложения я бы использовал XAML для пользовательского интерфейса, но, учитывая, что будет веб-версия приложения, которая должна выглядетьтак же, как на рабочем столе, я должен / мог бы использовать вместо этого HTML / CSS?Смешно ли даже так думать?

Answer 1

Вы получите 1000 ответов на этот вопрос, но да, я думаю, что это довольно невероятно. Я попытаюсь объяснить почему (учитывая только пользовательский интерфейс).

Почему

Суть для меня не в том, что вы можете использовать повторно, а в том, что вы должны повторно использовать.

Настольное приложение, веб-приложение и мобильное приложение различаются. Разные цели, разный пользовательский интерфейс, разные стандарты . То, как вы используете, например, ваш любимый текстовый процессор, подходит для настольного приложения (меню, ленты, контекстного меню и всего остального), но не подходит для веб-приложения. В веб-приложении вы перемещаетесь , вероятно, у вас не так много диалогов, пользователь может перемещаться назад и вперед между страницами. Теперь представьте себе такое же приложение для мобильных устройств! Он должен быть спроектирован для использования с пальцем, кнопки должны быть большими, и в нем вообще не должно быть диалогов (и я слишком упрощаю тему).

Приложение не должно быть похожим для этих платформ, у каждой есть свои особенности и рекомендации . Если вы не будете следовать им, ваш пользователь не будет чувствовать себя комфортно с вашим приложением, даже если его пользовательский интерфейс действительно сексуальный. Если вы хотите написать хорошее приложение для веб-сайтов, то убедитесь, что оно будет отличаться (иногда, но зависит от типа приложения, совершенно иначе) от настольной версии, а мобильная версия будет ровной более разные (даже независимо от языков и среды разработки).
Вы представляете настольную версию сайта StackOverflow? Как вы думаете, он должен выглядеть и вести себя одинаково? Я думаю, что ваш ответ будет «нет», даже если мы все ценим, как SO работает для сети.

Взгляните на это:

• Руководство по интерфейсу пользователя Android
• Рекомендации по работе с Windows

Даже если не существует стандартного руководства для Интернета, взгляните на эту статью (и представьте, что вы можете использовать эти советы для настольного приложения):

• http://uxdesign.smashingmagazine.com/2009/09/24/10-useful-usability-findings-and-guidelines/

Сколько контактов вы можете увидеть? Более того, для ограниченного набора приложений вы можете немного сходить UI для Интернета и UI для настольных компьютеров (мобильные приложения всегда слишком разные в использовании), но это зависит от типа пользователей, которые у вас есть и их фон и опыт.

Что

Если вы пишете свое приложение с WPF, вы можете повторно использовать часть кода для создания приложения Silverlight для Интернета. Я уверен, что вы не будете повторно использовать все, потому что для реального приложения их различия слишком велики.

Для Android (даже подумав написать для Mono) вы не можете использовать их вообще (хорошо, это будет ссылка, но вам придется переписать). Конечно, если вы будете использовать Windows Phone, ваш XAML будет частично использован, и даже ваш код.

Идея использовать HTML / CSS неплоха, вы можете написать настольное приложение на HTML5 / CSS3 / JavaScript, оно будет работать везде (на ПК с Windows 8, в Интернете и на мобильных устройствах). Хорошо, по крайней мере, с небольшими изменениями.

Не забывайте, что веб-приложение можно использовать с мобильного устройства. Возможно, вам придется усовершенствовать приложение с помощью соответствующего CSS (и, возможно, использовать мобильную версию вашего любимого JavaScript-фреймворка), но это не такая уж большая работа.

Answer 2

По моему мнению, понятие «пиши один раз - везде» - недостижимая утопия. Как в общих чертах, так и более конкретно, если вы хотите, чтобы пользователи получали наилучшие впечатления.

С одной стороны, вы наверняка можете пойти по маршруту HTML / CSS, используя встроенный веб-браузер для всех настольных платформ, будь то Windows или Mac. С опытным дизайнером и хорошими навыками UX-программирования вы, вероятно, сможете добиться отличных результатов. Некоторые его части, вероятно, также могут быть повторно использованы в качестве мобильной версии в виде PhoneGap / jQuery Mobile / Kendo UI Mobile для всех основных мобильные ОС, iOS, Android и Windows Phone. Потенциальным недостатком является то, что приложение не будет выглядеть как нативное приложение ни на одной из платформ. Xamarin Mono Touch или Mono для Android также может быть чем-то, что смотрит на .

С другой стороны, вы можете поместить или логику своего приложения в веб-решение ASP.NET Web API , авторизоваться (при необходимости) через Azure ACS или OAuth . Разрабатывайте нативные приложения в WPF для настольных компьютеров, Java для Android, и вы даже можете повторно использовать некоторые из этих XAML для Windows Phone.

Лично, последнее решение на мой вкус лучше для пуриста, но, как вы упомянули, если брендинг и внешний вид очень важны (с учетом нативного внешнего вида), первый вариант, вероятно, лучше подходит для ваших нужд.

Как обычно, "это зависит", поскольку ответ все еще остается сильным.

Answer 3

JavaScript работает для всех вышеперечисленных проблем. С помощью JavaScript создайте настольное приложение (Electron), мобильное приложение (реагирующее), а также веб-технологию React - лучшую технологию