20170727会议草稿[PM线框图与UI图制作规范]

我在公司邮箱里共享给雅楠、立基一个文件《西柚设计规范Sketch》,里面是sketch文件。我大概讲一讲,以后我们线框图设计与ui设计需要遵循的点。

微信公众号

一般的功能类的app,按照设计规范中的来。特别是cell、popover等常用组件的设计。
PM与UI先概览一遍vux

APP设计

设计规范中包括iOS、Android。目前的情况,我们只按照iOS来设计一套。实际上,安卓和iOS在设计上,是存在设计规范上的差异的,特别是APP的header部分,返回键、title的位置等。我们以怎样的方式,可以花尽量少的时间,在做出的效果图上表现出差异,让开发理解?希望各位想一下这个问题,微信私我。

后台管理系统设计

后台管理系统设计前,PM必须与客户确定好使用框架,一般的客户也不会有意见。
我们一般使用的是vue的element-ui框架。
pm在设计线框图时,必须参考element-ui;
其他可供参考的框架
ant-design
semantic-ui

pc网站设计

企业官网设计,建议pm设计线框图前,先去找参考网站(直接百度“网站模版
”、“企业官网模板”),让客户看看喜欢哪种。
pc网站设计,同样可以遵循element-uiant-designsemantic-ui

线框图设计经验之谈:

  • 尽可能轻量级操作


    较轻的设计
较重的设计
  • 少用弹窗(modal)
    elementui中叫message box和dialog,semantic-ui和ant-design中叫modal了


    少用弹窗
  • 避免自己设计组件
    一些组件,如tab、table、menu等,在ui上不需要重新设计,节省时间。
    另一些组件,如transfer,这样的组件pm一定要知道。推荐各位pm好好研究下element-ui和ant-design,里面都是前人的结晶,学会学习、消化,只有学会了别人的,我们才能创新。

我们缺乏的

  • 组件状态。当表单不可提交时(如登录界面未填写手机号),按钮应为灰色。而现在大部分的效果图并没有体现。
  • 最最基本的交互。如发送验证码按钮,线框图不会做点击后的倒计时,以至于UI也没有倒计时。这说明我们PM与UI经验缺失,也没有把角色彻底代入。
  • 不会去模仿,不会精益求精。类似的界面,不参考大公司的设计,而是自己想当然做一个交差。如律超人的一个身份证认证页面。和大家强调一点,别人已经做了的东西,我们再做,如果做的比别人差,那不能说明我们智力不够,只能说明我们真的不用心!如果你不去模仿、不去思考,那么你做的东西永远都不会进步。
  • UI与PM的关系
    • 我们目前的情况类似于PM给线框图,UI出了效果图,PM随便看一看,就丢给开发。最后开发出的东西问题一堆。
    • 共同为产品的最终效果负责。UI发现线框图问题,要与PM进行沟通,想一想这个图合不合理。PM发现效果图做的粗糙简单,也要和UI进行沟通,反思是不是自己的线框图没有表达清楚。沟通一定是双向的,这个过程是互相提高、互相学习的过程。
    • 一个人的力量是单薄的。所以,线框图出好后,全体项目组开会。UI图出好后,PM要自己先审查,再开会。

一些学习课程

安排在周六下午进行播放

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 213,711评论 6 493
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,079评论 3 387
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 159,194评论 0 349
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,089评论 1 286
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,197评论 6 385
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,306评论 1 292
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,338评论 3 412
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,119评论 0 269
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,541评论 1 306
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,846评论 2 328
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,014评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,694评论 4 337
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,322评论 3 318
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,026评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,257评论 1 267
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,863评论 2 365
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,895评论 2 351

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 171,914评论 25 707
  • 本文为2016年11月9日,『前端之巅』微信群在线分享活动总结整理而成,转载请在文章开头处注明来自『前端之巅』公众...
    尾尾阅读 10,567评论 3 32
  • 每个做父亲的,都希望给自己的孩子创造最好的条件,过上最好的生活,从而补偿自己成人世界里的缺憾。 作为新晋不久的老爸...
    良有方阅读 220评论 2 0
  • 本节课是认识图形的第4个活动“摆一摆”,让孩子把刚认识的图形重新从大脑中调出来,再次直观呈现,强化学生对这些...
    上小官阅读 982评论 0 0
  • linux下git的安装和使用 最近在使用github,感觉不错。在windows下,可使用github提供的wi...
    鲍陈飞阅读 4,015评论 0 2