[转帖]APP设计相关技巧

作者:郦橙锦妖一只麋鹿
链接:http://www.zhihu.com/question/36813390/answer/87029428
来源:知乎
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

— 提纲 —

1. 做app需要图标,我又不会画,怎么办?搜到一些现成的,但质量又不高,怎么办?图标不成套怎么办?

2. 没有审美怎么办?

3. 心里有个app想法,但是线框图画不出来怎么办?

4. iOS那么多尺寸,Android尺寸更吓人,全都要记住吗,导出@1x@2x@3x点九图什么的是不是很麻烦?

5. 说了这么多,还是要我从空白画布上画吗?!没有美术基础啊!当然不是啦~

6. 还有什么问题可以提问哈。

— 正文 —

1. 图标苦手怎么办

就算是设计师,一个一个画图标也是很累的。
这时候,如果有钱,请到选项到A;如果没钱或者不想花钱,请到选项B。

A 如果非常有钱,请直接把钱给我,我把图标给你哈哈哈。如果有一点钱,可以去http://www.shutterstock.com/ 或者 http://www.pixeden.com/ 买,图标站还有很多,先列这两个,反正你们更想看免费的对不对。

B http://www.flaticon.com 是你的好朋友,最好的朋友之一。虽然最近突然改版,变得有点难用,但海量,成套,免费,你还图啥?缺点可能是风格比较单一,想要fancy一点的怎么办?smashing magazine帮助你,https://www.smashingmagazine.com/ 只要搜索freebie即可,最早几年的icon质量不太行,也过时了,越是新帖质量越好。

举个栗子,随便点开一个。

可以调大小,可以改颜色,可以调线条粗细,用上这些,是不是b格噌得就上天了!这些都是顶级设计师放出来的免费资源,你花钱雇的设计师未必画得出来。。。

2. 没有审美怎么办?

这个就没有特效药了。据我的观察,没有审美天赋的人,可以判断好看和不好看,但无法判断好看和更好看,这时候如果你有个设计师朋友,请付费或者请吃饭,向他咨询咨询吧。

疗程缓慢的办法有:多看dribbble(eye candy多,但可以了解趋势和审美取向),多用好评和获奖的app,“最美应用”你下载了吗?“豌豆荚设计奖”你看了吗?(@马力请点赞~)每年app store 的盘点你都关注了吗?

3. 构思不好app流程怎么办?

$1 prototype大法,来自一本同名书,我刚看完个开头,所以以下是我根据它的目录和我的经验编的。。。具体就是“场景” – “过程” – “界面”。

先想象用户在什么情况下用,涉及几个用户,他们在干什么。比如,yelp,是用户需要找地方吃饭,所以一般只有一个用户(相对于uber两方用户,群聊n方用户),输入是一些查询条件,输出是在哪儿有饭吃。

现在细化过程,用户从打开app到达到目标,有哪些步骤。还是yelp,一般情况就是打开app,输入查询条件,看到结果,筛选,满意的话查看商家详情,不满意的话可能重新搜索可能更改筛选条件。这是主线剧情,还有些支线剧情,比如看到一个用户的评价很好,查看用户的其他评价,follow用户;还有自己身在餐馆,拍了菜单拍了菜,上传到yelp。把所有的剧情,都在流程图上画出来。

期间可能会遇到一些细节。用户先输入什么呢,是餐厅类型,还是只要能吃就可以?距离这个信息是gps给还是用户自己输,或者其实距离无所谓,反正用户有车呢?价格是什么时候出现?是搜索的时候就限定价格,还是结果出来以后再筛选?这些都不怕,反正也是要改的。。。而且一般自己想做的app也没有这么复杂。

你有一个流程图了,界面就简单了。把元素往界面上摆一摆,推荐用手机大小的便利贴,拿铅笔画上去,有很多东西玩app多了都有经验,搜索结果是啥,不就map view和list view么,怎么筛选,放一个漏斗icon在标题栏里呗,酱酱酿酿就好了。接下来就是把亲朋好友拉过来,让他们玩一下这个paper prototype,发现不对的地方再改。

有两个软件推荐,一个https://popapp.in 好久不用,希望它还是免费的。一个https://marvelapp.com 免费无限量project,真良心,我一直期待它被adobe收购,结果adobe既没有收它,也没有invision,而是准备自己做一个comet。。。真傲娇。

4. 尺寸记不住怎么办?

就不要用ps了,sketch做为生产力工具,真的不贵,都不是按月按年subscribe的,一次买一生,有什么舍不得的,买吧。以后用它直接新建画板,就不用记住那么多尺寸了,导出图片也特别方便,ps切图再见。

5. 面对空白画布下不去手怎么办?

前面提到了invision,这家公司的marketing很牛,设计也很牛,市场部为了宣传他们的产品,让设计师做了很多的高质量免费模版给其他设计师下载。

举个栗子。

再举一个。

这些全是一整套,一整套啊,意味着登陆界面,dashboard,阅读文章的界面,购物车,天气,聊天对话各种界面都很可能有。格式一般都有ps,sketch两种,有时有ai,和设计师打包给你的成品差距不大,你可能需要一个切图仔,或者自己来。

这些不够怎么办?
http://graphicburger.com

http://freebiesbug.com/psd-freebies/ui-kits/

https://ui8.net/categories/freebies

这样总行了吧。

6. 其他问题。

应该没有其他问题了吧。