我的第一次UI制作经历
大二第一次接触UI,从完全什么都不懂开始自己摸索。以此作为我的首篇文章,仅记录我的第一次UI制作经历。
2017年寒假我第一次尝试了为一个网站进行UI设计。首先师兄发给了我线框图,说实话我那个时候还不知道什么叫线框图,也并不知道是谁做的,如何做的,但是大概知道线框图是一个设计模板,根据线框图上的布局来进行视觉设计。
当师兄发给我线框图的时候我以为让我用ps做一个图把线框图还原(鬼知道我为什么会这么理解),于是

师兄说配色自己看着办,图片和logo先找东西代替一下,于是我就做了这个,现在看来师兄也真是好脾气居然没被我气死,只是说原型图的影子很重,要做的更精致一些。好吧我完全就是用方块把线框图又画了一下,加了一点icon而已。稍微明白一点我要做什么了之后我又做了这个

我一直觉得这个配色就很好看,自己又完善了一些细节,比如那个三角形。自认为很满意的时候师兄说,要把UI设计做成你感觉可以直接放到网站上用,这样一说我就又明白一些了,我的作品太简洁,像是半成品,原型图的影子还是很重。冲着能直接在网上用这个标准我又进一步修改

很厉害对不对,我居然改了配色,而且是模仿的网上的一组配色,人家的网站好大气哦。我当时真的觉得自己好酷,拉了参考线,把所有东西都对齐了参考线,导航栏也模仿很多成熟网站的布局等等。但是现在的我看这这张图好智障。好吧师兄还是说不够细致,我当时也没太理解,只能继续看别的网站,寻找可以改的部分,于是

厉害的我抹掉了那一抹红,用了墨绿色系,感觉很高逼格。而且师兄发来了他随手制作的一个给我做借鉴,导航栏确实很漂亮,于是我就模仿了。btw,banner图片也是从师兄那里盗来的,自己根据一些成熟网站的产品展示模式又设计了一下,虽然原型图的痕迹还是很明显,但是自我感觉还挺好的。导航栏过关之后,又被指出配色不行,要有含义,比如环保网站用绿色,设计网站也要有详细的配色考虑,然后我就致力于改配色了

突然就像那么回事了是不是!真的设计就是不断自我否定,各个部分的关系调整了一次又一次,当时觉得这个颜色还不错了,而且各部分之间比较协调,导航栏也有自己的创新。但是可爱的师兄说,一般网站都不用深色做底色(但是我看见过很多而且很喜欢),要把底色改成浅色,于是我又回去改了,在思考配色的时候碰巧看见了一些模板,师兄说设计之初完全可以去模仿那些模板,于是我就hhhhh

当当当!当!是不是厉害很多,感觉差不多可以拿去直接用了。导航栏部分是看到另一个网站是这样布局的,很好看,就拿来借鉴了一下,感觉简洁大气了很多。变化最大的是那三个按钮那里,以前都是按照线框图来的,这次看到了一个模板,这样也不错,又显得很大气。但是这一稿师兄还没来得及说什么,我就觉得自己“合作伙伴”那里很奇怪,和前面格格不入,于是想使用同样的三角形和线条元素装饰一下

比之前违和感弱多了,footer也被我改动了很多。但是交上去之后,一个师姐提出了一些小问题:导航栏press状态颜色变浅不突出,banner图片和文字太乱,合作伙伴用色块铺一条灰色不够好,直线和三角也怪怪的。好吧我也感觉到了这些问题,但是并不知道有什么更好的创意,于是又多看了一些设计成品,怎么人家设计的就很整体很统一呢?而且很高大上的网站都是外文的,中文字体不知道怎么设计好看,在我的摸索中出了最后一稿

我自己最喜欢的一点就是背景色改成了灰色斜线(不知道这里能不能看清),合作伙伴那里修改n次才改出自己觉得不那么难看的一种,三角形被我用了又丢,丢了又用,多次反复考量才达到这个结果。哦还有banner我加了模糊,透明度也降低,减少色彩对文字的干扰,导航栏press使用橘色来强调。
这不到一个月的时间感觉自己学到了很多,每次回过头看当初很满意的作品都感慨师兄气度大,简直惨不忍睹啊。







































