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

Question

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

• Вы сначала делаете прототип пользовательского интерфейса?
• Используете ли вы истории пользователей?
• Какую гибкую методологию или передовую практику вы бы порекомендовали или активно пропагандировали?

Суммируя: Какие навыки позволяют вам перейти от сбора требований к AmazingWebApp™?

Окончательно:Какие-нибудь книги вы бы порекомендовали?

Answer 1

Хорошее чувство дизайна.Программисту это сложно понять.Иногда программист хорошо понимает, что работает, но не знает, как создать то, что действительно работает лучше всего или хорошо.В основном это требует способности брать все и быть готовым бесплатно перемещать это до тех пор, пока что-то не начнет работать.

Я делаю это так, чтобы выяснить, как, если кто-то сделает это, какая будет наиболее логичная и распространенная идея о том, как задача будет выполняться онлайн или оффлайн, а затем посмотреть, как это воспроизвести.Думайте коротко, кратко, ясно, доступно и логично.Если вы можете передать его кому-то без каких-либо указаний, и он сможет сделать все, что вы от него хотите, и даже больше, это работает.Если им нужны указания, как выполнять повседневные действия в вашем приложении, это плохой дизайн.

Я бы также посоветовал взглянуть на другие приложения, которые нравятся вам на уровне, который вы, возможно, даже не осознаете, но по какой-то причине просто работают, и попытайтесь повторить это.

Answer 2

Я думаю, лучшее, что вы можете сделать, это просто использовать программное обеспечение.

Когда я работаю над приложениями, я обычно отправляю их домой по электронной почте в конце недели (иногда раньше), выхожу из «рабочего режима» и устанавливаю их как обычно (т. е.не запускаться из вашей IDE), а затем использовать его..

Трудно выйти из «тестового режима» и фактически «забыть», что вы знаете приложение.Но как только вы вникнете в это, это может быть ДЕЙСТВИТЕЛЬНО полезно и очень поучительно (и да, иногда душераздирающе, когда понимаешь, что «крутая маленькая функция» на самом деле отстой и ее нужно реализовать заново!).

Мой босс говорит, что я «анально» отношусь к удобству использования.Мне нравится, что :)

Answer 3

Я думаю, что какой-то тип визуального прототипирования (даже если он выполнен с помощью HTML и CSS) лучше всего.У меня возникает искушение начать программировать, а потом беспокоиться об интерфейсе, и обычно это приводит к чему-то очень плохому (по крайней мере, для меня).Я разрабатываю это ©ЗАМЕЧАТЕЛЬНАЯ ФУНКЦИОНАЛЬНОСТЬ и в конечном итоге я тороплю интерфейс, чтобы быстро получить инструменты для работы с моим кодом.

Я забыл, где я это услышал, но для конечного пользователя ваш интерфейс — это ваше приложение.Если вы пытаетесь угодить пользователю, вам следует начать с интерфейса и позволить ему определять функциональные возможности, которые вы предоставляете.

Answer 4

Лучшая практика зависит от талантов членов команды.

Во-первых, всегда пишите пользовательские истории (если возможно, делайте это командным мероприятием), загружайте их на LighthouseApp.com или в свою любимую систему продажи билетов — только первые 10–20 — это все, что вам нужно, чтобы начать работу.

Если у вас есть UI-дизайнер, вам может пригодиться прототип страниц.Но если разработчик программного обеспечения обладает приличными навыками работы с HTML/CSS, я предпочитаю как можно быстрее получить работающий прототип с чистым UI/HTML/CSS.Этот результат можно передать «современному веб-дизайнеру», который сможет переработать/украсить HTML/CSS.Дизайнер должен работать с той же кодовой базой, что и разработчик, через систему контроля версий.

Некоторые «дизайнеры старшей школы» обиделись бы на предложение «украсить сайт» и стали бы настаивать на том, чтобы передать программисту файл фотошопа.Это может быть нормально для простого маркетингового веб-сайта, но мне не нравится процесс создания AmazingWebApp™.

Answer 5

Ребята здесь дают отличные советы.

существует различие между «визуально красивым» и «функциональным» (или простотой использования).на самом деле вы можете иметь одно без другого.этот форум является хорошим примером, он очень удобен в использовании, но, честно говоря, уродлив - извините, но я все еще люблю вас :)

реальность такова, что тебе нужно навык делать хорошие интерфейсы.это приходит с годами практики.Обычно со мной заключают контракт на разработку всего пользовательского интерфейса для нового приложения.я редко вижу программистов или графических дизайнеров с такими навыками (это узкий рынок).В университете я обнаружил, что у меня естественная хватка в области HCI, дизайна пользовательского интерфейса и анализа юзабилити.я развил эти навыки, много читая и приобретая опыт много занимаюсь дизайном пользовательского интерфейса. Итак, все, что я говорю, это то, что будьте готовы к тяжелой работе, если вы серьезно настроены стать хорошим дизайнером пользовательского интерфейса.вы можете делать все, что захотите, но если вы тратите время на изучение дизайна пользовательского интерфейса, это означает, что вы не тратите время на изучение agile с Ruby on Rails или какой-либо другой самой модной технологии.

несколько общих советов:

• Если вы создаете веб-приложения (в отличие от веб-сайтов для малого бизнеса), то низкокачественное прототипирование отлично подойдет.Соберите группу людей, стопку мясной бумаги и цветные маркеры, и вы будете поражены тем, сколько экранов вы сможете нарисовать за несколько дней.

• ваше программное обеспечение должно быть самоочевидным.вашему программному обеспечению не требуется руководство пользователя.У CMS, которую я разработал, нет руководства пользователя, ее используют несколько десятков клиентов, и никто из них никогда не просил у меня руководства.

• посмотрите, что делают «большие мальчики».если на ebay есть такое окно поиска:'[......] (Поиск)', тогда сделайте и свой так же (а не нестандартный, но ок:'Поиск:[......] (Идти)'.).это известно как доступность.вы используете знакомство людей с другими системами, чтобы дать им толчок к тому, как работает ваша собственная система.

я бы порекомендовал эту книгу:

• Не заставляйте меня думать об юзабилити

у меня также есть несколько статей в блоге, которые должны помочь:

• вайрфреймы и макеты
• анализ потребностей для бизнес-сайтов

Answer 6

Некоторые из вещей, которые мы делаем:

1. Множество прототипов, исследование различных концепций как на бумаге, так и в фотошопе, а иногда и в реальных реализациях.
2. Обрезайте вещи, будьте итеративными.Не пытайтесь сделать все приложение и довести его до совершенства с первого раза (потому что в глубине души вы знаете, что этого не произойдет).
3. Ясность важнее сообразительности, это одна из моих последних вещей, о которых я задаю вопрос, когда работаю с пользовательским интерфейсом. Конечно, значки и вращающиеся штуки могут выглядеть великолепно, но являются ли они ясными и краткими?
4. Сосредоточьтесь на целях пользователя. Это довольно распространенная тенденция среди разработчиков сосредотачиваться на одном экране за раз, одной задаче за раз.Помните, что кто-то, использующий ваше приложение, думает не так, у него есть цель, поэтому постарайтесь погрузиться в нее как можно глубже.
5. Используйте программное обеспечение, которое вы создаете, настолько, насколько это возможно. Нет лучшего способа увидеть его недостатки, недостатки и проблемы, чем испытать их на себе.

Answer 7

@Брайан Уоршоу - я думаю, это было из выступления Азы Раскина, это видео, я думаю

Answer 8

Разработка полностью инновационного пользовательского интерфейса является довольно сложной задачей для большинства программистов (только для меня?).Что я считаю полезным при создании/проектировании пользовательского интерфейса для веб-приложений, так это всегда обращать внимание на красивые, простые в использовании и элегантные пользовательские интерфейсы, которые вы найдете при просмотре Интернета или использовании любых других настольных приложений.Если вы просто найдете наиболее эффективный пользовательский интерфейс (разработанный кем-то другим, в другом месте) для поставленной задачи, то вы сможете хорошо реализовать и создать лучший пользовательский опыт для вашего приложения.Например, когда я печатаю этот ответ, мне нравится, как он показывает предварительный просмотр ответа в реальном времени с возможностью «скрыть предварительный просмотр» — я определенно хотел бы использовать аналогичный тип взаимодействия при создании интерфейса пользовательского форума. .

Answer 9

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

Кроме того, вот несколько принципов высокого уровня, которым я следую, чтобы создать правильный продукт, доставляющий приятные впечатления:

Знайте разницу между пользователем и клиентом.Владельцы бизнеса, одобряющие блестящий проект, обычно являются клиентами.Однако разрушительной ошибкой является тенденция путать их с пользователем.Клиент обычно — это человек, который осознает потребность в вашем продукте, а пользователь — это человек, который фактически будет использовать решение (и, скорее всего, позже пожалуется на требования, которым ваш продукт не соответствует).Перейти к более чем одному человеку

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

Избегайте специальных предложенийКогда пользователь просит что-то очень конкретное, будьте осторожны.Всегда подвергайте сомнению предубеждения и смотрите, действительно ли это сделает ваш продукт лучше.

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