html - 更好的用户界面设计，方便预订

Question

我正在使用Twitter Bootstrap UI为我的应用程序开发屏幕。

我创建了预订/预约页面。

此页面将供医院工作人员使用。他们想快速填充数据，因为他们通过电话从用户那里收集所有数据，同时它们同时填充。

最终用户觉得这个页面看起来对他们来说有些困难，他们希望从用户体验的角度来改进这个设计。

我对设计一无所知。用户还可能希望将来在同一页面中检查所选医生的可用日期和时间。

Answer 1

you can start with putting together elements that are logically connected to each other.
i did a quick example:

then you can also wrap every block in a thin light-gray border and give them a title like "General info", "Submission Date" or whatever will fit your needs.

Answer 2

我可以看到一些有帮助的改进：

1. 将一些相关的元素组合在一起，以便对眼睛更友好。
2. 您可以使用一些不同的背景颜色来增强 UI。
3. 使用选项卡索引可以更快地从一个元素导航到另一个元素。
4. 您可以预先填写一些更常见的选择（工作人员会告诉您），因此他们不必在每种情况下都更改所有内容。

Answer 3

如果您使用的是 twitter bootstarp，我假设您使用的是 span* 和 .row 对吗？

您可以为每一行提供一个边框底部和边距 20px/40。并尝试使其像 4 列，因此责任人和类别应该是 span6 和父行中的边框底部 + 边距。

在那之后，盒子对其中的四个使用 span3，并且类似地将边框和边距放在底部。

希望对您有所帮助。虽然“Antonis Grigoriadis”的回答是正确的，但我只是让你开始这样做:)