如何设计 GUI 来浏览多个层次结构?
我想为文档管理应用程序设计一个 GUI 仪表板
。 仪表板
仅包含文档缩略图。每个文档可能属于几个层次结构(例如“主题”层次结构、“语言”层次结构、“流派”层次结构等)。用户可能想要选择英语的数学文本或所有罗马语言的歌词等。
如何你为此设计了一个 GUI 吗?如果仪表板
在多点触控平板设备上运行怎么办?此类 GUI 的示例有哪些?
I would like to design a GUI dashboard
for a document management application. The dashboard
contains only documents thumbnails. Each document may belong to a few hierarchies (e.g. "topic" hierarchy, "language" hierarchy, "genre" hierarchy, etc.) A user may want to select math texts in English, or lyrics in all Roman languages, etc.
How would you design a GUI for this ? What if the dashboard
runs in a multi-touch tablet device ? What are examples of such GUI ?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
我概述了这些可以使用鼠标或触摸的示例:
1) 下拉标签:您可以使用类似于 Delicious 处理标签的方法,但将标签放在层次结构下,您可以在右侧的下拉菜单中进行选择在顶部。当您选择过滤器时,文档会被实时过滤。保存旧的过滤器以便快速导航会很有趣。
2) 复选框: 如果您的过滤器和选项很少,您可以保留一堆复选框实时过滤文档:
但是,很难有这样的 UI,我认为你应该制作原型并要求用户进行测试什么是更好的。
I sketched these examples that would work with mouse or touch:
1) Dropdown Tags: You can use a approach similar to what Delicious do with tags, but put tags under hierarchies which you can chose on dropdown menus right on the top. The documents are filtered on real time while you choose the filters. It would be interesting to save an old filters for quickly navigation.
2) CheckBox: If you have few filter and options you can keep a bunch of checkbox on the side and filter the documents on real time:
However, it is hard to come with a UI like that, I think you should prototype and ask for the user to test what is better.
当您设计 UI 界面时,请记住用户必须知道他们在系统中的位置。他们需要知道下一步可以做什么;以及当他们这样做并到达那里时会发生什么。
对于任何用户来说,最直观的 GUI 都是他们已经熟悉的界面。
这样,他们就不必花时间思考执行特定操作时会发生什么。
浏览器 UI 和文件资源管理器 UI 就是这样的一些示例。
将鼠标悬停在文件上可以看到一个半透明的弹出窗口,其中列出了如何处理该文件的选项,这是增强可用性而不用导航辅助工具弄乱屏幕的另一种方法。 (这甚至适用于多点触控屏幕)
When you design a UI interface, remember that the user has to know where they are in a system. They need to know what they can do next; and what will happen when they do it and get there.
The most intuitive GUI for any user will be one whose interface they're already familiar with.
This way, they won't have to spend time thinking about what would happen when they perform a certain action.
Browser UI's and File explorer UI's are some such examples.
Hovering on a file to see a semi-transparent pop-up which lists options of what to do with the file is another way to enhance usability without cluttering the screen with navigation aids. (this works even for multitouch screens)