欢迎光临长沙蓝顿网络公司,服务热线:153-8752-6121
长沙网站建设
浅析交互与UI软件界面设计工作的流程
营销型网站建设

这个流程希望整个产品团队都能参与其中并共同加强对产品的理解。或者借一个时髦的概念,希望团队能具有更多Design Thinking,“设计思维”,来加强和推动解决问题的能力,并激发更多创新。

最开始一定要把Scenario应用场景和Persona用户角色做出来。你的产品是在何种场景下被使用,你的用户角色是怎样特征的人。设计的对不对,要用用户角色来判断,而不是设计师或产品经理自己。把场景和角色描述清楚,并且让整个团队理解透彻,这能保证团队少犯错误。


1. Storyboard 故事版:

主要负责人:产品经理或交互设计师

最早大家开始讨论用户体验流程,在白板上边画流程边添加粗略的UI元素。会后交互设计师会在在纸上做手绘版线框图。这阶段产品经理、交互设计师、UI设计师、包括技术工程师会一同作大量的讨论,而且主要讨论的是流程和主要功能,因此手画故事版最快最方便并易于修改的。

此环节要敲定userflow,用户流程及其中的关键步骤,每一步骤都是一个主要界面。

*移动产品设计这样做也行,不买专用的模板本和工具尺,自己打印也行。

2. Key wireframe 关键界面线框图

主要负责人:交互设计师

在确定的用户流程中,选出几个关键的,有代表性的步骤,做细化的wireframe线框图。线框图里要确保每一个UI元素的设计,包括其大小和位置。我们做的线框图是1:1的,也就是线框图与实际界面尺寸一致。1:1的线框图能在前期避免考虑不周和执行困难等很多问题的出现。

此环节要确定关键界面里的UI元素和布局,以及全局的布局排版风格。

3. Key visual design 关键界面视觉设计

主要负责人:UI设计

此环节交互设计师会按确定的用户流程及确定的布局风格来继续做其它界面的线框图。UI设计师则同时开始做关键界面的视觉设计,进行配色、样式不同风格的尝试。

此环节要确定产品界面的视觉设计风格。

4. All wireframe 全部界面线框图

主要负责人:交互设计师

此环节交互设计师要完成全部界面的线框图(1:1的)设计并且团队确认。

5. Prototype 可动原型

主要负责人:交互设计师

此环节依产品需求而定。如果静态的线框图还不能完整的体现出产品特点,那就需要做成可操作甚至有关键界面动画示意的可动原型。通常是HTML的可动原型,特殊项目也曾经做过Flash的。我还有一个奇葩朋友用PPT做过(PPT的开发工具+VB Script)几乎接近成品界面的可动原型。

此环节的确认同上一步,团队的理解会更精准。

6. UI design 全部界面视觉设计

主要负责人:UI设计

完成全部界面的UI视觉设计。

此环节确认全部UI设计。同时把确认的UI更新到文档里。

以上步骤里省略了了给boss汇报或者给客户汇报的描述。有条件的话,最好是每一步都要让有关的决策人员参与确认。

如果要做用户调研的产品,那一定要做出可动原型再让用户使用测试,不然很难得到有价值的反馈。有条件的公司直接出带设计的可动原型再测试当然最好。

上一条:签约湖南省新三板企业协会网站建设
下一条:签约湖南天香生态兰花有限公司网站建设
长沙网络公司,长沙网站优化
© 2009-2020 长沙市蓝顿品牌设计有限公司 湘ICP备16016586号
地址:湖南长沙雨花区万家丽路 工作QQ:565616163
本站关键词:长沙网站建设 长沙网站制作 长沙做网站的公司 长沙网络公司