代码之家 › 专栏 › 技术社区 › jamiebarrow

可用性/用户界面设计/用户体验等——为项目编制文档

user-experience usability interface user-interface

4

jamiebarrow · 技术社区 · 15 年前

我是一个软件开发人员,现在我要进行一个项目,涉及使用ASP.NET实现一个网站(3.5/2008,使用Web客户端软件工厂)。我的任务是为项目创建一个UI/UX设计文档,但是我真的不知道从哪里开始。

我在一个项目上工作了3年,那里有一个正式的用户界面设计文档,其中包括布局和样式指南/规则(例如,应用程序有标题、导航等,链接必须是颜色A,积极行动的按钮必须在右边等)。事后看来,这非常有用,我很感激有人也付出了这么多努力——甚至在文档中定义了CSS类。但是,该文档基于现有的应用程序,并符合业务的整体企业标识。

当前项目是一个新项目,目前还没有明确的要求(是的,我知道……当需求不多时,如何设计…我离题了。很难知道到底需要什么功能。有两种不同的用户类型/角色,但不会对此文档进行正式的研究。此外,我不确定公司的身份,除了公司有一些关于使用他们的标志的规则,我只会在几天内得到进一步的澄清。

所以我有点黑,把颜料扔到画布上,希望最后我能得到一张漂亮的照片(如果我是杰克逊·波洛克的话)。

你会在这份文件中包括什么?它针对的是企业(客户),以及开发人员。我只能想到以下几点:

布局-页眉、页脚、内容、导航
样式-不同预期组件的调色板和样式
用户交互-当用户执行操作并且必须等待时,模式对话框会通知他们,使用Ajax进行验证,导航应该是上下文相关的,任务应该以最少的点击/导航量执行,等等。

有没有人在创建这样的文档方面有经验,或者在UI设计方面有任何已知的、经过尝试和测试的过程?

谢谢,

詹姆斯

3 回复 | 直到 8 年前

1

2

DA. 15 年前

在这样一组文档中可以包含各种元素:

视觉样式指南(颜色、字体、大小、图标等)
品牌指导原则(企业标识、颜色、信息等)
版权风格指南(术语、正确的信息、正确的声音等)
个人/人口目标
页面布局准则
CSS指南/标准
JS指南/标准
用例
无障碍问题
可用性问题
示例实现
IA路径流
线框组件
等。

如果你能开始思考这个问题的话,我会拿起这本书:

http://www.amazon.com/Web-Anatomy-Interaction-Frameworks-ebook/dp/B002ZY5FCW/ref=sr_1_2?ie=UTF8&s=books&qid=1262983955&sr=8-2

2

1

RBerteig Keith Adler 14 年前

除了计划文档的所有其他明显组件之外,最好是绘制UI的各个部分,并附带说明所示的特定用例。

我在过去尝试交流用户界面想法时遇到过一些问题。绘制对话框和动作序列的草图通常很有用。如果这些草图看起来太“真实”,那么它们有成为最终产品规格的趋势。

为了减轻这种压力,我一直在玩 Balsamiq Mockups . 它有一个很好的特性,它是一个可编辑的餐巾纸背面,故意渲染所有的对象和屏幕布局与手绘的感觉。我喜欢我在小型内部项目中所取得的成果。我还没有机会将它用于有许多外部利益相关者的大型项目。

3

0

Topher Fangio 15 年前

维基百科文章 Human Interface Guidlines 有一些很好的链接,我会建议。其中一些可能比您需要的信息多得多,但是它们应该给您一个好主意,告诉您应该添加什么类型的内容。

我一直认为苹果的指导方针非常完整和有用,但它们绝对是非常完成并需要大量阅读。