最近好多人问我,UI设计师需要了解前端代码吗?我的答案是肯定的作为一个UI设计师,我认为了解基本的前端操作是很有必要的。

在我刚接触设计的时候,那时做WEB页面的都叫做网页设计师,最常用的设计工具叫网页三剑客,只要掌握这三个工具就能独立制作出一整套页面,那时候的页面设计师承包了现在的交互视觉前端的一切工作。

但是,随着互联网的快速发展,人们对页面的要求越来越高,无论是设计还是前端都变得越来越专业。人们需要更多炫酷的特效和体验化的设计来制作页面。 HTML5和CSS3也越来越普及,浏览器每晚都在更新,每隔几个月就会增加新的设备和屏幕大小,而前端需要考虑的屏幕尺寸越来越多,这一切变得不再容易。设计师的职业也开始细分化,从交互到视觉再到前端...虽然流程被细分了,但是前端和视觉这两者我认为是密不可分的关系,做为UI设计师了解基本的前端代码依然十分重要。我总结了三点:

1、团队配合更轻松

设计师了解前端和前端了解设计都是相同重要的,设计师在前端能实现的前提下来制作设计稿。前端在了解基本设计规则的情况下来和设计师配合,大大提高团队效率。在一个产品开发团队中只有每个人都清楚的知道其他人在干什么才能更加明确自己手头工作的目的。但是往往很少有人会想到去了解自己并不会用上的东西。

我面试了许多UI设计师,大多设计师只是学习了基本工具的用法,和设计的基本规则。却很少能有设计师能真正了解设计的本质和产品从前期调研到后期产品上线的整个实现流程,这样的结果就是设计师在工作上没有话语权,经常会面临各种指点江山的“大神”。

2、页面设计更加合理

设计师了解浏览器的代码解析规则之后能更加合理的设计页面,不会出现超出前端范围内的设计。

3、保护自己的工作

我们工作中,很多时候前端人员并不了解设计,对审美也没有一个良好的判断,有时会根据某些无法实现的效果去对页面做一些更改。导致实现的效果和设计稿相差甚远,这也是让许多设计师头痛不已的问题。如果这时候设计师自己懂这些基本方法就能很好的保护自己的工作,保障了设计稿和最终效果的统一,在工作中也更有话语权。

当然不是让所有人去去系统学习前端代码,只是你需要了解你设计的视觉稿最后以通过什么方式实现最终效果,如果你了解了其中的原理,对你前期设计思路会更加清晰,不至于设计出超出范围的页面,也避免在工作中被开发人员牵着走。

现在我偶尔也会接触一些前端的工作,虽然算不上特别专业,但是实现一些基本页面还是没问题的。目前主要重心还是放在设计上,比起编程我还是更钟爱设计。虽然没有经过特别专业的课程和训练,但是通过自学也总结了许多设计心得和方法,也帮助了一些刚进入设计领域的新人找到了目标,这一点是我非常欣慰的。后期会慢慢在公众号上更新分享自己的方法,希望通过我的分享能帮到更多在设计这条路上的新人找到正确的方向。

前段ui需要些html代码吗,UI设计师为什么要了解前端代码?相关推荐

  1. 在线html代码测试工具,CodePen - 一个在线的前端代码编辑工具(可用于制作测试页面、代码调试)...

    有时我们需要调试一些前端代码(无论是 html.css,还是 js),或者要制作一个 demo 分享给他人.这些都可以借助 CodePen 这个网站来实现. 一.基本介绍 1,什么是 CodePen? ...

  2. 网易智慧企业 Node.js 实践(2)| 平滑发布和前端代码

    健康检查 前文提到我们通过网关把流量转发到 Node 应用,那网关是如何确定 Node 应用的可用性呢? 如果 Node 应用在发布的过程中也把流量转发过来,就会导致请求失败,所以我们的网关会对 No ...

  3. 前端代码规范网址导航(总结)

    在大公司代码规范是非常重要的一件事情,多人协作,还有代码评审.所以能写出漂亮的代码非常重要. 这就好比你自己在家,无论是穿大裤衩子,还是背心,甚至是光膀子,都没人管你.但你要出门去约会,就要把最好的一 ...

  4. 注释那些事儿:前端代码质量系列文章(一)

    摘要: 好的注释可以提高代码的可读性和可维护性,从而提高代码质量.那么什么是好的注释?如何写出好的注释? "Comment or not comment, that is the quest ...

  5. 前端代码异常日志收集与监控

    在复杂的网络环境和浏览器环境下,自测.QA测试以及 Code Review 都是不够的,如果对页面稳定性和准确性要求较高,就必须有一套完善的代码异常监控体系,本文从前端代码异常监控的方法和问题着手,尽 ...

  6. 代码控制UI,View

    在前面的几讲中,我们都是使用xml layout 来去控制UI组件,其实我们也可以完全抛开XML,用纯代码来控制我们的界面UI. 回顾我们学过的,遇到过的UI组件,有容器类的Layout:Linear ...

  7. Java代码控制UI界面

    介绍 在 Android 中,支持像 Java Swing 那样完全通过代码控制 UI 界面.也就是所有的 UI 组件都通过 new 关键字创建出来,然后将这些 UI 组件添加到布局管理器中,从而实现 ...

  8. QT纯代码设计UI界面Demo

    目录 一.前言 二.界面 三.源码简析 四.Demo/源码 一.前言 UI的设计方法有几种: ①一种是使用Qt Designer,也就是可视化设计,这在小型项目中常见,优点就是可观简便: ②另一种就是 ...

  9. 基于深度学习的手势识别系统(Python代码,UI界面版)

    摘要:本文详细介绍基于深度学习的手势识别系统,在介绍手势识别算法原理的同时,给出了_P__y__t__h__o__n_的实现代码以及_P__y__Q__t_的UI界面.手势识别采用了基于MediaPi ...

最新文章

  1. solr 下载 有dist目录的(6需要8)
  2. 中国Nature第一人,居然是清朝的他
  3. 2022泰晤士最新世界大学排名惹争议,这所985高校爆冷门!
  4. 华为2018届校招技术岗笔试题及个人解答
  5. BZOJ3019 : [Balkan2012]handsome
  6. 发送ActivityFeed的隐藏功能
  7. 2019-06-04 Sublime Text 中文输入法的问题
  8. ImageLoader的简单分析(四)
  9. linux驱动视频采集卡,在linux下使用视频采集卡
  10. UINO优锘:用悬疑舞台剧的方式打开3D开发工程师的一天
  11. 数据挖掘--风电机组异常数据识别与清洗
  12. 46 同位语和同位语从句(以及) to/at/for/with 用法搭配
  13. opencv4+contrib 编译
  14. 制作用于图像语义分割训练的标签数据【图像分割】【labelme】
  15. Keras BatchNormalization层
  16. 网站美工全能实战全解析-彭亮-专题视频课程
  17. java list逆序_Java的数组和list升序,降序,逆序函数Collections.sort和Arrays.sort的使用...
  18. DXperience 711 代码问题
  19. 调试HT57DJ100电机和 TB6600步进电机驱动器,滤波片轮驱动
  20. ARouter 源码分析

热门文章

  1. 益智游戏网开发之路四(网址yzyx.info)
  2. 快手上市,天使投资人张斐:内心富足、有安全感的80、90后能做出很多不一样的事...
  3. 用matlab电磁波双缝干涉实验报告,matlab演示杨氏双缝干涉实验
  4. oracle 调整输出的列宽、行宽
  5. idea常用10个快捷键
  6. python字符编码使用ascii编码储存对么_Python字符编码详解(转)
  7. mysql 编码格式_设置MySQL的字符编码
  8. android 计数器,android计数器——基础编
  9. ARCGIS展点(XY坐标)及矢量转CAD坐标显示的问题
  10. “Sky Walker Home” 春节大促活动方案设计