Лучший дизайн пользовательского интерфейса для легкого бронирования

Question

Я использую Twitter Bootstrap UI для разработки экранов для моего приложения.

Я создал страницу бронирования/назначения.

Эта страница будет использоваться в больницах штатов. Они хотят быстро заполнить данные, потому что они собирают все данные от пользователя по телефону, между тем они заполняются одновременно.

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

У меня нет идеи по дизайну. Пользователь также может захотеть проверить доступную дату & времени для выбранного врача на той же странице в будущем.

Answer 1

я могу увидеть некоторые улучшения, которые помогут:

1. Группа некоторые соответствующие элементы вместе, чтобы быть более дружественным к глазу.
2. Для улучшения пользовательского интерфейса вы можете использовать несколько разных цветов фона.
3. Используйте указатели индексов, чтобы ускорить переход от элемента к другому.
4. У вас могут быть некоторые варианты, предварительно заполненные более распространенными (персонал скажет вам), поэтому им не нужно менять все в каждом случае.

Answer 2

Если вы используете twitter bootstarp, я предполагаю, что вы используете span * и .row right?

Вы можете указать границу и поле 20px/40 для каждой строки. И попробуйте сделать это как 4 столбца, поэтому ответственный человек и категории должны быть span6 и нижним пределом границы + margin в родительской строке.

После этого времени коробки используют span3 для четырех из них и аналогично устанавливают границу и край в нижней части.

Надеюсь, что вам это поможет. Хотя ответ «Антонис Григориадис» верен, я просто начинаю с вас таким образом :)

Answer 3

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

, то вы можете также обернуть каждый блок в тонкой светло-серой границы и дать им название, как «Общая информация», «Представление Дата» или что-то будет соответствовать вашим потребностям ,