新手不知道的PC端设计小技巧,新手必看!

用户头像
成都/UI设计师/5年前/788浏览
新手不知道的PC端设计小技巧,新手必看!

写点零零散散的技巧、记录一下


入行一年半,只是回过头来总结一下之前遇到的一些问题,如何解决的方法,本文章只是针对自己刚入行对设计的一些总结,一些实用的技巧。





对于从来没有接触过PC端设计的同学来说一般上来都是很懵逼的,可能从哪下手都不知道,最好的方法就是参考,前期要多多参考大厂网站的设计规范,当然这仅限于前期新手,后期自己熟练掌握了规范,还是要输出一些自己的想法和见解。


1.1、参考好的网站的前端代码


这里看的代码当然没你想像的那么高深啦,就是一些字体大小、颜色、版面大小、这些基本的东西,但是有了这些东西的框架,对于一个新手来说就不会出太大的错,当然这仅仅是局限于前期,后期也要输入自己的见解。


以MAC电脑为例:随便打开一个网页,鼠标右键点击然后选择检查元素这时就会跳出来面板



右下角的红框数据有字体颜色、字体大小,板块大小这些也就基本够用啦,这样参考下来基本能保证页面不会在视觉布局上出现太大的问题,如果你说我看不懂英文怎么办?答:谷歌翻译或者百度翻译,而且就看那几个数据还是比较容易懂的哈。


1.2、网页预览插件神器


如果你是使用sketch来做设计的话,有一个网页设计稿的预览插件,这个插件简直就是神器,基本上预览出来就和实际开发出来的八九不离十了,百度一搜索就能下载,名字叫:Preview in browser,这样你就可以大致判断你的设计在实际环境中的效果了。


1.3、中间有效区域内容


做网页肯定要有一个尺寸,常用的都是以1920x1080来做,那内容从哪里开始铺呢,这里就涉及到一个有效内容区域,一般情况下在可以在1200像素以内做,这样可以在几乎所有PC屏幕下显示,当然这个也不是定死的,一般大小都在1200-1400,如果你内容控制在1200,就可以不用做适配,如果稍微宽一些可能就要做适配了。考虑下更小的屏幕的显示效果,当然这里的大小同样可以参考别的网页,方法也是跟第一个一样查看代码。




2.1字体颜色、深浅、粗细


经常说要有节奏感,那么节奏感是什么呢,节奏在页面中怎么体现呢,对于字体来讲一般可以从大小、颜色、深浅、粗线、间距这几点来控制节奏,一张页面肯定要有节奏感,不然就会毫无重点。



2.2同一板块层级的字体大小最好不要超过三种、配色包括主题色最好不要超过三种


页面中高频率出现的同一板块字体大小最好不要超过三种。配色最好不要超过三种,因为多了的话会容易显得页面很杂乱。



2.3控制好间距


根据格式塔的邻近原则,我们在对两个不同组的内容时间距要拉得足够开,反之就要足够近。






在进行B端管理系统的设计时,这里也有几个大厂的比较规范的组件进行参考,里面涵盖了:表单、按钮、icon、布局排版、栅格、导航等等各种样式,这里我列几个现在比较常规的好用的几个大厂的组件,这几个网站都是可以直接下载sketch插件参考的


饿了吗Element ui

https://element.eleme.cn/#/zh-CN


蚂蚁金服Ant Design

https://ant.design/components/overview-cn/


阿里Fusion

https://fusion.design/help.html?spm=fusion-design.tool-design-fusion.0.0.55b141c2MpEsev#/dev-use-module


以上组件仅供参考哈




以上只是我在工作中的一点小技巧的总结,之后还会更新自己的作品,和总结一些东西。新手设计师虽说前期要进行参考,但也不能过于依赖,还是要输出自己的内容,最后希望各位都能成为设计大佬~

12
举报
|
24
分享
相关推荐
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
【新年UI图标】旅行icon
拟物风质感写实UI卡片合集源文件
UI通用设计素材1
科技医疗透明柜UI界面设计
【新年UI图标】礼物/活动icon
原创UIUX交互橙红渐变炫酷视觉平面设计作品集模板PSD
新能源APP应用UIKit
手表表盘UI系列
【新年UI图标】钱包icon
3D渐变流体抽象矢量UI背景图
我的钱包-UI界面设计-app
Security Camera UI kit
【新年UI图标】汽车icon
智能家居中心 简约 UI设计组件库
高级感金属拟物 UI设计组件库
新拟态风格 UI设计组件库
【新年UI图标】会员icon
钱包ui模板
【新年UI图标】30个图标
户外旅行飞机情侣假日出行
UI界面 组件
3D卡通UI界面图标可爱插画免扣素
【新年UI图标】秒杀icon
UI 登录界面设计模板包
你可能喜欢
相关收藏夹
UI
UI
UI
UI
大家都在看
登录注册