1、 首先将你的想法在纸上画出来
这是一幅世界各地不同年城市特色建筑的草图,每个人开始设计之前都会在纸上画草图,但是很多设计师都跳过了这一步,没有考虑到他们将会面临的问题。设计就是要解决问题,但是这些问题通过渐变、阴影设置是解决不了的,只有通过调整布局和层次结构才能解决。所以在你开始设计之前,一定要先想好布局。
2、 描绘一个顶层框架
描绘一个基本的框架可以帮助你解决UX方面的问题,同时规划布局。当我接手一个项目的时候,做的第一件事就是建立一个顶级框架,这样可以解决所有的设计问题。这个框架是指环绕在内容周围的UI,它可以帮助我们执行操作,更好的操纵页面。它包括导航和组件,比如侧边栏和底部的按钮。
如果你通过这种方式来做设计,在不看主页的情况下,你也能清晰的知道应该怎样布局。
3、 给PSD添加网格
这是一个有978个网格的PSD文件,每条线的宽度为10PX。画网格做起来就像听起来那么简单,虽然你不画直接开始设计完全可以,但是我相信设计出来的作品绝对没有画了网格好。网格的好处就是帮助你构建不同板块的布局,起一个指导作用,帮助你制作响应式模板。
4、 选择你的字体
网页设计中很重要的一个原则就是一个网页中不要出现两种以上的字体在一个项目中,寻找好看的字体也是很重要的一部分,但是我要提醒你,在同一个网页中千万别使用两种以上的字体。选择字体的原则就是要易于用户阅读,尤其是文字很多的页面,文章标题的字体可以有趣一些,这样能吸引用户的注意。在使用字体的时候不要畏首畏尾,个头大不是问题,只要整体看起来很和谐生动就行了。
5、 选择合适的颜色主题
使用有限的颜色和色调,减轻用户的视觉压力。 在选择字形的时候,你就应该想好用户界面、背景、文字该用什么颜色。我建议你在颜色的原则方面一定要有节制,别想到哪个用哪个,最后五颜六色乱七八糟的,这也是大忌。
在这一步中,你要根据每个元素的功能选择颜色,并且在用户界面中,相同的元素颜色一定要一致。你可以观察一下facebook、推特、quora、vimeo等等网站的页面,在不干扰功能组件正常使用的情况下,除了用户界面,它们的插画和平面细节没有任何颜色限制。
6、 分开布局
网页结构越简单,用户使用越容易在网站中,每个模块都要有个故事,要给用户一个浏览的理由和最终的结果。而设计的作用就是强调这个故事中最重要的那部分。在现实设计中,主页面不能将所有的信息都显示出来,所以你必须在主页先告诉用户“进了这个网站你能做什么”。
发挥你的聪明才智思考一下你能想到的极简页面,有最简单的目标和必要的构件。最后你会发现,原来保持简单这么困难。
7、 重新思考
我们真的需要搜索按钮吗?在很多案例中,答案是否定。作为一名设计师,是我们一手决定了用户浏览因特网的方式和界面,由你决定用户进一个页面需要多少步骤、一个网页效率有多高。在设计完之后,一定要多测试,发现漏洞,及时修改,这样才能做到极致。
如何做好网页美工设计,对于新手而言,这还有些小小的难度,尤其是当网页美工设计由几个人接手的时候。不过,其实只要掌握好几点,网页美工设计其实也不是十分困难的一件事。
在网页美工切图设计之前,我们先基于ps进行新建文件设置,在设置的时候需要注意以下几点:
1.一定要做好网页宽度的设置设计,一般网页宽度有760PX、900PX、1000PX等,最好不要超过1200PX的宽度,高度没有限制。大多数做网站的公司都有一个比较合理的标准。
2.作为网页背景、网页图标的要清晰,在网站设计的时候比较注重。网页背景和图标一定要做精细,不清晰很影响客户的体验度。所以在切图的时候不要切出来的效果与设计的效果相差太大。
3.有特效地方,有必要设计出特效样式,以便DIV CSS制作的时候切图使用。
4.在做成网页后可改变的文字,需要使用宋体、黑体无需修饰5.版面的字体、型号、一定要注意,细节一定要对齐。