说到PC端，这里不得不提到web，这两个概念有些人容易弄混淆，认为是同一个意思。但其实是有区别的，准确的叫法会显得你更专业一些。
web是指网页，web端是需要多屏幕适配，即可以用电脑呈现，也可以用移动端来呈现。而PC仅仅是指用于在PC（电脑）浏览器上使用的 web页面，可以说PC端是web端中的一个呈现形式。所以相对应地前端开发工程师我们一般称为web前端工程师。了解了这个概念后，我们进入今天想要聊的关与PC端的几个问题：
1、PC端官网还有必要做吗？
2、后台管理系统的设计价值在哪里？
3、与开发工程师交付时踩过的那些坑
一、PC端官网还有必要做吗？
现在越来越移动端化，有人会问是否还有必要浪费资源做PC端的官网？但其实PC端还是要做的，只不过是需要用可适配的web端技术来做，而不是PC端和移动端分开来做，当然呈现形式和一屏的展示内容会有所不同，要遵循不同设备上的交互规则和操作习惯，来做一些个性化的调整。但整体的内容呈现和操作逻辑要相同，不然两端相差太大会给用户一定的学习和操作成本。
互联网人的操作习惯一般都是先上网了解下该公司的相关信息，然后再决定是否会选择这家公司，不管是购买服务产品还是其他。电脑端的特性就是内容呈现较丰富，对于坐在电脑前或使用电脑比较方便的用户来说，是便于查询信息的最佳选择。当用户经过查询企业的相关信息后觉得比较满意、感兴趣，才有可能会去下载移动端来进行产品的进一步体验；所以说PC端是一个重要的引流方式，不可或缺。比如官网一般长这样，第一屏幕里有显眼的引导下载移动端的入口。
图片来自网络
二、后台系统的设计价值在哪里？
后台管理系统一般被称为B端，即大多面向企业内部员工操作，用于流程的管控与操作，不同部门间的审核流转；再一个是作为平台提供给商家的后台订单管理系统，比如一般都有商户端（B端）和用户端（C端），而企业内部管理系统作为商户端和用户端的连接点来进行整体监督和管控。
为了更好的迭代和优化、节约资源成本，小公司一般基于大公司做的开放组件库来套入自己的业务内容，稍许调整就可以使用，省时省力。而大公司资源丰富，组成专业团队来自行设计、开发属于自己公司的组件库，更贴合自身公司的业务场景和产品需求，更能灵活运用，从而提高统一性、效率性。如饿了么的 element、阿里蚂蚁金服的 Ant Design 都是使用率较高的第三方开放组件库。
图片来自网络
既然说小公司做后台管理系统一般都是套用大公司的组件库，那是不是说产品出了需求后，不用经过交互和界面设计就直接可以找开发同学套模版上线了？我不认为是这样，产品需求只是在描述要做的事情，但至于怎么页面交互更能让用户便于操作，怎样的界面元素展示更能让用户明了要传达的信息，减少其理解成本，这些都是提高人效的考虑因素，虽然是公司内部人员使用，但和C端产品一样都是服务于“人”这个对象，也要遵循”人“的理解能力和操作习惯。不同的是B端在操作和名词上允许有一些行业内的专业术语，要尽量贴合日常中的一些称呼，便于沟通理解。
B端产品一般信息都比较多，稍不注意就会造成功能臃肿和信息凌乱，设计难点和价值在于多角色、多场景、多节点之间的流转交互和状态的展示、更需要在深刻理解业务的基础上去做，这就要求设计师要贴近业务场景、多与产品经理和一线业务人员沟通、交流；才有可能做出提高操作人员效率的管理系统。B端产品一般都有自身核心内容的特殊性，一般没有什么参考产品可言，因为设计商业机密，成熟的行业内的大公司也不会把自己的B端产品暴露出来，供我们学习参考。这一点相对于C端来说需要一点的门槛和难度。
三、与开发交付时踩过的那些坑
1、相同色值在不同屏幕下显示不同
之前有做个一个网页端的banner，中间使用主图，当屏幕更大时，左右用纯色背景来填充；相应的只提供给开发同学一个中间的主图就可以了，左右的纯色由开发同学用代码自己写；但开发同学在给我看效果的时候，发现同一个色值在图片上的颜色和左右大码写的颜色视觉上有色差，而且还很明显，下面图来自网络，非真实案例，此处只做示例展示：
主图来自网络
上面的图这样做，大家发现有什么问题吗？当时经验还不是很足，一时不知道什么原因，就上网搜索相关资料，原来是因为不同品牌的电脑显示器显示的色彩会有差别，包括饱和度都有差别。苹果的电脑色彩显示还算比较标准，更接近标准，这也是为什么大多设计师都选择用苹果的电脑的原因之一。
不光是在这个开发小哥哥上的显示有色差，在别的电脑上可能还会展示成其他的色彩效果。这就是我们就可以理解为什么不同手机显示的界面会有所差别
问题弄清楚了，下一步就是进行调整，把banner主图的左右改为渐变透明（之前是纯色），这样不管在任何电脑上主图和两边的背景都能完美过渡融合了。如下融合示例：
图片来自网络
2、按钮的可延展性
如某个类型的按钮文案字数不是固定的，2-6个字不等，这种按钮在后台系统上很常见，有时候不能为了精简而精简，还是需要能通过准确的表达让用户一眼明了、不要让用户去猜是什么意思。由于当时没有充分了解到最少文案和最多文案的字数情况，因为产品文档上是以4个字为示例的，所以设计图上也就只给出了一个固定宽度为4个字的按钮；由于前期没有考虑周全，后期就会增加很多工作量，如重新设定最小按钮宽度（按钮2个字的时候如果固定左右的间距会显得按钮特别小），当超过4个字后再固定文案左右的间距来增加按钮宽度来适应展示：
3、表格的缩放定义
后台管理系统中常见的表格，大多组件里默认设定的每一项宽度都是等比缩放，但对于某些需求来说是不太合适的，比如表格里的信息项特别多，有的信息特别短，有的信息又特别长，如日期和地址之类的。这时候如果用默认等比缩放宽度的话就显得不太合适，必要的情况下就应该按照需求做相应的特殊性处理，比如按不同的百分比来区分展示不同项内容的宽度，或固定某些少内容的项宽度，内容多的项做缩放展示等。这样做出来的产品可能更符合需求预期，记得做之前要把自己的想法和开发同学进行沟通，如果不沟通的话，可能他也就按默认的做了，后面再调可能就有些重复性的工作了，
总结
工作中都是一个逐步积累经验的过程，不要害怕犯错而止步不前，因为不犯错可能永远也不知道它别后的原因是什么，正确的又应该是怎样的。这样的话下次才能避免一些“坑”，才能有理有据的说出这么做的理由，而不是只是感性设计。
网友评论