为什么要重视设计规范 写给刚毕业的我们——一个毕业生的自我批判

用户头像
太原/UI设计师/9年前/500浏览
为什么要重视设计规范 写给刚毕业的我们——一个毕业生的自我批判

来到北京快2周了。除了感受这个城市的不友善,空闲时间看了很多有关设计规范的文章,分析了一些APP,对自己重新审视一遍。才发现作为毕业生的自己犯了很大的错误。在此以自己的毕业设计为例,自我批判,引以为戒。

    来到北京快2周了。除了感受这个城市的不友善,空闲时间看了很多有关设计规范的文章,分析了一些APP,对自己重新审视一遍。才发现作为毕业生的自己犯了很大的错误。在此以自己的毕业设计为例,自我批判,引以为戒。


一、设计规范是什么 适合在什么时机做

    关于这个问题,我想设计规范大概就像火车的铁轨一样,而我们的APP就像火车。跑火车前一定要铺好铁轨。有了铁轨火车才能有序的跑到终点。


    (这样讲的话,做完规范不遵守那岂不就是出轨了( ̄y▽ ̄)~ )


    至于适合在什么时机做,我没有实际上线的UI设计经验不敢妄下定论。只能以自己的毕设过程为例,写一写自己当初在什么阶段做设计规范最合理。


    这是我当时的设计步骤(不合理之处欢迎评论)


7b2e57919eb50000012e7e04ec56.jpg

    经过反复的思考,看了很多大神们发的设计规范以后。像我这样的学生,在自己独立完成全部过程的时候,想做一份完善可靠的设计规范,应当是在完成前期的所有分析,建立低保真原型的时候。自己架好主要页面的原型后,针对自己设计的结构框架,出一份设计规范。原型做完了,规范也应该做完了。


    其实这就像是一次提前设计,在实际操作前对字体、配色、层级、图标、按钮、间距进行的提前设计。或者是对主要界面风格的一次提前设计。


    如果公司有产品出原型的话。我想在产品出原型的同时,是做设计规范的很好时机。在出原型之前就制作原型应该也可以,但是没有原型的参考,就只能凭借个人经验想象大概会用到什么图标、按钮、排版,平白浪费了很多时间。

    ((* ̄∇ ̄*)额 真实的情况在我真正接触到以后 第一时间给小伙伴们分享)


二、没有做设计规范的下场


    说了那么多接下来就请大家看看我自己的案例,课题是“基于云存储的高校教学资源共享平台界面设计”。来吧~一起认识一下没有做设计规范的下场。


错误一 设计规范过于简单 没有进行实际测试


    其实说我没有做设计规范吧,也做了一点儿,我对颜色和字体做了简单的规范。主体色采用云平台通用的蓝色。具体定为明亮爽快的蔚蓝色(#20aee5),强调色定为红色(#fa3333),辅助色为绿色(#77fcad)。字体选择为苹方。


    因为只是简单的从色板上选择,没有实际替换到页面中进行测试,颜色在页面设计中出现了很大的问题。请大家看好友申请的页面。


6e8e5791b0a30000012e7ec73253.jpg

    在页面的下部分,红绿两种颜色同时出现。这时候问题就来了,当初选择时没有进行测试,绿色的明度过高了。为了清晰的显示按钮上面的字,必须使用苹方粗体。而红色的明度比较低,所以使用苹方常规体即可。这样一来按钮就显得极其不统一。


    当时其实已经意识到了这个问题,正是由于没有提前做好设计规范,工程此时已经进行到末尾,再改颜色,必须从开题报告开始改,工作量就很大了。当时决定缩小红色按钮的背景大小,以尝试达到视觉上的统一。


错误二 没有规范图标 用到哪些图标临时绘制


    我们在做界面设计的时候,图标是很重要的一部分。尤其是我的毕业设计,作为一个云平台的设计。图标有很多不同的层级,以搜索页面为例。有标题栏图标、标签栏图标等六种位置的图标。而我只是确保了每个位置同级图标大小一致。没有一个规范,在这个页面就显得很乱。甚至清楚的看出图标颜色都很不规范。


617e5791b6460000012e7e847353.jpg

    刚才可能看不清楚,我放大图标来给大家看

893b5791b9e50000018c1bf9e476.jpg

    这就是没有规范的结果。图标是用时才临时绘制的。按顺序看,随着工作的进行,描边大小就渐渐的出现了问题。最开始绘制的标签栏图标还是2px的描边,到最后竟然让自己做成了3px。大家都知道图标的绘制应该尽量是2的倍数。在没有规范的情况下,竟然出现了原则性错误。而且对比前三个图标,第四个竟然连圆角也没了! (ノ`Д´)ノ  菜的抠脚啊!


错误三 没有规范层级 间距


    以前没有注意到设计规范这个概念,我是这样设定间距的。请看我的PSD文件

9a1b5791bbf20000012e7e4dfb67.jpg

    从第一个文件开始,做几个正方形隐藏,做间距时用矩形夹在中间定间距。这样一来同类的页面,我就保证了间距的一致。

ad9d5791bcd40000012e7e5baca7.jpg

    但是在做文字数量大的页面时,问题就很明显了。没有做层级划分,虽然间距有方块儿保证了一致,但是整体上看就显得很紊乱。文字数量大时,间距的选择在没有规范约束的情况下变得很困难。

f7095791bfa60000018c1b9f3900.jpg

    我保证了存储界面页面一致,好友页面一致。但是两个标签搁到一块。没有设计规范的问题就很明显了。高度在不同的标签出现了不一致的大问题。


    我的天呐!∑(っ °Д °;)っ!

f9bf5791c0ba0000012e7ed54199.jpg

    不琢磨还真没想到问题这么多。


三、写在最后(矫情)


    北京还真是一个不友好的城市呢啊~


    在北京呆了快要2周了,还是没有找到工作。投出去的简历都被淹没了。都说北京城机会多,但是竞争实在太可怕了。6000左右的工作招一个,智联上能有1600人投,其中有2个工作经验10年以上。好可怕,工作了10年来竞争6000左右的工作,这10年他在北京都干了点什么。


    虽然这么讲,但是总不能放弃吧~ 我曾经说过 我的梦想是能一直做设计直到自己再也看不到屏幕的那一天。所以现在没有理由说放弃


    这篇文章写给在路上的我们,与君共勉


    加油吧 年轻的梦想~

   

    

    

6
举报
|
11
分享
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
加载中
推荐素材
金色颗粒质地的平面
平面插画设计女孩喝咖啡
平面男孩喝咖啡插画设计
金色颗粒质地的平面
金色颗粒质地的平面
“知识宅急送”外卖,快递,平面,海报,素材,教育
空的平台平面和自然景观
玄关入门地毯印花图案红地毯
金色颗粒质地的平面
倒计时,海报,平面
空的平台平面和自然景观
平面设计风格的粉色草莓味马卡龙
牛奶乳液层次梯田平铺平面
金色颗粒质地的平面
城阙凡花
城市园林平面布局航拍
金色颗粒质地的平面
水蜜桃和李子的平面水果图案
城市园林平面布局航拍
平面风格黄绿色系花朵装饰
平面书法字手写
中国传统纹样创新图案设计
海底世界插画
平面设计 吊牌设计
平面插画情侣/矢量
你可能喜欢
大家都在看
登录注册