提交需求
赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!
原型图不只是工作,更是设计对产品的理解。对整体的把控和思考的过程。所以后期的一些设计上的小错误都是因为没有严格的思考。一个产品的经验分享给大家...
一、我为什么要做原型图的分享?
最近公司有很多面试者,加上有一些设计的分享群(打个广告,“花火分享”,希望大神们能帮忙分享文章)。好多人都会把自己做的某个产品页面分享出来,问大家“哪里不合适?这个按钮怎么设计好看?文字放在哪里比较好?”。其它的先不作评论。我个人觉得,别人未必了解你的产品思路,你的需求,你的设计想法和实际情况。所以,这类回答基本是不负责和没有帮助的。为了解决这些初级且琐碎的问题,我在思考到底是哪个环节出了问题。
ps:这里要感谢我的两位领导,是他们教会我一个道理,做设计不能是抠细节,而是先构思框架。整个大框架都掌握了,接下来就相对容易些。
出于这些目的,我决定总结自己的经验,试着分享一下解决一些问题。改善一下现状,说句不要脸的理想,为设计行业水平的整体出一分力;
新手设计师对设计岗的基本认知就是:产品(原型图)-设计(设计稿)- xxxx
但往往设计是一个很重要的承上启下的角色。你需要充分了解公司的商业目标,商业价值,用户的核心需求,产品现有或者未来的结构大概的走向,开发成本和难易度等等,多少都需要了解。这样你的稿子才有理有据。不需要讲究多绚丽,起码是符合用户期望是合理的合适的设计。说的更夸张一些,和别人撕x时,你是让别人服气的。我个人是这么认为的。
这样在将来的产品迭代中,在整体新增新需求时,你才能知道在哪些地方加是恰到好处的。高级一些的设计师甚至会事先都留好空间来防范这新增的需求。
更重要的是:产品经理不给原型图;
这样就会引起设计师“随意发挥”,如果没有规范,那真的是“抽象艺术”。
所以,我接下来分享的不光是一种技巧,更是一种方法,一种整体梳理产品的思路。帮助更多设计师更理解产品和更规范的一套思考方法;(大神就别来捣乱了,我直接跪拜)
二、原型图
最近面试问到的一般初级设计师都了解axure和mock plus等。这两款都各有特色。但是我已经玩够了。所以今天分享一个更快捷的就是:experience design;简称XD;(。ì _ í。)
说正事专用分割线“----------------------”
无论是设计还是其它的什么,总结规范(工作总结)最重要,因为可以快速的帮到你;不废话了,直接上货;
三、我想做 比汉斯和追波上的高大上原型稿;如下图(图片来自网络):
如何做到这么有完整,美观且工作效率要很高?
四、思考和经验结合;
我经常习惯用experience design(简称“xd”);这款软件是做设计用的,但我一直以来用它做原型稿。如下图:
五、如何做?
首先,假设我拿到一个“评价”的需求;需求的其中一个页面就是对订单评价;那么接下来你的脑子里肯定有个大致的构思;
1、导航栏
2、订单基本信息。谁,干了什么事,金额多少,完成时间等等;
3、一个大标题。比如:请好评之类的引导话语;
4、评价星星。或者其它图形。
5、不同的评价分数,对应不同的可选择标签。
6、匿名选项或者默认匿名。告诉用户不用有思想负担。
7、button。一个大的提交按钮。
基本以上这些功能可以先做个架构;如下图:
整体梳理一遍后,思路是清晰的;
六、架构也要有规范;(重点)
1、不要随随便便扯个图形方框就摆在这;有根据吗?有考虑吗?有整体性吗?我都在问自己
2、不要任凭心情来
3、不断调整试错
4、不懂的去借鉴大神的尺寸,因为那比较舒服
5、根据设计规范来推导原型的规范,都是相同的道理;
接下来是我的规范:注意看我的尺寸(@1x);
不举例子了,太累了;
1、我的标准都是以10px为单位的;
2、文字是以14为标准,画一个长100px,高14px的灰色框代替文本,行间距自己掌握;
3、图片和icon挺考验功力的,初级新手建议去看看weui。微信的规范,可以学习借鉴;
4、最后拖到ps里看一下效果,或者直接在xd里直接发布到链接上,然后用手机演示操作,体验一下;
5、一些app,比如微博、淘宝等都会用这种类似的图作预加载页面,我觉得用户体验是很好的;
6、这种原型好修改,可直接与开发和其它人员沟通,有了规范后,效率高,灵活性强;
做个展示,工作中的一个模块:
以上是分享内容,具体的可以看视频教程。
第一次分享,有不足的地方请见谅。希望大神多多拍砖;感谢;
大牛,别默默的看了,快登录帮我点评一下吧!:)
登录 立即注册