多语言展示
当前在线:1961今日阅读:103今日分享:49

独立完成app的交互与视觉

本人有2年的appUI交互与界面设计的经验,希望对ui萌新有一点帮助,少走弯路,在设计过程中避免不必要的麻烦。      下面尽量简单的讲解设计前期到切图给工程师的流程。
工具/原料

Ps AI Axure (交互设计软件)

方法/步骤
1

以一款旅游app为例,先分析目前的行业背景和行业用户的痛点(旅游是否兴盛,使用旅游app是否多,这些人在旅游时遇到什么困难,想得到怎样的解决,可以做个问卷调查)。大量问卷调查可以准确得到用户的需求点。      竞品分析,也就是同行对比,排前几名的优缺点,它们的用户反馈的问题之类,提取出来(后面功能,交互架构会用到)。

2

经过前面的分析,我们大概得出了我该设计款什么样的app,我们的app能给用户解决什么问题,与同行比较app我们的优势在哪,这两点很重要!很重要!很重要!也就是我们app的核心价值,为什么很多很漂亮的app用户少或者失败,都是载在这里(市场推广我们不讨论)。

3

经过前面分析与调查,我们开始确定我们的用户,首先我们不可能满足所有的用户需求的,所以先确定核心用户,典型用户,方法:    1. 用户类型陈列出来,类型越多越好,可以从年龄,职业,性别,性格等等角度去列出来,比如又类人旅游去看风景,有的去购物吃美食,有的去学习,或者探险,也或者很少旅游,经常旅游,是单独的还是组团的。    2.根据以上的类型用户,分析他们共通点,重合的地方,最有可能使用app的,最有价值的,得出典型用户(3个吧),这类用户是我们服务的核心用户。

4

分别模拟出典型用户的使用场景,从中得出他们需求,也就是我们要开发的功能(写在小卡片上贴在墙上),然后根据这些功能,我们做一个功能流程图,也就是把这些功能以使用的过程串起来。  1. 梳理功能,哪些不现实或开发不出来的(与老板或者产品经理讨论下)。  2. 通过这些可用功能,制作app功能架构,分好板块。  3. 制作操作流程架构图,从登陆开始,各个模块走一片,每个步奏要有头有           尾,   其中要考虑逻辑,这快难度高。

5

到这里开始用Axure软件设计交互界面了,根据功能流程架构,从主界面开始,其中要考虑用户思维习惯,关注用户情感和细节,步奏简洁,设计出舒服,人性化的操作界面。   还有可以加入动效(界面跳转,按钮)

6

然后就是界面视觉设计部分了,颜色要考虑到典型用户群,app的气质,图标可以在AI上制作拖到ps里,界面规范很重要,做到一致性,简洁化。

7

最后就死标注切图了,可用一些专业的标注软件,比ps快多了,切图可以下载个ps插件(我用的是Cutterman这个,ios和安卓都可以,非常方便),切图要注意的这里就不说了~~   希望给你们有点帮助哈~

注意事项
1

1.前期功能和模块架构要和经理或老板沟通好,这个很重要,不然后面会悲剧,

2

2.交互界面和动效也要和工程师讨论,反正会不停撕逼,工程师做不出来的效果就要放弃掉。

3

总之整个过程大部分都要和经理,老板,工程师讨论交流,切不可埋头苦干。

推荐信息